/* 원팡 2026 회원 스킨 — 회원 화면에만 있는 배치만. 색·글자·모서리는 레이아웃의 op-tokens / op-components 를 쓴다. */
.op-member__msg { margin-bottom: var(--op-s-4); }
.op-member__narrow { max-width: 560px; }
.op-member__form { padding: var(--op-s-8); }
.op-member__actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: var(--op-s-4); border-top: 1px solid var(--op-line); }
.op-member__actions--center { justify-content: center; padding-top: 0; border-top: 0; }
.op-member__more { display: flex; flex-wrap: wrap; gap: var(--op-s-5); margin-top: var(--op-s-4); font-size: var(--op-t-sm); }
.op-member__more a { display: inline-flex; align-items: center; gap: 6px; color: var(--op-text-3); }
.op-member__more a:hover { color: var(--op-brand-text); }
.op-member__subhead { margin: var(--op-s-8) 0 var(--op-s-3); font-size: var(--op-t-lg); font-weight: var(--op-w-black); }
.op-member__who { margin-bottom: var(--op-s-5); }
.op-member__code { font: inherit; font-weight: var(--op-w-black); letter-spacing: .04em; color: var(--op-brand-text); }
.op-member__device { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 12px; background: var(--op-surface-2); color: var(--op-text-2); }
.op-post:has(> .op-member__device) { grid-template-columns: auto minmax(0, 1fr) auto; }

.op-member__center { margin-inline: auto; }
.op-member__note { margin-top: var(--op-s-4); }
.op-member__note a { color: var(--op-brand-text); font-weight: var(--op-w-semibold); }

/* 소셜 계정(socialxe 스킨도 이 파일을 쓴다) */
.op-sns__mark { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 12px; background: var(--op-surface-3); color: var(--op-text); font-weight: var(--op-w-black); }
.op-sns__mark svg { width: 16px; height: 16px; fill: currentColor; }
.op-sns__mark[data-sns="naver"] { background: var(--op-naver); color: #fff; }
.op-sns__mark[data-sns="kakao"] { background: #FEE500; color: #191919; }
.op-sns__mark[data-sns="google"] { background: var(--op-surface); box-shadow: inset 0 0 0 1px var(--op-line-strong); }
.op-sns__status a { position: relative; z-index: 1; color: var(--op-brand-text); }
.op-post:has(> .op-sns__mark) { grid-template-columns: auto minmax(0, 1fr) auto; }

/* 목록 줄의 버튼은 줄 전체 링크 위에 올린다 */
.op-post__actions { position: relative; z-index: 1; display: flex; align-items: center; gap: 6px; flex: none; }
.op-post__actions .op-select { width: auto; height: 34px; padding: 0 30px 0 10px; font-size: var(--op-t-xs); background-position: right 8px center; }
.op-post.is-leaving { opacity: 0; transform: translateX(12px); transition: opacity var(--op-dur), transform var(--op-dur) var(--op-ease); }
.op-post__toggle { display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: inherit; font: inherit; text-align: left; }
.op-post__toggle[aria-expanded="true"] .op-icon { transform: rotate(180deg); }
.op-post__preview { margin-top: 10px; padding: 12px 14px; border-radius: var(--op-r-md); background: var(--op-surface-2); font-size: var(--op-t-sm); }

/* 스크랩 폴더 */
.op-scrapbar { align-items: center; }
.op-scrapbar__folder { display: flex; align-items: center; gap: 6px; color: var(--op-text-3); }
.op-scrapbar__folder .op-select { width: auto; min-width: 150px; height: 36px; font-size: var(--op-t-sm); }
.op-scrapbar__edit { display: flex; align-items: center; gap: 6px; }
.op-scrapbar__edit .op-input { width: 150px; height: 36px; font-size: var(--op-t-sm); }

/* 가입 */
.op-signup__perks { position: relative; overflow: hidden; align-content: start; background: linear-gradient(160deg, var(--op-brand-soft), var(--op-cream-soft) 60%, var(--op-mint-soft)); }
.op-signup__perks .op-auth__copy { position: relative; font-size: var(--op-t-2xl); }
.op-perks { position: relative; display: grid; gap: var(--op-s-4); }
.op-perks li { display: flex; align-items: flex-start; gap: 12px; }
.op-perks b { font-size: var(--op-t-md); }
.op-perks__icon { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 12px; background: var(--op-surface); color: var(--op-brand-text); box-shadow: var(--op-shadow-1); }
.op-agree { gap: 10px; }
.op-agree__item { display: grid; gap: 8px; }
.op-agree__toggle { flex: none; margin-left: auto; font-size: var(--op-t-xs); color: var(--op-text-3); text-decoration: underline; text-underline-offset: 2px; }
.op-agree__text { max-height: 220px; overflow: auto; padding: 12px 14px; border-radius: var(--op-r-md); background: var(--op-surface-2); font-size: var(--op-t-xs); line-height: 1.7; }

/* 키워드 알림 */
.op-kw { gap: 12px; }
.op-kw__main { flex: 1; min-width: 0; display: grid; gap: 2px; }
.op-kw__word { font-size: var(--op-t-md); overflow-wrap: anywhere; }
.op-kw:has(.op-switch[aria-checked="false"]) .op-kw__word { color: var(--op-text-3); }
.op-kw.is-new { animation: op-member-new 1.6s var(--op-ease); }
@keyframes op-member-new { 0% { background: var(--op-brand-soft); } 100% { background: transparent; } }

/* 알림(ncenterlite 스킨도 이 파일을 쓴다) */
.op-noti-list .op-post { grid-template-columns: auto minmax(0, 1fr); }
.op-noti-list .op-post[data-unread="Y"] { background: color-mix(in srgb, var(--op-brand-soft) 50%, transparent); }
.op-noti-list__text a { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.op-noti-config .op-list__item { align-items: flex-start; justify-content: space-between; gap: var(--op-s-4); padding: 14px 0; }
.op-noti-config__main { display: grid; gap: 4px; min-width: 0; }
.op-noti-config__ways { display: flex; flex: none; gap: var(--op-s-4); }
.op-noti-popup { max-width: 420px; margin: var(--op-s-6) auto; }

/* 쪽지·친구(communication 스킨도 이 파일을 쓴다) */
.op-msgtabs { margin-bottom: var(--op-s-4); }
.op-msgallow .op-select { min-width: 160px; }
.op-msglist__bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; padding: 10px var(--op-s-5); background: var(--op-surface-2); }
.op-msglist__acts { display: flex; align-items: center; gap: 6px; }
.op-msglist__acts .op-select { width: auto; height: 34px; padding: 0 30px 0 10px; font-size: var(--op-t-xs); background-position: right 8px center; }
.op-msglist__check { position: relative; z-index: 1; width: 18px; height: 18px; accent-color: var(--op-brand); }
.op-post:has(> .op-msglist__check) { grid-template-columns: auto minmax(0, 1fr) auto; }
.op-msglist .op-post[data-unread="Y"] .op-post__title a { font-weight: var(--op-w-black); }
.op-msgread { display: grid; gap: var(--op-s-4); margin-bottom: var(--op-s-4); }
.op-msgread__head { display: grid; gap: 6px; padding-bottom: var(--op-s-3); border-bottom: 1px solid var(--op-line); }
.op-msgread__title { font-size: var(--op-t-xl); font-weight: var(--op-w-black); }
.op-msgread__files { display: flex; flex-wrap: wrap; gap: 6px; }
.op-popup { padding: var(--op-s-5) 16px; background: var(--op-bg); min-height: 100vh; }

/* 안내 메시지(message 스킨도 이 파일을 쓴다) */
.op-sysmsg { margin-top: var(--op-s-4); }
.op-sysmsg__head { padding: var(--op-s-4) 0 0; }
.op-sysmsg__head b { font-size: var(--op-t-lg); color: var(--op-text); }
.op-sysmsg__head .op-sysmsg__code { font-size: 64px; font-weight: var(--op-w-black); line-height: 1; letter-spacing: -0.04em; color: var(--op-brand); }
.op-sysmsg__search { width: 100%; }
.op-sysmsg-page { min-height: 100vh; display: grid; align-content: center; justify-items: center; gap: var(--op-s-5); padding: var(--op-s-6) 16px; background: var(--op-bg); }
.op-sysmsg-page .op-sysmsg { width: 100%; margin-top: 0; }

/* 대시보드 */
a.op-tile { display: block; transition: background var(--op-dur); }
a.op-tile:hover { background: var(--op-brand-soft); }
.op-my__tabs { margin: calc(var(--op-s-2) * -1) 0 var(--op-s-3); }
.op-my__all { margin-top: var(--op-s-3); }
.op-noti[data-unread="Y"] .op-list__title { font-weight: var(--op-w-semibold); color: var(--op-text); }
.op-noti[data-unread="Y"]::before { content: ""; width: 6px; height: 6px; flex: none; border-radius: 50%; background: var(--op-brand); }

@container site (max-width: 760px) {
	.op-member__form { padding: var(--op-s-5); }
	.op-member__actions .op-btn { flex: 1; }
	.op-noti-config .op-list__item { flex-direction: column; gap: 10px; }
	.op-scrapbar { width: 100%; }
	.op-scrapbar__folder { flex: 1; }
	.op-scrapbar__folder .op-select { flex: 1; }
}

/* 가격 알림 목록 */
.op-watch__desc { margin: -6px 0 var(--op-s-3); }
.op-watch__item { gap: 12px; }
.op-watch__item .op-thumb { flex: none; width: 48px; aspect-ratio: 1; border-radius: var(--op-r-sm); }
.op-watch__main { display: grid; gap: 2px; flex: 1; min-width: 0; }
.op-watch__main .op-list__title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }