/* 50% = 원형 요소 전용. 이 파일의 border-radius:50% 25건은 전부 원형 요소(아바타·상태 도트·삭제 버튼·재생 아이콘 원판) 전용
   — CLAUDE.md §8-2 ② 사유 주석. 전건 셀렉터를 대조해 확인했다(2026-08-06). */
/* PAGE LAYOUT 공통 */
.page-main{padding-top:16px}
.page-form{max-width:none;margin:0 auto;padding-top:16px}

/* NAV DROPDOWN PORTAL */
#ndp{position:fixed;top:50px;background:var(--sur);border:1px solid var(--bor);border-radius:0 var(--r) var(--r) var(--r);min-width:130px;box-shadow:0 8px 20px rgba(0,0,0,.35);z-index:var(--z-nav-drop);padding:4px 0;display:none}
.nav-drop-item{padding:9px 16px;font-size:12px;color:var(--t2);cursor:pointer;white-space:nowrap;transition:background .1s;font-weight:500}
.nav-drop-item:hover{background:var(--bg3);color:var(--t1)}
.nav-drop-sep{height:1px;background:var(--bor);margin:3px 0}

/* COMMUNITY TABS */
.comm-tab-bar{display:flex;align-items:center;gap:2px;padding:10px 0 8px;border-bottom:1px solid var(--bor);margin-bottom:12px;overflow:hidden}
.comm-tab{padding:5px 11px;border-radius:var(--rad);font-size:12px;font-weight:600;cursor:pointer;color:var(--t2);white-space:nowrap;transition:all .15s;background:none;border:none;font-family:inherit}
.comm-tab:hover{color:var(--t1)}
.comm-tab.on{background:var(--acc);color:var(--c-white)}

/* COMMUNITY HOME */
.comm-home-wrap{display:flex;gap:16px;align-items:flex-start}
.comm-home-main{flex:1;min-width:0}
.comm-home-side{width:200px;flex-shrink:0}
.comm-section-title{font-size:12px;font-weight:800;color:var(--t3);letter-spacing:.05em;text-transform:uppercase;margin-bottom:8px;padding-bottom:5px;border-bottom:1px solid var(--bor)}
.comm-hot-row{display:flex;align-items:center;gap:6px;padding:7px 0;border-bottom:1px solid var(--bor);cursor:pointer}
.comm-hot-row:hover .comm-hot-title{color:var(--acc)}
.comm-hot-rank{font-size:11px;font-weight:800;width:18px;text-align:center;flex-shrink:0;color:var(--t3)}
.comm-hot-rank.top{color:var(--acc)}
.comm-hot-title{flex:1;font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .1s}
.comm-hot-cmt{font-size:10px;color:var(--acc);font-weight:700;flex-shrink:0}
.comm-recent-title{font-size:12px;font-weight:800;color:var(--t3);letter-spacing:.05em;text-transform:uppercase;margin:16px 0 8px;padding-bottom:5px;border-bottom:1px solid var(--bor)}

/* HUB PAGE */
.hub-page-wrap{display:flex;gap:14px;align-items:flex-start}
.hub-main{flex:1;min-width:0}
.hub-main--solo{width:100%;min-width:0}
.hub-side{width:190px;flex-shrink:0}
.hub-header{display:flex;align-items:center;gap:10px;padding:12px;border-bottom:1px solid var(--bor);background:var(--bg2);border-radius:var(--r) var(--r) 0 0}
.hub-header-thumb{width:48px;height:48px;border-radius:var(--r);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:900;color:var(--c-white)}
.hub-header-name{font-size:15px;font-weight:800;margin-bottom:2px}
.hub-header-meta{font-size:10px;color:var(--t3)}
.hub-fav-btn{padding:3px 9px;border-radius:var(--rad);font-size:11px;font-weight:700;border:1px solid var(--bor);color:var(--t2);background:none;cursor:pointer;font-family:inherit;flex-shrink:0;white-space:nowrap;transition:all .15s}
.hub-fav-btn.on,.hub-fav-btn:hover{border-color:var(--acc);color:var(--acc)}
.hub-toolbar{display:flex;align-items:center;gap:5px;padding:7px 12px;border-bottom:1px solid var(--bor);background:var(--bg2)}
.hub-search{flex:1;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);padding:3px 8px;font-size:12px;color:var(--t1);outline:none;font-family:inherit}
.hub-search::placeholder{color:var(--t3)}.hub-write-btn{padding:3px 10px;border-radius:var(--rad);font-size:11px;font-weight:700;background:var(--acc);color:var(--c-white);border:none;cursor:pointer;font-family:inherit;white-space:nowrap}
.hub-write-btn:hover{background:var(--acc2)}
.hub-list-head{display:flex;align-items:center;padding:5px 0;background:var(--bg3);border-bottom:1px solid var(--bor);font-size:10px;font-weight:700;color:var(--t3)}
.hub-post-row{display:flex;align-items:center;border-bottom:1px solid var(--bor);cursor:pointer;transition:background .1s;min-width:0;min-height:36px}
.hub-post-row:hover{background:var(--bg2)}
.hub-post-row.pinned{background:color-mix(in srgb,var(--acc) 6%,transparent)}
.hub-upvote-col{width:38px;flex-shrink:0;text-align:center;font-size:13px;font-weight:800;color:var(--acc);padding:4px 2px}
.hub-badge-col{width:36px;flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:4px 2px}
.hub-post-badge{font-size:9px;font-weight:800;padding:1px 4px;border-radius:var(--rad);white-space:nowrap}
.hub-post-badge.hot{background:var(--acc);color:var(--c-white)}
.hub-post-badge.notice{background:#2266cc;color:var(--c-white)}
.hub-post-badge.info{background:#227755;color:var(--c-white)}
.hub-title-col{flex:1;min-width:0;padding:4px 4px}
.hub-post-title{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline}
.hub-post-cmt{font-size:11px;color:var(--acc);font-weight:700;margin-left:3px}
.hub-author-col{width:68px;flex-shrink:0;font-size:10px;color:var(--t3);text-align:center;padding:4px 3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hub-date-col{width:50px;flex-shrink:0;font-size:10px;color:var(--t3);text-align:center;padding:4px 3px;white-space:nowrap}
.hub-views-col{width:46px;flex-shrink:0;font-size:10px;color:var(--t3);text-align:right;padding:4px 8px;white-space:nowrap}
.hub-side-box{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);overflow:hidden;margin-bottom:10px}
.hub-side-title{font-size:11px;font-weight:800;padding:8px 12px;border-bottom:1px solid var(--bor);color:var(--t2)}
.hub-side-item{display:flex;align-items:center;gap:6px;padding:6px 12px;border-bottom:1px solid var(--bor);cursor:pointer;font-size:11px;transition:background .1s}
.hub-side-item:hover{background:var(--bg3)}
.hub-side-item:last-child{border-bottom:none}
.hub-side-rank{width:16px;font-size:10px;font-weight:800;color:var(--t3);flex-shrink:0;text-align:center}
.hub-side-rank.top{color:var(--acc)}
.hub-side-post{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}

/* POST DETAIL */
.hub-detail-head{padding:14px 12px;border-bottom:1px solid var(--bor)}
.hub-detail-title{font-size:16px;font-weight:800;margin-bottom:6px;line-height:1.3}
.hub-detail-meta{font-size:11px;color:var(--t3)}
.hub-detail-body{padding:16px 12px;min-height:120px;font-size:13px;line-height:1.8;border-bottom:1px solid var(--bor);white-space:pre-line;color:var(--t1)}
.hub-detail-foot{display:flex;gap:8px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--bor)}
.hub-like-btn{display:flex;align-items:center;gap:4px;padding:5px 14px;border-radius:var(--rad);border:1px solid var(--bor);color:var(--t2);background:none;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .15s}
.hub-like-btn:hover{border-color:var(--acc);color:var(--acc)}
.hub-post-nav-row{display:flex;justify-content:space-between;padding:8px 12px;font-size:11px;border-bottom:1px solid var(--bor);color:var(--t3)}
.hub-post-nav-row span{cursor:pointer;color:var(--t2)}
.hub-post-nav-row span:hover{color:var(--acc)}

/* LIBRARY FAV PANEL */

/* RATING SYSTEM */
.rat-overview{background:var(--bg2);border-radius:var(--r);padding:14px 16px}
.rat-main-row{display:flex;align-items:center;gap:16px;margin-bottom:8px}
.rat-score-big{font-size:42px;font-weight:900;color:var(--acc);letter-spacing:-2px;line-height:1}
.rat-score-label{font-size:10px;color:var(--t3);margin-top:3px;text-align:center}
.rat-axes{display:flex;flex-direction:column;gap:7px;flex:1}
.rat-axis-row{display:flex;align-items:center;gap:8px}
.rat-axis-lbl{font-size:10px;color:var(--t3);width:32px;flex-shrink:0}
.rat-axis-bar{flex:1;height:4px;background:var(--bor);border-radius:var(--rad);overflow:hidden}
.rat-axis-fill{height:100%;background:var(--acc);border-radius:var(--rad);transition:width .4s}
.rat-axis-val{font-size:11px;font-weight:700;color:var(--t1);width:28px;text-align:right;flex-shrink:0}
.rat-count{font-size:10px;color:var(--t3)}
.rat-status-dist{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.rat-status-chip{font-size:10px;padding:2px 7px;border-radius:var(--r);background:var(--bg3);color:var(--t2);font-weight:600}
.rat-status-chip.watching{background:#1a3a5c;color:#60a5fa}
.rat-status-chip.drop{background:#3a1a1a;color:#f87171}
.rat-status-chip.binge{background:#1a3a2a;color:#4ade80}
.rat-status-chip.review{background:#2a1a3a;color:#c084fc}
.rat-divider{height:1px;background:var(--bor);margin:10px 0}
.rat-my-row{display:flex;align-items:center;gap:8px}
.rat-my-lbl{font-size:11px;color:var(--t2);flex:1}
/* 평가하기·평론작성 동일: 빨강 채움 + 테두리 1px(외곽 사이즈 통일) */
.rat-input-btn{display:inline-flex;align-items:center;padding:5px 14px;border-radius:var(--rad);font-size:11px;font-weight:700;border:1px solid var(--acc);color:var(--c-white);background:var(--acc);cursor:pointer;transition:all .15s;font-family:inherit;flex-shrink:0}
.rat-input-btn:hover{background:var(--acc2);border-color:var(--acc2)}
.rat-input-wrap{background:var(--bg3);border-radius:var(--r);padding:12px 14px;margin-top:10px;display:none}
.rat-input-wrap.open{display:block}
.rat-input-axes{display:flex;flex-direction:column;gap:12px;margin-bottom:10px}
.rat-input-axis{display:flex;align-items:center;gap:8px}
.rat-input-axis-lbl{font-size:11px;color:var(--t2);width:36px;flex-shrink:0}
.rat-slider{flex:1;cursor:pointer;accent-color:var(--acc);height:4px}
.rat-slider-val{font-size:13px;font-weight:700;color:var(--acc);min-width:22px;text-align:right;flex-shrink:0;white-space:nowrap}
.rat-my-total-row{display:flex;align-items:center;justify-content:flex-end;gap:6px;margin-bottom:10px;font-size:11px;color:var(--t3)}
.rat-submit-row{display:flex;gap:6px;justify-content:flex-end}

/* EPISODE RATING DISPLAY (회차 목록) */
.ep-rat{display:flex;align-items:center;gap:3px;font-size:11px;color:var(--t3);flex-shrink:0;white-space:nowrap;cursor:pointer;padding:2px 5px;border-radius:var(--rad);transition:color .15s;line-height:1}
.ep-rat:hover{color:var(--acc)}
.ep-rat-my{font-size:11px;font-weight:800;color:var(--acc);margin-left:4px;white-space:nowrap;cursor:default}
.ep-rat-my[data-tip]{position:relative}
.ep-rat-my[data-tip]::after{content:attr(data-tip);position:absolute;top:calc(100% + 5px);right:0;white-space:nowrap;background:var(--bg4);color:var(--t1);font-size:10px;font-weight:600;padding:3px 7px;border-radius:var(--rad);opacity:0;pointer-events:none;transition:opacity .15s;z-index:var(--z-dropdown);box-shadow:0 2px 8px rgba(0,0,0,.4)}
.ep-rat-my:hover[data-tip]::after{opacity:1}

/* EPISODE RATING INPUT (댓글 패널) */
.ep-rat-input-wrap{background:var(--bg2);border-radius:var(--r);padding:10px 12px;margin-bottom:8px}
.ep-rat-input-lbl{font-size:11px;font-weight:700;color:var(--t2);margin-bottom:7px}
.ep-rat-nums{display:flex;gap:3px;flex-wrap:wrap}
.ep-rat-num{width:27px;height:27px;border-radius:var(--rad);font-size:12px;font-weight:700;border:1px solid var(--bor);color:var(--t3);background:none;cursor:pointer;transition:all .15s;font-family:inherit;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ep-rat-num:hover{border-color:var(--acc);color:var(--acc)}
.ep-rat-num.on{background:var(--acc);border-color:var(--acc);color:var(--c-white)}

/* COMMENT SYSTEM */
.cmt-viewall{font-size:11px;color:var(--acc);cursor:pointer;padding:3px 10px;border:1px solid var(--acc);border-radius:var(--rad);background:none;font-family:inherit;transition:all .15s}
.cmt-viewall:hover{background:var(--acc);color:var(--c-white)}
.cmt-tabs{display:flex;border-bottom:1px solid var(--bor);margin-bottom:8px}
.cmt-tab{padding:6px 12px;font-size:12px;font-weight:500;color:var(--t3);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;transition:all .15s;white-space:nowrap}
.cmt-tab:hover{color:var(--t1)}
.cmt-tab.on{color:var(--acc);border-bottom-color:var(--acc);font-weight:700}
.cmt-tab-sep{flex:1}
.cmt-sort-row{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.cmt-sort-btn{font-size:11px;color:var(--t3);cursor:pointer;background:none;border:none;font-family:inherit;padding:2px 0;transition:color .15s}
.cmt-sort-btn.on{color:var(--t1);font-weight:700}
.cmt-list{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.cmt-char-cnt{font-size:10px;color:var(--t3)}

/* 작품 상세 페이지 (모달 아님, 1fr 가변 폭) */
.work-page{padding-top:16px}
.work-back{background:none;border:none;color:var(--acc);font-size:13px;cursor:pointer;padding:0;margin-bottom:12px;font-family:inherit}
.work-card{background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);overflow:hidden}

/* 시네마틱 히어로 */
.work-hero{position:relative;overflow:hidden}
.work-hero-bg{position:absolute;inset:0;background-size:cover}
.work-hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.5}
/* 다크 스크림 — 테마 무관 백색 텍스트 가독성 확보 */
.work-hero-fade{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.5) 45%,rgba(0,0,0,.15) 100%),linear-gradient(to right,rgba(0,0,0,.6) 0%,transparent 65%)}
.work-hero-inner{position:relative;z-index:1;display:flex;gap:20px;align-items:flex-end;padding:36px 28px 24px}
.work-poster{width:180px;flex-shrink:0;aspect-ratio:3/4;border-radius:var(--r-sm);overflow:hidden;box-shadow:0 4px 18px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.12);position:relative;background-size:cover;cursor:zoom-in}
.work-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.work-poster-zoom{position:absolute;top:6px;right:6px;z-index:1;width:24px;height:24px;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;display:flex;align-items:center;justify-content:center;opacity:.75;transition:opacity .15s,background .15s}
.work-poster:hover .work-poster-zoom{opacity:1;background:rgba(0,0,0,.82)}
.clb-img{max-width:90vw;max-height:90vh;object-fit:contain;border-radius:var(--r);box-shadow:0 8px 40px rgba(0,0,0,.6);cursor:zoom-out}
.zoomable{cursor:zoom-in}
.post-detail-text img{cursor:zoom-in;max-width:100%;height:auto}
/* 본문 이미지 오버플로 방지 — 정화기(sanitizeWikiHTML)가 정렬 클래스 외 img class 를 전부 드롭하므로
   클래스가 아니라 컨테이너로 잡는다(.content-img 는 CSS 규칙 자체가 repo 0건). .ed-spoiler 열거 관례 답습.
   ★대상은 2곳뿐이다 — .wiki-body 는 components.css(앵커 `.wq-edit img,.wiki-body img`)가 이미
   max-width:100%;height:auto 를 공급한다(QA 홀드아웃 실측: 그 조각을 꺼도 computed 변화 0). 열거하면
   같은 셀렉터·같은 특이도(0,1,1) 이중 선언이 되어 pages 가 조용히 이기고, 나중에 components 쪽 값을
   바꿔도 아무 일이 안 일어나는 유령 버그가 된다(§8 중복 금지).
   ★cursor:zoom-in 은 .post-detail-text 에만 유지 — 확대 핸들러(editor.js, 앵커 closest('.post-detail-text'))가
   그 컨테이너만 매칭한다. 두 곳에 커서를 주면 클릭이 안 되는 거짓 약속이 된다. 확대 확장은 별건. */
.rev-card-body img,.editor-preview img{max-width:100%;height:auto}
.work-hero-meta{flex:1;min-width:0;padding-bottom:4px}
.work-title{font-size:32px;font-weight:900;line-height:1.1;letter-spacing:-1px;color:var(--c-white);text-shadow:0 2px 8px rgba(0,0,0,.6);margin-top:8px}
.work-submeta{font-size:13px;color:rgba(255,255,255,.72);margin-top:8px}
.work-hero .mb{color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.3)}
.work-hero .work-progress-bar{background:rgba(255,255,255,.22)}
.work-hero .work-progress-txt{color:rgba(255,255,255,.6)}
.work-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.work-btn-primary{padding:10px 22px;background:var(--acc);color:var(--c-white);font-size:13px;font-weight:700;border-radius:var(--r-sm);cursor:pointer;font-family:inherit;border:none;transition:opacity .15s}
.work-btn-primary:hover{opacity:.9}
.work-btn{padding:10px 16px;background:rgba(255,255,255,.08);color:var(--t1);font-size:13px;font-weight:600;border-radius:var(--r-sm);cursor:pointer;font-family:inherit;border:1px solid var(--bor);transition:all .15s}
.work-btn:hover{border-color:var(--acc);color:var(--acc)}
.work-btn.on{background:var(--acc);border-color:var(--acc);color:var(--c-white)}

/* ===== LIB STATUS BADGE (SVG pill) ===== */
.lib-status-badge{display:inline-flex;align-items:center;gap:4px;border-radius:var(--rad);font-weight:600;line-height:1;white-space:nowrap;border:1px solid transparent;vertical-align:middle}
.lib-status-badge svg{flex-shrink:0}
.lib-status-badge--sm{font-size:11px;padding:3px 8px;--badge-icon-size:12px}
.lib-status-badge--sm svg{width:12px;height:12px}
.lib-status-badge--watching{background:none;border-color:transparent;color:var(--st-watching);padding-left:0;padding-right:0}
.lib-status-badge--binge{background:none;border-color:transparent;color:var(--st-binge);padding-left:0;padding-right:0}
.lib-status-badge--completed{background:none;border-color:transparent;color:var(--st-completed);padding-left:0;padding-right:0}
.lib-status-badge--onhold{background:none;border-color:transparent;color:var(--st-onhold);padding-left:0;padding-right:0}
.lib-status-badge--dropped{background:none;border-color:transparent;color:var(--st-dropped);padding-left:0;padding-right:0}
.lib-status-badge--interested{background:none;border-color:transparent;color:var(--acc);padding-left:0;padding-right:0}
.lib-status-badge--hiatus{background:none;border-color:transparent;color:var(--st-hiatus);padding-left:0;padding-right:0}

/* ===== WORK STATUS (작품 상태 관리) ===== */
.st-watching{color:var(--st-watching)}.st-completed{color:var(--st-completed)}
.st-onhold{color:var(--st-onhold)}.st-dropped{color:var(--st-dropped)}
.st-interested{color:var(--acc)}.st-binge{color:var(--st-binge)}.st-hiatus{color:var(--st-hiatus)}
.work-status-wrap{position:relative;display:inline-block}
.work-status-btn.on{background:transparent;border-color:currentColor;color:currentColor}
.work-status-drop{min-width:190px;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rad);box-shadow:0 8px 24px rgba(0,0,0,.4);z-index:var(--z-dropdown);overflow:hidden;padding:4px 0}
.work-status-item{display:flex;align-items:center;gap:10px;padding:9px 14px;font-size:13px;cursor:pointer;color:var(--t1)}
.work-status-item:hover{background:var(--bg2)}
.work-status-item.on{font-weight:700}
.work-status-item .ico{width:18px;text-align:center;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.work-status-sep{height:1px;background:var(--bor);margin:4px 0}
.work-status-item.danger{color:var(--neg)}
/* ── 라이브러리 상단탭(작품|팔로우) + 팔로우 탭(.flw-*) — 4영역 ⑤ ── */
@keyframes flw-av-ring-grow{0%{transform:scale(1);box-shadow:var(--flw-hold-ring-0);border-color:var(--bor)}30%{transform:scale(1.07);box-shadow:0 0 0 1.8px rgba(47,148,96,.5);border-color:var(--acc2)}100%{transform:scale(var(--flw-hold-av-scale-end));box-shadow:var(--flw-hold-ring-end);border-color:var(--acc)}}
.flw-ghost{position:fixed;pointer-events:none;z-index:var(--flw-ghost-z);display:flex;flex-direction:column;align-items:center;gap:6px}
.flw-ghost__av{width:var(--flw-ghost-av-size);height:var(--flw-ghost-av-size);border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden;border:2.5px solid var(--acc);box-shadow:var(--flw-ghost-av-shadow);animation:flw-ghost-settle var(--flw-ghost-pop-duration) var(--flw-ease-spring) forwards}
@keyframes flw-ghost-settle{from{transform:scale(var(--flw-ghost-pop-from-scale));opacity:.85}to{transform:scale(1);opacity:1}}
.flw-ghost__av--init{font-size:28px;font-weight:800;color:var(--c-white)}
/* 드래그 고스트 아바타 색 — 카드(.lbz .fav--N)와 같은 팔레트를 쓴다. 고스트는 document.body 직속이라
   .lbz 스코프가 안 닿아 여기 둔다. 색 정본은 base.css --flw-av-1..8 하나뿐(값 중복 아님, L5). */
.flw-ghost__av.fav--1{background:var(--flw-av-1)}
.flw-ghost__av.fav--2{background:var(--flw-av-2)}
.flw-ghost__av.fav--3{background:var(--flw-av-3)}
.flw-ghost__av.fav--4{background:var(--flw-av-4);color:#1a1400}
.flw-ghost__av.fav--5{background:var(--flw-av-5)}
.flw-ghost__av.fav--6{background:var(--flw-av-6)}
.flw-ghost__av.fav--7{background:var(--flw-av-7)}
.flw-ghost__av.fav--8{background:var(--flw-av-8)}
.flw-ghost__name{font-size:12px;font-weight:700;color:var(--flw-ghost-name-color);text-shadow:var(--flw-ghost-name-shadow);white-space:nowrap;max-width:96px;overflow:hidden;text-overflow:ellipsis;animation:flw-ghost-name-in var(--flw-ghost-pop-duration) var(--flw-ease-spring) forwards}
@keyframes flw-ghost-name-in{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
.flw-drop-indicator{position:absolute;top:4px;bottom:4px;width:var(--flw-drop-indicator-width);background:var(--flw-drop-indicator-color);box-shadow:var(--flw-drop-indicator-glow);border-radius:var(--rad);pointer-events:none;z-index:var(--z-card-layer-3);animation:flw-indicator-in var(--flw-drop-indicator-anim) var(--flw-ease-spring) forwards}
@keyframes flw-indicator-in{from{opacity:0;transform:scaleY(.3) scaleX(1.5)}to{opacity:1;transform:scaleY(1) scaleX(1)}}
.flw-sec-hint{font-size:11px;color:var(--t3);opacity:.55}
.flw-unfollow{position:absolute;top:0;right:0;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--bg2);border:1.5px solid var(--bor);color:var(--t3);opacity:0;transition:opacity .18s,background .15s,border-color .15s,color .15s;cursor:pointer;z-index:var(--z-card-layer-2)}
.flw-unfollow:hover{background:rgba(47,148,96,.18);border-color:var(--acc);color:var(--acc)}
.flw-empty-sec{display:flex;align-items:center;gap:12px;padding:16px;background:var(--bg2);border:1px dashed var(--bor);border-radius:var(--r);color:var(--t3);font-size:13px}
.flw-empty-all{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 0;text-align:center;gap:16px}
.flw-empty-all__t{font-size:14px;color:var(--t2);font-weight:700}
.flw-empty-all__d{font-size:13px;color:var(--t3);line-height:1.8}
.binge-input-row{display:flex;align-items:center;gap:8px;padding:7px 14px 9px;background:var(--bg2);flex-wrap:wrap}
.binge-input-row button{padding:4px 12px;background:var(--st-binge);color:var(--c-white);border:none;border-radius:var(--rad);font-size:12px;cursor:pointer;flex-shrink:0}
.binge-ep-badge{margin-left:auto;font-size:11px;background:var(--st-binge);color:var(--c-white);padding:1px 6px;border-radius:var(--rad)}
.binge-step-lbl{font-size:12px;color:var(--t2);flex-shrink:0}
.binge-stepper{display:inline-flex;align-items:center;gap:6px;flex-shrink:0}
.binge-stepper button{width:24px;height:24px;padding:0;background:var(--bg3);color:var(--t1);border:1px solid var(--bor);border-radius:var(--rad);font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.binge-stepper button:hover{border-color:var(--st-binge);color:var(--st-binge)}
.binge-stepper #binge-cnt-val{min-width:18px;text-align:center;font-size:13px;font-weight:700;color:var(--t1)}
.binge-hint{font-size:11px;color:var(--t3);flex-basis:100%}
.work-progress{display:flex;align-items:center;gap:10px;margin-top:14px;max-width:360px}
.work-progress-bar{flex:1;height:4px;background:var(--bor);border-radius:var(--rad);overflow:hidden}
.work-progress-fill{height:100%;background:var(--acc);border-radius:var(--rad);transition:width .4s}
.work-progress-txt{font-size:11px;color:var(--t3);white-space:nowrap}
@media(max-width:640px){
  .work-hero-inner{flex-direction:column;align-items:stretch;padding:20px 16px}
  .work-poster{width:120px}
  .work-title{font-size:24px}
}

/* 섹션 위계 (평론 > 댓글 > 보러가기 > 회차) */
.work-sec-head{display:flex;align-items:center;justify-content:space-between;margin:20px 0 10px}
.work-sec-title{font-size:15px;font-weight:800;color:var(--t1)}
.work-review-list{display:flex;flex-direction:column;gap:8px}
.work-empty{padding:22px;text-align:center;color:var(--t3);font-size:13px;background:var(--bg2);border-radius:var(--r-sm)}
/* .work-empty-cta 폐지 — 평론 쓰기 버튼 3중 중복 제거(헤더 sec-hd .more로 통일), 사용처 0 확인 */
/* 댓글: 평론보다 가벼운 위계 */
.work-comments{margin-top:8px;padding-top:4px}
.work-hub-post{padding:7px 2px;font-size:14px;color:var(--t1);cursor:pointer;border-bottom:1px solid var(--bor2)}
.work-hub-post:hover{color:var(--acc)}
/* 회차 헤더 */
.work-ep-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.work-ep-head .msec-t{margin-bottom:0;border:none;padding:0}
.work-ep-prog{font-size:11px;color:var(--t3)}
.work-ep-controls{display:flex;align-items:center;gap:10px}
.work-ep-sort-btn{background:none;border:1px solid var(--bor);color:var(--t2);font-size:11px;padding:3px 8px;border-radius:var(--r-sm);cursor:pointer;display:inline-flex;align-items:center;gap:3px;font-family:inherit}
.work-ep-sort-btn:hover{color:var(--t1);border-color:var(--bor2)}

/* COMMENT PANEL(.cmt-panel 구 스킨) — S5(진 스타일)에서 .csheet/.cpanel(work-detail-zine.css, .wdz 스코프)로 대체. 클래스 미사용 확인 후 제거. */

/* REVIEW SYSTEM */
.rev-list{display:flex;flex-direction:column;gap:0;margin-top:8px}
.rev-card-avatar{width:28px;height:28px;border-radius:50%;background:var(--acc-dim);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--acc);flex-shrink:0}
.rev-card-tier{font-size:9px;padding:1px 5px;border-radius:var(--rad);font-weight:800;flex-shrink:0}
.rev-card-tier.master{background:#f0d060;color:#7a5000}
.rev-card-tier.pro{background:#b8c8d8;color:#2a3848}
.rev-card-tier.general{background:#c8a880;color:#5a3a10}
.rev-card-tier.rookie{background:var(--bg4);color:var(--t3)}
.rev-card-fav{font-size:9px;padding:1px 5px;border-radius:var(--rad);background:var(--acc-dim);color:var(--acc);font-weight:700;flex-shrink:0}
.rev-card-work{font-size:11px;color:var(--acc);margin-bottom:5px}
.rev-card-spoil{font-size:10px;color:var(--spoiler);font-weight:700;margin-bottom:4px}
.rev-sort-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.rev-sort-btn{font-size:11px;color:var(--t3);cursor:pointer;background:none;border:none;font-family:inherit;padding:2px 0;transition:color .15s}
.rev-sort-btn.on{color:var(--t1);font-weight:700}
/* 평가하기(.rat-input-btn)와 동일: 빨강 채움 + 테두리 1px */
.rev-write-btn{display:inline-flex;align-items:center;padding:5px 14px;background:var(--acc);color:var(--c-white);border:1px solid var(--acc);border-radius:var(--rad);font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .15s;flex-shrink:0}
.rev-write-btn:hover{background:var(--acc2);border-color:var(--acc2)}
.board-bottom-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;flex-wrap:wrap}
.write-fab{background:var(--acc);color:var(--c-white);border:none;border-radius:var(--rad);padding:7px 18px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;transition:background .15s;flex-shrink:0;margin-left:auto}
.write-fab:hover{background:var(--acc2)}
.critic-profile{background:var(--bg2);border-radius:var(--r);padding:16px;margin-bottom:12px}
.critic-profile-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.critic-profile-av{width:48px;height:48px;border-radius:50%;background:var(--acc-dim);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;color:var(--acc);flex-shrink:0}
.critic-profile-nick{font-size:16px;font-weight:800;color:var(--t1)}
.critic-profile-meta{font-size:11px;color:var(--t3);margin-top:3px;line-height:1.6}
.critic-fav-btn{padding:5px 12px;border-radius:var(--rad);font-size:11px;font-weight:700;border:1px solid var(--acc);color:var(--acc);background:none;cursor:pointer;transition:all .15s;font-family:inherit;margin-left:auto;flex-shrink:0}
.critic-fav-btn.on{background:var(--acc);color:var(--c-white)}
/* ── WORK TYPE BADGE ── */
.work-type-badge{font-size:10px;font-weight:700;padding:2px 6px;border-radius:var(--rad);flex-shrink:0;letter-spacing:.02em;white-space:nowrap}
.work-type-badge--wt{background:var(--acc-dim);color:var(--acc)}
.work-type-badge--manga{background:rgba(76,175,80,.15);color:#4caf50}
.work-type-badge--novel{background:rgba(124,77,255,.15);color:#7c4dff}
.work-type-badge--anime{background:rgba(255,152,0,.15);color:#ff9800}
.work-type-badge--etc{background:var(--bg4);color:var(--t3)}
/* ── WORK SEARCH COMBOBOX ── */
.write-work-search{position:relative;width:100%}
.write-work-inp{width:100%;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);padding:7px 10px;color:var(--t1);font-size:13px;font-family:inherit;outline:none;transition:border-color .15s}
.write-work-inp:focus{border-color:var(--acc)}
.w-wres{position:absolute;top:calc(100% + 2px);left:0;right:0;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rad);box-shadow:0 4px 16px rgba(0,0,0,.3);z-index:var(--z-dropdown);display:none;max-height:280px;overflow-y:auto}
.w-wopt{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;transition:background .1s}
.w-wopt:hover{background:var(--bg3)}
.write-work-result-name{font-size:13px;color:var(--t1);font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.write-work-result-author{font-size:11px;color:var(--t3);flex-shrink:0}
.write-work-no-result{padding:10px 12px;font-size:12px;color:var(--t3);text-align:center}
.write-work-sel-display{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);cursor:pointer;transition:border-color .15s}
.write-work-sel-display:hover{border-color:var(--acc)}
.write-work-sel-name{font-size:13px;font-weight:600;color:var(--t1);flex:1}
.write-work-sel-author{font-size:11px;color:var(--t3)}
.write-work-sel-change{font-size:11px;color:var(--acc);background:none;border:none;cursor:pointer;font-family:inherit;flex-shrink:0;padding:0}
/* ── WRITE PAGE ── */
.write-page-header{display:flex;align-items:baseline;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.write-back-btn{background:none;border:none;color:var(--acc);font-size:13px;cursor:pointer;padding:0;font-family:inherit;flex-shrink:0}
.write-page-title{font-size:18px;font-weight:700;flex-shrink:0}
.write-guide{font-size:11px;color:#e0566e}
.write-draft-notice{font-size:11px;color:var(--acc);background:var(--acc-dim);border-left:3px solid var(--acc);padding:6px 10px;border-radius:var(--rad);margin-bottom:8px}
.write-form{background:var(--bg2);border-radius:var(--r);padding:14px;display:flex;flex-direction:column;gap:10px}
.write-meta-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.write-meta-label{font-size:11px;font-weight:700;color:var(--t3);white-space:nowrap;flex-shrink:0}
.write-meta-badge{font-size:11px;font-weight:700;color:var(--acc);padding:2px 8px;background:var(--acc-dim);border-radius:var(--rad);flex-shrink:0}
.write-cat-chips{display:flex;gap:3px;flex-wrap:wrap}
.write-cat-chip{padding:3px 9px;border-radius:var(--rad);font-size:11px;font-weight:600;cursor:pointer;border:1px solid var(--bor);color:var(--t3);background:none;font-family:inherit;transition:all .12s}
.write-cat-chip:hover{border-color:var(--acc);color:var(--acc)}
.write-cat-chip.on{background:var(--acc);border-color:var(--acc);color:var(--c-white)}
.write-work-sel{flex:1;max-width:320px;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);padding:4px 8px;color:var(--t1);font-size:12px;font-family:inherit;outline:none}
.write-work-sel:focus{border-color:var(--acc)}
/* ── 평론쓰기 작품선택 2단 폼 (좌:검색/선택, 우:썸네일·평점·구독상태) ── */
/* [S7-1] 시안 비율 1fr 260px. 정본 §4 S7 행의 "2컬럼(586+264)"은 페이지 레이아웃이 아니라
   이 작품 선택 행을 가리킨 것이다 — 페이지는 시안·현행 모두 1컬럼이며 구조 변경이 아니다.
   858px 폼에서 1fr=586 · 260 으로 시안 수치와 맞는다. 클래스는 S7-2(짝 규칙 :focus 동반)까지 유지. */
.w-workgrid{display:grid;grid-template-columns:1fr 260px;gap:12px;align-items:stretch}
.revwork-left{position:relative;display:flex;flex-direction:column;gap:6px;align-self:start}
.revwork-card{position:relative;display:flex;gap:12px;padding:12px;background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r-sm)}
.revwork-card.empty{align-items:center;justify-content:center;text-align:center;color:var(--t3);font-size:12px;border-style:dashed}
.revwork-thumb{width:62px;height:88px;border-radius:var(--r-sm);object-fit:cover;flex-shrink:0;background:var(--bg4)}
.revwork-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.revwork-title{font-size:13px;font-weight:700;color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:32px}
.revwork-author{font-size:11px;color:var(--t3)}
.revwork-stbtn{position:absolute;top:8px;right:8px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--bg3);border:1px solid var(--bor);cursor:pointer;transition:border-color .15s,color .15s;color:var(--t3);padding:0}
.revwork-stbtn:hover{border-color:var(--acc)}
.revwork-stbtn svg{width:16px;height:16px}
.revwork-stbtn.set.watching{color:#1a1a1a;background:var(--st-watching);border-color:transparent}
.revwork-stbtn.set.binge{color:#fff;background:var(--st-binge);border-color:transparent}
.revwork-stbtn.set.completed{color:#fff;background:var(--st-completed);border-color:transparent}
.revwork-stbtn.set.dropped{color:#fff;background:var(--st-dropped);border-color:transparent}
.revwork-stbtn.set.interested{color:#1a1a1a;background:var(--st-interested);border-color:transparent}
.revwork-stbtn.unset{background:transparent;border-style:dashed;border-color:var(--bor2);color:var(--t3)}
.revwork-stbtn.unset:hover{border-color:var(--acc);color:var(--acc)}
.revwork-myscore{margin-top:2px;display:flex;align-items:baseline;gap:6px}
.revwork-myscore-num{font-size:24px;font-weight:800;color:var(--acc);line-height:1}
.revwork-myscore-lbl{font-size:10px;color:var(--t3)}
.revwork-axes{display:flex;flex-direction:column;gap:3px;margin-top:4px}
.revwork-axis{display:flex;align-items:center;gap:6px}
.revwork-axis-lbl{font-size:10px;color:var(--t3);width:30px;flex-shrink:0}
.revwork-axis-bar{flex:1;height:4px;background:var(--bg4);border-radius:var(--rad);overflow:hidden}
.revwork-axis-fill{height:100%;background:var(--acc);border-radius:var(--rad)}
.revwork-axis-val{font-size:10px;color:var(--t2);width:22px;text-align:right;flex-shrink:0;font-weight:600}
.revwork-rate{margin-top:2px;display:flex;flex-direction:column;gap:6px}
.revwork-rate-lbl{font-size:11px;color:var(--t2);font-weight:600}
.revwork-rate-axis{display:flex;align-items:center;gap:8px}
.revwork-rate-axis-lbl{font-size:10px;color:var(--t3);width:30px;flex-shrink:0}
.revwork-slider{flex:1;cursor:pointer;accent-color:var(--acc);height:4px}
.revwork-slider-val{font-size:12px;font-weight:700;color:var(--acc);min-width:22px;text-align:right;flex-shrink:0}
.revwork-rate-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:4px}
.revwork-rate-total{font-size:11px;color:var(--t3)}
.revwork-rate-total strong{color:var(--acc);font-size:14px;margin-left:3px}
.revwork-rate-save{font-size:12px;font-weight:700;color:#fff;background:var(--acc);border:none;border-radius:var(--r-sm);padding:6px 14px;cursor:pointer;font-family:inherit;flex-shrink:0}
.revwork-rate-save:hover{background:var(--acc2)}
/* [S7-2] 560px 분기는 s7 의 @media(max-width:720px) 로 대체했다. 우측이 260px 고정이라
   560px 까지 2열을 유지하면 좌측 검색열이 ~270px 로 눌려 작품명이 잘린다. 시안 값이 안전하다. */
.write-oneline-label{font-size:11px;font-weight:700;color:var(--acc);margin-bottom:6px;display:flex;align-items:center;gap:6px}
.write-oneline-req{font-size:10px;color:var(--t3);font-weight:600}
.write-oneline-help{font-size:11px;color:var(--t3);margin-top:5px}
.write-oneline-help b{color:var(--t2)}
/* [S7-2] 제목행은 w-titlerow/w-titleinp 로 이관. 시안은 행이 아니라 입력(.inp)이 테두리와
   포커스를 갖는 구조라 .write-title-row:focus-within 의 역할을 `.wrz .inp:focus` 가 그대로
   수행한다 = 짝 승격 불요. --oneline 수식자만 새 이름으로 셀렉터를 갱신한다. */
.write-title-row--oneline .w-titleinp{font-size:15px;font-weight:600}
.write-title-row{display:flex;align-items:center;border:1px solid var(--bor);border-radius:var(--rad);background:var(--bg3);overflow:hidden;transition:border-color .15s}
.write-title-row:focus-within{border-color:var(--acc)}
.write-title-inp{flex:1;background:transparent;border:none;color:var(--t1);font-size:14px;font-family:inherit;padding:9px 12px;outline:none}
.write-title-inp::placeholder{color:var(--t3)}
.write-title-count{font-size:10px;color:var(--t3);white-space:nowrap;padding-right:10px;flex-shrink:0}
.write-opts-row{display:flex;gap:14px;flex-wrap:wrap;padding:2px 0}
.write-opts-row label{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--t2);cursor:pointer}
.write-opts-row input[type=checkbox]{width:13px;height:13px;accent-color:var(--acc)}
.write-tag-row{display:flex;flex-direction:column;gap:4px}
.write-tag-input-row{display:flex;gap:6px;align-items:center}
.write-tag-inp{flex:1;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);padding:5px 9px;color:var(--t1);font-size:12px;font-family:inherit;outline:none;transition:border-color .15s}
.write-tag-inp:focus{border-color:var(--acc)}
.write-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:2px;flex-wrap:wrap}
.write-foot-left{display:flex;gap:6px;flex-wrap:wrap}
.write-submit-btn{padding:8px 22px!important;font-size:13px!important}
/* Color picker */
.rev-form{background:var(--bg2);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:12px}
.rev-form-row{display:flex;flex-direction:column;gap:4px}
.rev-form-lbl{font-size:11px;font-weight:700;color:var(--t2)}
.rev-form-sel,.rev-form-inp{background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);padding:7px 10px;color:var(--t1);font-size:13px;font-family:inherit;outline:none;transition:border-color .15s;width:100%}
.rev-form-sel:focus,.rev-form-inp:focus{border-color:var(--acc)}
.rev-form-ta{background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);padding:8px 10px;color:var(--t1);font-size:13px;font-family:inherit;resize:vertical;outline:none;transition:border-color .15s;line-height:1.55;min-height:140px;display:block;width:100%;box-sizing:border-box}
.rev-form-ta:focus{border-color:var(--acc)}
.rev-form-check{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--t2);cursor:pointer}
.rev-form-foot{display:flex;gap:8px;justify-content:flex-end}
.write-tag-wrap{flex:1;position:relative}
.write-tag-chips{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:4px}
.write-tag-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--r);font-size:11px;color:var(--t2)}
.write-tag-chip button{background:none;border:none;color:var(--t3);cursor:pointer;font-size:12px;padding:0;line-height:1}
.write-tag-chip button:hover{color:var(--acc)}
.write-tag-suggest{position:absolute;top:100%;left:0;right:0;background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);z-index:var(--z-dropdown);box-shadow:0 4px 12px rgba(0,0,0,.3);max-height:160px;overflow-y:auto}
.write-tag-sug-item{padding:7px 12px;font-size:12px;cursor:pointer;color:var(--t2);transition:background .1s}
.write-tag-sug-item:hover{background:var(--bg3)}
.fav-critic-badges{display:flex;flex-wrap:wrap;gap:6px;padding:4px 0 8px}
.fav-critic-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:var(--rad);background:var(--bg2);border:1px solid var(--bor2);cursor:pointer;transition:background .15s;text-decoration:none}
.fav-critic-badge:hover{background:var(--bg3)}
.fav-critic-badge-av{width:18px;height:18px;border-radius:50%;background:var(--acc-dim);display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:700;color:var(--acc);flex-shrink:0}
.fav-critic-badge-nick{font-size:11px;font-weight:700;color:var(--t1)}
.fav-critic-badge-star{font-size:9px;color:var(--acc)}

/* EPISODE COMMENT BUTTON */
.ep-cmt-btn{background:none;border:none;cursor:pointer;font-size:12px;color:var(--t3);padding:2px 5px;border-radius:var(--rad);transition:color .15s;flex-shrink:0;line-height:1;font-family:inherit}
.ep-cmt-btn:hover{color:var(--acc)}

/* ── RICH EDITOR ────────────────────────────────── */
/* [S9-3] .editor-wrap·.editor-toolbar·.editor-content 제거 — S7-2 가 마크업을 w-edwrap·ed-tb·w-ed 로
   옮겨 소비처 0 이 됐다(js·html 전수 확인). 짝이던 :empty::before 와 hr 은 S7-2 에서 .wrz 로 이관 완료.
   .editor-preview 계열은 남는다 — 리네임하지 않고 w-pv 를 병기했다(스포일러 셀렉터 리스트 공유). */
.ed-btn{min-width:26px;height:24px;border:none;background:none;color:var(--t2);cursor:pointer;border-radius:var(--rad);font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;transition:all .12s;font-family:inherit;padding:0 5px;white-space:nowrap;flex-shrink:0}
.ed-btn:hover{background:var(--bg4);color:var(--t1)}
.ed-sep{width:1px;height:16px;background:var(--bor2);margin:0 3px;align-self:center;flex-shrink:0}
/* ── [S7-2] 짝 규칙 이관 — s7 에 대응이 없어 살려야 하는 것들 ──────────────
   판정: 아래는 "시안이 그 상태를 안 그린다" 유형이다. s7 을 이기도록 .wrz 스코프로 승격한다.
   (반대 유형 = "다른 이름으로 같은 것" -> 리네임: data-placeholder->data-ph, .active->.on) */
.wrz .w-ed{overflow-y:auto;word-break:break-word}   /* s7 .w-ed 에 없다. 리사이즈 후 스크롤·긴 URL 줄바꿈 */
.wrz .w-ed:empty::before{white-space:pre-line}      /* 안내문구 다줄 지원. content 는 s7 이 attr(data-ph) 로 준다 */
.wrz .w-ed hr{border:none;border-top:1px solid var(--bor2);margin:10px 0}
.wrz .ed-drop-zone{border:none;border-radius:0;background:none}   /* 상시 점선은 시안에 없다. 하이라이트만 남긴다 */
.wrz .ed-drop-zone.dragover{border:2px dashed var(--acc);background:var(--acc-dim)}
.wrz .w-resize:hover .w-grip{background:var(--acc)}  /* 리사이즈 핸들 hover 피드백. s7 에 hover 짝이 없다 */
/* ※ .editor-content / .editor-wrap / .editor-toolbar 고아 3건은 S9-3 에서 제거했다(소비처 0 확인). */
.ed-spoiler{background:color-mix(in srgb,var(--spoiler) 25%,transparent);color:var(--spoiler);border-radius:var(--rad);padding:0 2px;user-select:text;display:inline}
/* 렌더된 컨텍스트(미리보기·게시글 상세·위키 표시)에서의 스포일러 */
.editor-preview .ed-spoiler,.post-detail-text .ed-spoiler,.wiki-body .ed-spoiler{
  filter:blur(5px);background:var(--bg)!important;color:transparent!important;
  border-radius:var(--rad);padding:1px 4px;cursor:pointer;user-select:none;
  position:relative;display:inline-block;transition:filter .2s}
.editor-preview .ed-spoiler::before,.post-detail-text .ed-spoiler::before,.wiki-body .ed-spoiler::before{
  content:'스포일러 — 클릭하여 보기';position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);font-size:9px;font-weight:700;
  color:rgba(255,255,255,.7);white-space:nowrap;pointer-events:none}
.editor-preview .ed-spoiler.revealed,.post-detail-text .ed-spoiler.revealed,.wiki-body .ed-spoiler.revealed{
  filter:blur(0);color:var(--t1)!important;background:var(--acc-dim)!important}
.editor-preview .ed-spoiler.revealed::before,.post-detail-text .ed-spoiler.revealed::before,.wiki-body .ed-spoiler.revealed::before{display:none}
.editor-preview-wrap{background:var(--bg3);border-top:1px solid var(--bor);display:none}
.editor-preview-lbl{font-size:10px;font-weight:700;color:var(--t3);padding:5px 12px;border-bottom:1px solid var(--bor);background:var(--bg2);letter-spacing:.04em}
.editor-preview{min-height:320px;padding:10px 12px;font-size:13px;line-height:1.65;color:var(--t1)}
.editor-preview hr{border:none;border-top:1px solid var(--bor2);margin:10px 0}
/* CONTEXT MENU */
.ctx-menu{position:fixed;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rad);box-shadow:0 4px 16px rgba(0,0,0,.35);z-index:var(--z-ctx-menu);min-width:150px;padding:4px 0;display:none}
.ctx-menu.open{display:block}
.ctx-menu-item{padding:7px 14px;font-size:12px;color:var(--t1);cursor:pointer;transition:background .1s;display:flex;align-items:center;gap:6px}
.ctx-menu-item:hover{background:var(--bg3)}
/* COMMENT SPOILER TAG (rendered text) */
.cmt-spoil-tag{background:rgba(0,0,0,0.85);color:transparent!important;filter:blur(4px);border-radius:var(--rad);cursor:pointer;transition:filter .25s,background .25s;padding:0 2px;user-select:none;position:relative;display:inline-block}
.cmt-spoil-tag::before{content:'스포일러';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:9px;color:rgba(255,255,255,0.7);white-space:nowrap;pointer-events:none}
.cmt-spoil-tag.revealed{filter:blur(0)!important;background:var(--acc-dim);color:var(--t1)!important;user-select:text}
.cmt-spoil-tag.revealed::before{display:none}
/* SIMPLIFIED CMT TOOLBAR */
/* MEDIA UPLOAD */
.ed-img-wrap{display:inline-block;position:relative;margin:4px 2px;vertical-align:middle;max-width:100%}
.ed-img-wrap img{max-width:100%;max-height:320px;display:block;border-radius:var(--rad);border:1px solid var(--bor)}
.ed-img-del{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;background:var(--acc);color:var(--c-white);font-size:10px;line-height:18px;text-align:center;cursor:pointer;display:none;border:none;padding:0;font-family:inherit}
.ed-img-wrap:hover .ed-img-del{display:block}
.ed-video-wrap{margin:6px 0;border-radius:var(--r);overflow:hidden;background:var(--bg2);border:1px solid var(--bor);position:relative}
.ed-video-thumb{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:var(--bg4)}
.ed-video-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.ed-video-play{width:48px;height:48px;border-radius:50%;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--c-white);backdrop-filter:blur(2px)}
.ed-video-platform{font-size:10px;font-weight:700;color:rgba(255,255,255,.8);text-shadow:0 1px 3px rgba(0,0,0,.7);letter-spacing:.05em}
.ed-video-title{font-size:11px;color:rgba(255,255,255,.9);text-shadow:0 1px 3px rgba(0,0,0,.7);text-align:center;padding:0 12px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-video-del{position:absolute;top:6px;right:6px;background:rgba(0,0,0,.6);border:none;color:var(--c-white);border-radius:var(--rad);font-size:11px;padding:3px 8px;cursor:pointer;font-family:inherit}
.ed-iframe-wrap{margin:6px 0;position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;border:1px solid var(--bor)}
.ed-iframe-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:none}
.ed-iframe-del{position:absolute;top:6px;right:6px;background:rgba(0,0,0,.6);border:none;color:var(--c-white);border-radius:var(--rad);font-size:11px;padding:3px 8px;cursor:pointer;font-family:inherit;z-index:5}
.ed-link-card{display:flex;gap:0;margin:6px 0;border:1px solid var(--bor);border-radius:var(--r);overflow:hidden;background:var(--bg2);text-decoration:none;color:inherit;position:relative}
.ed-link-card-thumb{width:80px;flex-shrink:0;background:var(--bg3);object-fit:cover}
.ed-link-card-body{padding:10px 12px;flex:1;min-width:0}
.ed-link-card-title{font-size:12px;font-weight:700;color:var(--t1);margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-link-card-desc{font-size:11px;color:var(--t3);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ed-link-card-url{font-size:10px;color:var(--t3);margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-link-card-del{position:absolute;top:4px;right:4px;background:var(--bg3);border:1px solid var(--bor);color:var(--t3);border-radius:var(--rad);font-size:10px;padding:2px 6px;cursor:pointer;font-family:inherit}
.ed-drop-zone{border:2px dashed var(--bor2);border-radius:var(--r);background:var(--bg2);transition:all .2s}
.ed-drop-zone.dragover{border-color:var(--acc);background:var(--acc-dim)}
.ed-upload-progress{height:3px;background:var(--acc);border-radius:var(--rad);transition:width .2s;margin-top:2px}
.ed-img-input-label{display:inline-flex;align-items:center;gap:3px;cursor:pointer}
/* VIDEO MODAL */
.vid-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:calc(var(--z-overlay-special) + 1000);display:none;align-items:center;justify-content:center}
.vid-modal-overlay.open{display:flex}
.vid-modal-inner{position:relative;width:min(800px,92vw);aspect-ratio:16/9}
.vid-modal-inner iframe{position:absolute;inset:0;width:100%;height:100%;border:none;border-radius:var(--r)}
.vid-modal-close{position:absolute;top:-36px;right:0;background:none;border:none;color:var(--c-white);font-size:22px;cursor:pointer;line-height:1}
/* VIDEO INSERT MODAL */
.vid-insert-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:calc(var(--z-overlay-special) + 500);display:none;align-items:center;justify-content:center}
.vid-insert-overlay.open{display:flex}
.vid-insert-modal{background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);padding:20px;width:400px;max-width:92vw}
.vid-insert-title{font-size:14px;font-weight:700;margin-bottom:12px}
.vid-insert-input{width:100%;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);color:var(--t1);padding:8px 10px;font-size:13px;font-family:inherit;outline:none;box-sizing:border-box}
.vid-insert-input:focus{border-color:var(--acc)}
.vid-insert-preview{margin-top:10px;display:none}
.vid-insert-foot{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
/* CMT IMAGE */
.cmt-img-preview{margin:6px 0;position:relative;display:inline-block}
.cmt-img-preview img{max-width:180px;max-height:120px;border-radius:var(--rad);border:1px solid var(--bor);display:block}
.cmt-img-del{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;background:var(--acc);color:var(--c-white);font-size:10px;line-height:18px;text-align:center;cursor:pointer;border:none;padding:0}
.cmt-drop-area{border:2px dashed transparent;border-radius:var(--rad);transition:border-color .2s,background .2s}
.cmt-drop-area.dragover{border-color:var(--acc);background:var(--acc-dim)}
/* REPORT MODAL */
.rep-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:var(--z-overlay-special);display:none;align-items:center;justify-content:center}
.rep-overlay.open{display:flex}
.rep-modal{background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);padding:20px;width:340px;max-width:92vw;position:relative}
.rep-modal-title{font-size:15px;font-weight:700;margin-bottom:4px}
.rep-modal-sub{font-size:11px;color:var(--t3);margin-bottom:14px}
.rep-reasons{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.rep-reason-btn{padding:8px 12px;border:1px solid var(--bor);border-radius:var(--rad);background:none;color:var(--t2);text-align:left;font-size:12px;font-family:inherit;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:8px}
.rep-reason-btn:hover{border-color:var(--acc);color:var(--t1)}
.rep-reason-btn.on{border-color:var(--acc);background:var(--acc-dim);color:var(--t1)}
.rep-etc-wrap{margin-bottom:14px;display:none}
.rep-etc-wrap textarea{width:100%;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);color:var(--t1);padding:8px;font-size:12px;font-family:inherit;resize:vertical;min-height:60px;outline:none}
.rep-modal-foot{display:flex;gap:8px;justify-content:flex-end}
/* REPORT ITEM (in admin/manager list) */
.rep-filter-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 14px;background:var(--bg2);border-radius:var(--rad);margin-bottom:12px}
.rep-filter-sel{background:var(--bg3);border:1px solid var(--bor);border-radius:var(--rad);color:var(--t1);padding:4px 8px;font-size:11px;font-family:inherit;cursor:pointer}
.rep-item{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:12px 14px;margin-bottom:8px}
.rep-item-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.rep-item-id{font-size:10px;color:var(--t3);font-family:monospace}
.rep-item-reason{font-size:11px;font-weight:700;color:var(--t1)}
.rep-item-target{font-size:11px;color:var(--t2)}
.rep-item-meta{font-size:10px;color:var(--t3);margin-left:auto}
/* 대상 바로가기 — 현재 허브콘만 쓴다(다른 타입은 대상 화면 진입 경로가 신고함에 없다) */
.rep-item-go{font-size:11px;color:var(--acc-br);cursor:pointer}
.rep-item-go:hover{text-decoration:underline}
.rep-item-body{font-size:11px;color:var(--t2);margin-bottom:8px;padding:6px 8px;background:var(--bg3);border-radius:var(--rad);border-left:2px solid var(--bor2)}
.rep-item-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rep-item-status{font-size:10px;padding:2px 7px;border-radius:var(--r);font-weight:600}
.rep-status-pending{background:var(--danger-dim);color:var(--neg)}
.rep-status-done{background:var(--acc-dim);color:var(--acc)}
/* MANAGER PAGE */
.manager-wrap{display:flex;min-height:calc(100vh - 50px)}
.manager-sidebar{width:180px;flex-shrink:0;border-right:1px solid var(--bor);padding:20px 0}
.manager-menu-item{padding:9px 16px;font-size:13px;font-weight:500;color:var(--t2);cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:8px}
.manager-menu-item:hover{color:var(--t1);background:var(--bg2)}
.manager-menu-item.on{color:var(--acc);background:var(--acc-dim);border-left:3px solid var(--acc)}
.manager-content{flex:1;padding:24px;min-width:0}
.manager-page-title{font-size:16px;font-weight:800;margin-bottom:16px;color:var(--t1)}
.manager-section{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:14px;margin-bottom:16px}
.manager-section-title{font-size:12px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid var(--bor)}
/* BAN SCREEN */
.ban-screen{position:fixed;inset:0;background:var(--bg);z-index:var(--z-ctx-menu);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px}
.ban-screen-icon{font-size:48px;margin-bottom:8px}
.ban-screen-title{font-size:20px;font-weight:800;color:var(--acc)}
.ban-screen-msg{font-size:13px;color:var(--t2);text-align:center;max-width:360px;line-height:1.7}
.ban-screen-reason{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:10px 16px;font-size:12px;color:var(--t2);text-align:center;max-width:320px}
/* ACTION LOG */
.action-log{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);margin-top:16px}
.action-log-title{padding:10px 14px;font-size:11px;font-weight:700;color:var(--t3);text-transform:uppercase;border-bottom:1px solid var(--bor)}
.action-log-item{padding:8px 14px;font-size:11px;color:var(--t2);border-bottom:1px solid var(--bor);display:flex;align-items:center;gap:8px}
.action-log-item:last-child{border-bottom:none}
.action-log-time{color:var(--t3);flex-shrink:0;font-family:monospace}
.action-log-who{color:var(--acc);font-weight:600}
/* USER PAGE — 공개프로필 (4영역 ⑥) | 시안: design_preview_profile.html (--sp/--fs → px) */
.user-page-wrap{max-width:1080px;margin:0 auto;padding:0 20px 48px}
.user-hero{margin-bottom:24px}
.user-hero-bg{height:200px;border-radius:var(--r) var(--r) 0 0;background-size:cover;background-position:center;position:relative;overflow:hidden}
.user-hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 40%,rgba(0,0,0,.55) 100%)}
.user-hero-bg--grad-critic{background:linear-gradient(135deg,#1a0010 0%,#4a0020 40%,#800020 100%)}
.user-hero-bg--grad-normal{background:linear-gradient(135deg,#001020 0%,#002040 40%,#001828 100%)}
.user-hero-bar{background:var(--bg2);border:1px solid var(--bor);border-top:none;border-radius:0 0 var(--r) var(--r);padding:16px 24px 20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.user-hero-avatar{width:88px;height:88px;border-radius:50%;border:4px solid var(--bg2);margin-top:-44px;flex-shrink:0;background:var(--bg3);overflow:hidden;box-shadow:0 0 0 2px var(--bor),0 6px 20px rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;position:relative;z-index:4}
.user-hero-avatar img{width:100%;height:100%;object-fit:cover}
/* 히어로 이니셜 — 슬롯 렌더가 avatarInnerHTML 단일 통로로 합쳐지며 산출 클래스가 .av-init 로 바뀌었다.
   기존 셀렉터를 병기로 남겨 히어로 전용 크기·색을 그대로 유지한다(동작 보존). */
.user-hero-avatar-fallback,
.user-hero-avatar .av-init{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:900;color:var(--acc);background:linear-gradient(135deg,var(--bg3) 0%,var(--bg4) 100%)}
.user-hero-info{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.user-hero-identity{flex:1;min-width:0}
.user-hero-nickname{font-size:24px;font-weight:800;line-height:1.2;color:var(--t1);overflow:visible;display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.user-hero-nick-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.user-hero-meta{display:flex;gap:8px;align-items:center;margin-top:4px;flex-wrap:wrap}
.user-join-date{font-size:11px;color:var(--t3)}
/* 등급 사다리 툴팁(.rev-grade-badge 색은 pages.css 기존 사용) */
.grade-badge-wrap{position:relative;display:inline-flex;align-items:center}
.grade-badge-wrap .rev-grade-badge{cursor:help}
.user-hero-nickname .grade-badge-wrap .rev-grade-badge{font-size:11px;padding:2px 7px;border-radius:var(--rad);vertical-align:middle}
.tier-ladder{position:absolute;left:0;top:calc(100% + 7px);z-index:var(--z-dropdown);background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:11px 13px;box-shadow:0 8px 28px rgba(0,0,0,.45);width:max-content;max-width:340px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s,transform .15s;pointer-events:none}
.grade-badge-wrap:hover .tier-ladder{opacity:1;visibility:visible;transform:translateY(0)}
.tl-title{font-size:10px;color:var(--t3);font-weight:700;letter-spacing:.03em}
.tl-row{display:flex;align-items:center;gap:7px;margin:9px 0 8px}
.tl-step{display:flex;flex-direction:column;align-items:center;gap:3px;opacity:.4}
.tl-step.on{opacity:1}
.tl-dot{width:9px;height:9px;border-radius:50%;background:var(--bg4)}
.tl-step.general .tl-dot{background:#9ccc65}
.tl-step.pro .tl-dot{background:#3a9d4e}
.tl-step.master .tl-dot{background:#f0d060}
.tl-step.official .tl-dot{background:#e8b84a;box-shadow:0 0 0 1.5px #3a9d4e}
.tl-step.on .tl-dot{transform:scale(1.3);box-shadow:0 0 0 3px rgba(240,208,96,.25)}
.tl-name{font-size:11px;font-weight:700;color:var(--t1);white-space:nowrap}
.tl-step:not(.on) .tl-name{color:var(--t3);font-weight:600}
.tl-arrow{color:var(--bor2);font-size:13px}
/* 아이콘 액션 버튼 */
.user-hero-actions{display:flex;gap:8px;align-items:center}
.user-action-wrap{display:flex;flex-direction:column;align-items:center}
.user-action-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--r);border:1px solid var(--bor);background:var(--bg3);color:var(--t2);transition:all .15s;flex-shrink:0;cursor:pointer}
.user-action-btn:hover{background:var(--bg4);color:var(--t1);border-color:var(--bor2)}
.user-action-btn--primary{background:var(--acc);border-color:var(--acc);color:var(--c-white)}
.user-action-btn--primary:hover{background:var(--acc2);border-color:var(--acc2)}
.user-action-btn--following{background:var(--bg3);border-color:var(--st-completed);color:var(--st-completed)}
.user-action-btn--following:hover{background:rgba(224,80,80,.08);border-color:var(--neg);color:var(--neg)}
.user-action-btn--danger:hover{background:rgba(224,80,80,.08);border-color:var(--neg);color:var(--neg)}
.user-action-btn::after{content:attr(aria-label);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:var(--bg4);color:var(--t1);font-size:11px;font-weight:600;padding:3px 8px;border-radius:var(--r);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s;border:1px solid var(--bor);z-index:var(--z-popover)}
.user-action-btn:hover::after{opacity:1}
.user-action-label{display:none;font-size:11px;color:var(--t3);margin-top:2px;text-align:center}
/* 마이페이지 편집 히어로 저장+닫기 2버튼 wrap — align-items:flex-start로 버튼(아이콘) 상단 정렬 고정.
   .user-hero-actions의 전역 align-items:center를 그대로 두면 저장중 라벨(.mp-saving)만 노출될 때
   두 wrap 높이가 달라져 버튼 위치가 세로로 어긋남(모바일 정렬 픽스) — 이 스코프에서만 재정의. */
.mp-hero-acts{display:flex;gap:8px;align-items:flex-start}
.user-action-wrap.mp-saving .user-action-label{display:block}
.mp-save-spin{animation:mp-spin .8s linear infinite;transform-origin:12px 12px}
@keyframes mp-spin{to{transform:rotate(360deg)}}
/* 통계 */
.user-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
.user-stat-card{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:16px;text-align:center}
.user-stat-val{font-size:24px;font-weight:800;color:var(--acc);line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-stat-label{font-size:11px;color:var(--t3);margin-top:4px;font-weight:500}
/* 레이아웃 2컬럼 */
.user-profile-body{display:grid;grid-template-columns:1fr 280px;gap:24px;align-items:start;margin-top:16px}
.user-main-col{min-width:0}
.user-side-col{min-width:0}
/* 섹션 */
.user-sec{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:20px;margin-bottom:16px}
.user-sec-title{font-size:13px;font-weight:800;color:var(--t3);letter-spacing:.06em;text-transform:uppercase;margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid var(--bor);display:flex;align-items:center;justify-content:space-between}
.user-bio-text{font-size:14px;color:var(--t1);line-height:1.7}
.user-bio-text--empty{color:var(--t3);font-style:italic}
/* 진열 */
.user-showcase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.user-showcase-card{cursor:pointer;transition:transform .2s;border-radius:var(--r);overflow:hidden}
.user-showcase-card:hover{transform:scale(1.03)}
.user-showcase-card:hover .user-showcase-title{color:var(--acc)}
.user-showcase-thumb{aspect-ratio:3/4;position:relative;overflow:hidden;border-radius:var(--r);background:var(--bg4)}
.user-showcase-thumb img{width:100%;height:100%;object-fit:cover}
.user-showcase-thumb-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.82) 0%,rgba(0,0,0,.1) 55%,transparent 100%)}
.user-showcase-thumb-content{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:8px 8px 12px}
.user-showcase-badge{position:absolute;top:4px;left:4px;font-size:11px;font-weight:800;padding:2px 6px;border-radius:var(--rad);background:var(--acc);color:var(--c-white)}
.user-showcase-title{font-size:13px;font-weight:700;color:var(--c-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .15s}
.user-showcase-meta{font-size:11px;color:rgba(255,255,255,.6);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-showcase-empty{grid-column:1/-1;padding:40px 16px;text-align:center;font-size:13px;color:var(--t3);background:var(--bg3);border:1px dashed var(--bor);border-radius:var(--r)}
.user-showcase-empty-cta{display:inline-flex;align-items:center;gap:4px;margin-top:12px;font-size:11px;color:var(--acc);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.user-showcase-empty-icon{width:40px;height:40px;margin:0 auto 12px;opacity:.3;color:var(--t3)}
/* 탭 */
.user-tabs{display:flex;border-bottom:1px solid var(--bor);margin-bottom:16px}
.user-tab{padding:8px 16px;font-size:14px;font-weight:600;color:var(--t3);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;transition:all .15s;white-space:nowrap;background:none}
.user-tab:hover{color:var(--t1)}
.user-tab.on{color:var(--acc);border-bottom-color:var(--acc);font-weight:700}
/* 라이브러리 그리드 */
.user-lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px}
.user-lib-card{cursor:pointer}
.user-lib-thumb{aspect-ratio:3/4;border-radius:var(--r);overflow:hidden;position:relative;background:var(--bg4)}
.user-lib-thumb img{width:100%;height:100%;object-fit:cover}
.user-lib-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.7) 0%,transparent 60%)}
.user-lib-title{position:absolute;bottom:4px;left:4px;right:4px;font-size:9px;font-weight:700;color:var(--c-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 게시글 리스트 */
.user-post-item{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--bor);cursor:pointer}
.user-post-item:last-child{border-bottom:none}
.user-post-item:hover .user-post-title{color:var(--acc)}
.user-post-board{font-size:11px;font-weight:700;padding:2px 6px;border-radius:var(--rad);background:var(--bg3);border:1px solid var(--bor);color:var(--t3);white-space:nowrap;flex-shrink:0}
.user-post-title{flex:1;font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .1s}
.user-post-date{font-size:11px;color:var(--t3);white-space:nowrap;flex-shrink:0}
.user-post-upvotes{font-size:11px;color:var(--t2);white-space:nowrap;flex-shrink:0;display:flex;align-items:center;gap:2px}
/* 댓글 리스트 */
.user-comment-item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--bor)}
.user-comment-item:last-child{border-bottom:none}
.user-comment-body{font-size:14px;color:var(--t2);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.user-comment-meta{font-size:11px;color:var(--t3);display:flex;gap:12px;margin-top:4px}
.user-comment-likes{display:flex;align-items:center;gap:2px;color:var(--t2)}
/* 프라이버시/빈 게이트 */
.user-privacy-gate{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 16px;text-align:center;background:var(--bg3);border-radius:var(--r);border:1px dashed var(--bor2)}
.user-privacy-label{font-size:14px;color:var(--t3);font-weight:500}
/* 공개 프로필 '작성 평론' 페이저(#4) — 미니멀 좌우 화살표 + n/N. 목록 하단 우측 정렬. */
.user-rev-fade{transition:opacity .15s ease}
.user-rev-fade--out{opacity:0}
.user-rev-pager{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:12px}
.user-rev-pager-btn{width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--t2);border:1px solid var(--bor);border-radius:var(--r-sm);background:var(--bg2)}
.user-rev-pager-btn:hover:not(:disabled){color:var(--acc);border-color:var(--acc)}
.user-rev-pager-btn:disabled{opacity:.35;cursor:default}
.user-rev-pager-count{font-size:12px;color:var(--t3)}
/* 사이드 카드 */
.user-side-card{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:16px;margin-bottom:16px}
.user-side-card-title{font-size:11px;font-weight:800;color:var(--t3);letter-spacing:.06em;text-transform:uppercase;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--bor)}
.user-level-display{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.user-level-num{font-size:30px;font-weight:900;color:var(--acc);line-height:1}
.user-level-label{font-size:11px;color:var(--t3);margin-top:2px}
.user-level-bar-wrap{height:4px;background:var(--bg4);border-radius:var(--rad);overflow:hidden;margin-bottom:8px}
.user-level-bar{height:100%;border-radius:var(--rad);background:var(--acc)}
.user-level-xp{font-size:11px;color:var(--t3);text-align:right}
.user-activity-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid var(--bor);font-size:13px}
.user-activity-row:last-child{border-bottom:none}
.user-activity-label{color:var(--t3)}
.user-activity-val{font-weight:700;color:var(--t1)}
/* 뱃지 그리드 */
.user-badge-grid{display:flex;gap:12px;flex-wrap:wrap}
.user-badge-item{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:default;transition:transform .15s}
.user-badge-item:hover{transform:scale(1.08)}
.user-badge-img{width:52px;height:52px;border-radius:50%;background:var(--bg4);border:2px solid var(--bor2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.user-badge-label{font-size:11px;color:var(--t3);text-align:center;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-badge-empty{font-size:13px;color:var(--t3);padding:16px 0}
@media(max-width:860px){.user-profile-body{grid-template-columns:1fr}.user-side-col{order:-1}}

/* ── Work Hero: HerbScore + StarRating ── */
.work-hero__scores{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:12px}
.work-hero__scores-sep{width:1px;height:56px;background:var(--bor);flex-shrink:0}
.work-starrating,.work-herbscore{display:inline-flex;align-items:center;gap:8px;padding:0;background:transparent;border:none;cursor:default}
.work-starrating__icon,.work-herbscore__icon{width:40px;height:40px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.work-starrating__icon svg,.work-herbscore__icon svg,.work-starrating__icon img,.work-herbscore__icon img{width:40px;height:40px;display:block;object-fit:contain}
.work-starrating__stack,.work-herbscore__stack{display:flex;flex-direction:column;gap:2px}
.work-starrating__score,.work-herbscore__score{font-size:32px;font-weight:700;letter-spacing:-0.03em;line-height:1;color:var(--t1)}
.work-starrating__unit,.work-herbscore__unit{font-size:12px;font-weight:500;color:var(--t3);align-self:flex-end;padding-bottom:5px}
.work-starrating__label,.work-herbscore__label{font-size:11px;font-weight:500;color:var(--t2);letter-spacing:0.02em;white-space:nowrap}
.work-herbscore__participants{font-size:11px;font-weight:400;color:var(--t3);white-space:nowrap}
.work-herbscore--legendary .work-herbscore__score{color:var(--herb-legendary)}
.work-herbscore--normal .work-herbscore__score{color:var(--herb-normal)}
.work-herbscore--rotten .work-herbscore__score{color:var(--herb-rotten)}
.work-herbscore--pending .work-herbscore__score{font-size:14px;font-weight:600;color:var(--herb-pending);letter-spacing:0}

/* ── REVIEW EXTENSIONS ── */
/* 카드 색상 바 */
/* ── 홈 최신 한줄평 마퀴 ── */
.revtick{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.revtick-track{display:flex;gap:10px;width:max-content;animation:revtick-scroll 40s linear infinite}
.revtick:hover .revtick-track{animation-play-state:paused}
@keyframes revtick-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.revtick-item{display:flex;align-items:center;gap:10px;flex-shrink:0;width:300px;padding:10px;background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);cursor:pointer;transition:border-color .15s,background .15s}
.revtick-item:hover{border-color:var(--acc);background:var(--bg3)}
.revtick-thumb{width:38px;height:52px;border-radius:var(--r-sm);object-fit:cover;flex-shrink:0;background:var(--bg4)}
.revtick-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.revtick-quote{font-size:13px;font-weight:700;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.revtick-sub{font-size:10px;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.revtick-sub .wk{color:var(--t2)}
.revtick-score{font-size:15px;font-weight:900;flex-shrink:0;align-self:center}
.revtick-score--pos{color:var(--acc)}
.revtick-score--neg{color:var(--neg)}
.revtick-score--mid{color:var(--gold)}
@media(prefers-reduced-motion:reduce){.revtick-track{animation:none}.revtick{overflow-x:auto}}
.rev-card{display:flex;cursor:pointer;border-bottom:1px solid var(--bor)}
.rev-card:hover{background:var(--bg3)}
.rev-card-bar{width:6px;flex-shrink:0;border-radius:var(--r-sm) 0 0 var(--r-sm)}
.rev-card-bar--pos{background:var(--acc)}
.rev-card-bar--mid{background:var(--gold)}
.rev-card-bar--neg{background:var(--neg)}
.rev-card-bar--nodata{background:var(--bor2)}
.rev-card-inner{flex:1;padding:14px 12px;display:flex;align-items:center;gap:12px;min-width:0}
.rev-card-main{flex:1;min-width:0}
/* 헤더 */
.rev-card-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:6px}
.rev-card-meta{flex:1;min-width:0}
.rev-card-side{display:flex;align-items:center;gap:10px;flex-shrink:0;align-self:center}
.rev-card-author-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:3px}
.rev-card-info-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rev-card-nick{font-size:12px;font-weight:700;color:var(--t1);cursor:pointer}
.rev-card-nick:hover{color:var(--acc)}
.rev-card-date{font-size:10px;color:var(--t3)}
.rev-card-progress{font-size:10px;color:var(--t3)}
.rev-card-spoil-badge{font-size:9px;padding:1px 5px;background:color-mix(in srgb,var(--spoiler) 15%,transparent);color:var(--spoiler);border-radius:var(--rad)}
/* 점수 */
.rev-card-score{font-size:11px;font-weight:800;padding:1px 6px;border-radius:var(--rad)}
.rev-card-score--pos{color:var(--acc);border:1px solid var(--acc)}
.rev-card-score--mid{color:var(--gold);border:1px solid var(--bor2)}
.rev-card-score--neg{color:var(--neg);border:1px solid var(--neg)}
.rev-card-subscores{font-size:10px;color:var(--t3)}
/* 신뢰도 점 */
.rev-card-trust{width:8px;height:8px;border-radius:50%;display:inline-block;flex-shrink:0;position:relative;cursor:default}
.rev-card-trust--high{background:var(--st-completed)}
.rev-card-trust--mid{background:var(--t3)}
.rev-card-trust--low{background:var(--bor2)}
.rev-card-trust[data-trust]::after{content:"신뢰지수 " attr(data-trust);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--bg4,#252525);color:var(--t1);font-size:10px;padding:3px 7px;border-radius:var(--rad);opacity:0;pointer-events:none;transition:opacity .15s;z-index:var(--z-dropdown)}
.rev-card-trust:hover::after{opacity:1}
/* 썸네일 */
.rev-card-thumb{width:60px;height:80px;flex-shrink:0;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;cursor:pointer}
.rev-card-thumb:hover{opacity:.8}
.rev-card-thumb-init{font-size:18px;font-weight:800;color:var(--c-white);pointer-events:none}
.rev-card-thumb-img{width:100%;height:100%;object-fit:cover;border-radius:var(--r-sm);pointer-events:none}
/* 본문 */
.rev-card-title{font-size:16px;font-weight:800;color:var(--t1);line-height:1.35;margin-bottom:5px}
/* ★높이 제어는 .rv-body 의 max-height(접기/펼치기) 하나뿐이다 — 여기 있던 3줄 클램프
   (display:-webkit-box·-webkit-line-clamp:3·-webkit-box-orient·overflow:hidden)를 걷었다.
   revCardHTML 이 `rv-body rev-card-body` 로 두 클래스를 병기해(review.js:375) 클램프가 계속 살아 있었고,
   그래서 '평론 본문 읽기'로 펼쳐도 3줄(73px)만 보이고 나머지(내용 146px)가 잘렸다. 제어원이 둘이면
   .open 토글이 높이를 끝까지 책임지지 못한다. 폰트·색·여백은 그대로 둔다(옛 tombstone 경로 review.js:369 공용). */
.rev-card-body{font-size:12px;color:var(--t2);line-height:1.6;margin-bottom:8px}
.rev-card-body.blur{filter:blur(5px);user-select:none;cursor:pointer}
/* 추천/비추천 */
.rev-card-foot{display:flex;align-items:center;gap:6px}
.rev-card-foot-spacer{flex:1}
.rev-card-like,.rev-card-dislike{background:none;border:none;cursor:pointer;font-size:10px;color:var(--t3);padding:0;display:inline-flex;align-items:center;gap:3px}
.rev-card-like:hover{color:var(--acc)}
.rev-card-dislike:hover{color:var(--neg)}
.rev-card-like.liked{color:var(--acc);font-weight:700}
.rev-card-dislike.disliked{color:var(--neg);font-weight:700}
/* 필터 */
.rev-filter-bar{display:flex;align-items:center;gap:8px;padding:8px 0;flex-wrap:wrap}
.rev-seg{display:flex;gap:2px}
.rev-seg-btn{background:none;border:1px solid var(--bor);color:var(--t3);font-size:11px;padding:3px 10px;border-radius:var(--r-sm);cursor:pointer;font-family:inherit}
.rev-seg-btn:hover{border-color:var(--bor2);color:var(--t1)}
.rev-seg-btn.on{border-color:var(--t3);color:var(--t1)}
.rev-seg-btn.on-pos{border-color:var(--acc);color:var(--acc)}
.rev-seg-btn.on-neg{border-color:var(--neg);color:var(--neg)}
.rev-spoil-toggle{background:none;border:1px solid var(--bor);color:var(--t3);font-size:11px;padding:3px 10px;border-radius:var(--r-sm);cursor:pointer;font-family:inherit}
.rev-spoil-toggle.on{border-color:var(--acc);color:var(--acc)}
/* 판정 뱃지 (상세 뷰) */
.rev-verdict-badge{display:inline-flex;align-items:center;height:22px;padding:0 7px;font-size:12px;font-weight:900;border-radius:var(--rad)}
.rev-verdict-badge--pos{background:var(--acc);color:var(--c-white)}
.rev-verdict-badge--mid{border:1px solid var(--bor2);color:var(--gold)}
.rev-verdict-badge--neg{background:var(--neg);color:var(--c-white)}
.rev-verdict-subscores{font-size:10px;color:var(--t3)}
/* 등급 뱃지 */
.rev-grade-badge{display:inline-block;font-size:9px;padding:1px 5px;border-radius:var(--rad);font-weight:800;vertical-align:middle}
.rev-grade-badge.master{background:#f0d060;color:#7a5000}
.rev-grade-badge.pro{background:#b8c8d8;color:#2a3848}
.rev-grade-badge.general{background:#c8a880;color:#5a3a10}
.rev-grade-badge.rookie{background:var(--bg4,#252525);color:var(--t3)}
.rev-grade-badge.official{background:linear-gradient(90deg,var(--acc),var(--acc2));color:var(--c-white)}
.tl-step.official .tl-dot{background:var(--acc)}
.tl-step.official.on .tl-dot{box-shadow:0 0 0 3px var(--acc-dim)}
.critic-verified{display:inline-flex;align-items:center;vertical-align:middle;color:var(--acc);margin-left:2px}
/* 평론 상세 헤더 메타 — 프로필/닉+뱃지/작품·날짜 2행 + 우측 점수박스 */
.rev-dt-meta{display:flex;align-items:center;gap:12px;margin-top:4px}
.rev-dt-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;cursor:pointer;flex-shrink:0}
.rev-dt-avatar--init{display:flex;align-items:center;justify-content:center;background:var(--bg4);color:var(--t2);font-weight:700;font-size:16px}
.rev-dt-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.rev-dt-nick-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.rev-dt-nick{font-size:14px;font-weight:700;color:var(--t1);cursor:pointer}
.rev-dt-nick:hover{color:var(--acc)}
.rev-dt-sub{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--t3);flex-wrap:wrap}
.rev-dt-date{color:var(--t3)}
.rev-dt-score-box{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex-shrink:0;text-align:right}
.rev-dt-thumb{width:48px;height:64px;object-fit:cover;border-radius:var(--r-sm);cursor:pointer;flex-shrink:0}
.rev-dt-thumb:hover{opacity:.85}
.rev-dt-score{font-size:22px;font-weight:900;line-height:1;color:var(--t2)}
.rev-dt-score-box--pos .rev-dt-score{color:var(--acc)}
.rev-dt-score-box--neg .rev-dt-score{color:var(--neg)}
.rev-dt-subscores{font-size:11px;color:var(--t3)}
.rev-dt-actions-spacer{flex:1}
.rev-dt-edit{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;border:1px solid var(--bor2);border-radius:var(--r-sm);font-size:11px;font-weight:600;color:var(--t2);background:none;cursor:pointer;font-family:inherit;transition:border-color .15s,color .15s}
.rev-dt-edit:hover{border-color:var(--t1);color:var(--t1)}
.rev-dt-edit:active{opacity:.75}
.rev-dt-del{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;border:1px solid var(--danger-bor);border-radius:var(--r-sm);font-size:11px;font-weight:600;color:var(--danger);background:none;cursor:pointer;font-family:inherit;transition:background .15s,border-color .15s}
.rev-dt-del:hover{background:var(--danger-dim);border-color:var(--danger)}
.rev-dt-del:active{opacity:.75}
.rev-dt-admin-del{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;border:1px solid var(--danger-bor);border-radius:var(--r-sm);font-size:11px;font-weight:600;color:var(--t3);background:none;cursor:pointer;font-family:inherit;transition:background .15s,border-color .15s,color .15s}
.rev-dt-admin-del:hover{background:var(--danger-dim);border-color:var(--danger);color:var(--danger)}
.rev-dt-admin-del:active{opacity:.75}
.rev-work-locked{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r-sm);cursor:default;opacity:.72;user-select:none}
.rev-work-locked-name{font-size:13px;font-weight:600;color:var(--t2);flex:1}
.rev-work-locked-author{font-size:11px;color:var(--t3)}
.rev-work-locked-icon{display:flex;align-items:center;color:var(--t3);flex-shrink:0}
.rev-work-locked-hint{font-size:10px;color:var(--t3);margin-top:4px}
/* 평론가 등급 사다리 툴팁 (뱃지 hover) */
.grade-badge-wrap{position:relative;display:inline-block}
.grade-badge-wrap .rev-grade-badge{cursor:help}
.tier-ladder{position:absolute;left:0;top:calc(100% + 7px);z-index:var(--z-dropdown,500);background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:11px 13px;box-shadow:0 8px 28px rgba(0,0,0,.45);width:max-content;max-width:340px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s,transform .15s;pointer-events:none}
.grade-badge-wrap:hover .tier-ladder{opacity:1;visibility:visible;transform:translateY(0)}
.tl-title{font-size:10px;color:var(--t3);font-weight:700;letter-spacing:.03em}
.tl-row{display:flex;align-items:center;gap:7px;margin:9px 0 8px}
.tl-step{display:flex;flex-direction:column;align-items:center;gap:3px;opacity:.4}
.tl-step.on{opacity:1}
.tl-dot{width:9px;height:9px;border-radius:50%;background:var(--bg4)}
.tl-step.general .tl-dot{background:#c8a880}
.tl-step.pro .tl-dot{background:#b8c8d8}
.tl-step.master .tl-dot{background:#f0d060}
.tl-step.on .tl-dot{transform:scale(1.3);box-shadow:0 0 0 3px var(--acc-dim)}
.tl-name{font-size:11px;font-weight:700;color:var(--t1);white-space:nowrap}
.tl-step:not(.on) .tl-name{color:var(--t3);font-weight:600}
.tl-arrow{color:var(--bor2);font-size:13px}
.rev-card-work-link{font-size:10px;color:var(--t2);cursor:pointer}
.rev-card-work-link:hover{color:var(--t1)}
.rev-spoil-banner{display:flex;align-items:center;gap:8px;padding:8px 12px;background:color-mix(in srgb,var(--spoiler) 10%,transparent);border:1px solid color-mix(in srgb,var(--spoiler) 28%,transparent);border-radius:var(--r-sm);margin-bottom:14px;font-size:11px;color:var(--spoiler);font-weight:700;cursor:pointer}
.rev-spoil-banner.revealed{background:transparent;border-color:var(--bor);color:var(--t3)}
.post-detail-text.blur{filter:blur(5px);user-select:none;cursor:pointer;transition:filter .2s}
.rev-spoil-wrap{margin-bottom:0}
.post-action-btn.down.on{background:var(--neg);border-color:var(--neg);color:var(--c-white)}
.rev-card-tier--sm{font-size:10px;padding:2px 6px}
.critic-profile-info{flex:1}
.critic-profile-back-btn{background:none;border:none;color:var(--acc);font-size:12px;cursor:pointer;padding:0;margin-bottom:12px;font-family:inherit}
/* WORK REVIEW PAGE */
/* ═══════════════════════════════════════════════════════════════════════
   작품별 평론 모아보기 — 2열 셸 + 사이드바 모듈 (2026-08-11)
   [왜] #page 는 1080px 고정인데 본문이 720px 중앙 정렬이라 좌우 180px씩 죽어 있었다.
        작품상세(.wdz .shell)와 같은 300px + 나머지 그리드로 바꾸면 (1) 빈 띠가 사라지고
        (2) 카드 폭이 작품상세 평론 탭과 정확히 같아진다(706px) — 세 화면에서 카드가 동일.
   ═══════════════════════════════════════════════════════════════════════ */

.work-rev-page{max-width:none;margin:0;display:grid;grid-template-columns:300px minmax(0,1fr);gap:30px;padding:20px 22px 40px;align-items:start}

/* ── 좌측 컬럼 ──
   ★전부 .work-rev-page 로 스코프한다(리뷰어 반려 BLOCKING #1) — community-zine-s4.css:172-215
   에 이름만 같은 죽은 .cmz .wrx-*(구 가로형) 블록이 남아 있어, 바레 셀렉터로 두면 특이도/로드
   순서로 확정 패배한다(.wrx-sum 0,1,0 vs .cmz .wrx-sum 0,2,0 등). */
.work-rev-page .wrx-side{position:sticky;top:16px;display:flex;flex-direction:column;gap:8px}
.work-rev-page .wrx-side .wrx-back{font-family:'Space Mono';font-size:10px;letter-spacing:.08em;color:var(--t3);cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.work-rev-page .wrx-side .wrx-back:hover{color:var(--acc-br)}

/* 작품 판 */
.work-rev-page .wrx-pane{border:1px solid var(--bor);background:var(--pane)}
.work-rev-page .wrx-head{display:flex;gap:16px;padding:16px}
.work-rev-page .wrx-head .wrx-cv{width:88px;height:132px;flex:none;background-size:cover;background-position:center;background-color:var(--bg4);border:1px solid var(--bor)}
.work-rev-page .wrx-head .wrx-tx{min-width:0;display:flex;flex-direction:column;gap:8px}
.work-rev-page .wrx-head .wrx-k{font-family:'Space Mono';font-size:9px;letter-spacing:.14em;color:var(--acc-br)}
.work-rev-page .wrx-head .wrx-nm{font-family:'Chakra Petch',var(--font);font-size:19px;font-weight:700;letter-spacing:-.02em;line-height:1.26;color:var(--t1);text-wrap:pretty}
.work-rev-page .wrx-head .wrx-sub{font-size:10.5px;letter-spacing:0;color:var(--t3);line-height:1.5}
.work-rev-page .wrx-head .wrx-cnt{font-family:'Space Mono';font-size:10px;letter-spacing:0;color:var(--t2)}

/* 기수 드롭다운 — 시리즈 형제 work 2개 이상일 때만 발행(work.js _sibs.length>1). searchSelectHTML 재사용,
   .wrx-pane 폭(300px)에 맞춰 라벨 고정폭 + ssel 가변폭 한 줄. */
.work-rev-page .wrx-season-row{display:flex;align-items:center;gap:8px;padding:0 16px 16px}
.work-rev-page .wrx-season-lb{font-size:11px;color:var(--t2);flex:none;min-width:28px}
.work-rev-page .wrx-season-row .ssel{flex:1;min-width:0}

/* 평론 요약 — 기존 .rv-sum 을 세로형으로 재구성.
   ★구 620px `.rv-sum-pct{font-size:36px}` 축소 짝 규칙은 여기 대응품을 두지 않았다 — 옛
   가로형은 좁은 화면에서 큰 숫자·막대·라벨이 한 줄에서 부딪혀 축소가 필요했지만, 이 세로형은
   300px 고정폭 판 안에 항상 세로로 쌓여 폭 압박이 없다(≤900px 에서도 열이 전체폭으로 바뀔 뿐
   .wrx-pct 38px 자체 폭은 그대로 안전). QA 가 ≤900/≤420 에서 실측 확인할 것. */
.work-rev-page .wrx-sum{border-top:1px solid var(--hair);padding:16px}
.work-rev-page .wrx-sum .wrx-sk{display:flex;align-items:center;gap:8px;font-family:'Space Mono';font-size:9.5px;letter-spacing:.14em;color:var(--t3);margin-bottom:16px}
.work-rev-page .wrx-sum .wrx-sk .led{width:6px;height:6px;border-radius:50%;background:var(--acc);box-shadow:0 0 7px var(--acc)}
.work-rev-page .wrx-sum .wrx-big{display:flex;align-items:baseline;gap:8px;line-height:1}
.work-rev-page .wrx-sum .wrx-pct{font-family:'Chakra Petch',var(--font);font-size:38px;font-weight:700;line-height:1;letter-spacing:-.04em;color:var(--acc)}
.work-rev-page .wrx-sum .wrx-pct i{font-size:16px;font-style:normal;letter-spacing:0;margin-left:3px}
.work-rev-page .wrx-sum .wrx-lb{font-size:12px;font-weight:700;letter-spacing:0;color:var(--acc)}
.work-rev-page .wrx-sum .wrx-lb-green{color:var(--acc-br)}
.work-rev-page .wrx-sum .wrx-lb-yellow{color:var(--gold)}
.work-rev-page .wrx-sum .wrx-lb-red{color:var(--danger)}
.work-rev-page .wrx-sum .wrx-lb-none{color:var(--t3)}
.work-rev-page .wrx-sum .wrx-ssub{font-family:'Space Mono';font-size:9.5px;line-height:1.4;letter-spacing:0;color:var(--t3);margin-top:16px}
.work-rev-page .wrx-sum .wrx-trend{font-family:'Space Mono';font-size:9.5px;line-height:1.4;letter-spacing:0;margin-top:6px}
.work-rev-page .wrx-sum .wrx-trend-up{color:var(--acc-br)}
.work-rev-page .wrx-sum .wrx-trend-down{color:var(--danger)}
.work-rev-page .wrx-sum .wrx-bars{display:flex;flex-direction:column;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--hair)}
.work-rev-page .wrx-sum .rvb{display:flex;align-items:center;gap:8px}
.work-rev-page .wrx-sum .rvb-l{font-family:'Space Mono';font-size:9px;letter-spacing:.08em;color:var(--t3);width:24px;flex:none}
.work-rev-page .wrx-sum .rvb-t{flex:1;height:4px;background:var(--bg4);position:relative;overflow:hidden}
.work-rev-page .wrx-sum .rvb-f{position:absolute;left:0;top:0;bottom:0}
.work-rev-page .wrx-sum .rvb-green{background:var(--acc)}
.work-rev-page .wrx-sum .rvb-yellow{background:var(--gold)}
.work-rev-page .wrx-sum .rvb-red{background:var(--neg)}
.work-rev-page .wrx-sum .rvb-n{font-family:'Space Mono';font-size:9.5px;letter-spacing:0;color:var(--t2);width:12px;text-align:right;flex:none}

/* ═══ 사이드바 모듈 슬롯 ═══
   판 하나 = 모듈 하나. 무엇을 넣든 아래 네 타입 중 하나로 떨어진다.
   공통: 1px 보더 · pane 배경 · 패딩 16 · 모듈 간 8px · 헤더 Space Mono 9px/.14em */
.work-rev-page .wrx-mod{border:1px solid var(--bor);background:var(--pane)}
.work-rev-page .wrx-mod-h{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--hair)}
.work-rev-page .wrx-mod-h .t{font-family:'Space Mono';font-size:9px;letter-spacing:.14em;color:var(--t3)}
.work-rev-page .wrx-mod-h .more{margin-left:auto;font-family:'Space Mono';font-size:9px;letter-spacing:.08em;color:var(--t3);cursor:pointer;white-space:nowrap}
.work-rev-page .wrx-mod-h .more:hover{color:var(--acc-br)}
.work-rev-page .wrx-mod-b{padding:16px}

/* 타입 1 — 순위 리스트 (인기 평론 · 평론가 랭킹 · 최근 평론 …) */
.work-rev-page .wrx-mlist{display:flex;flex-direction:column}
.work-rev-page .wrx-mrow{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;border-bottom:1px solid var(--hair);cursor:pointer}
.work-rev-page .wrx-mrow:last-child{border-bottom:0}
.work-rev-page .wrx-mrow:hover .wrx-mt{color:var(--acc-br)}
.work-rev-page .wrx-mrow .n{font-family:'Chakra Petch',var(--font);font-size:14px;font-weight:700;color:var(--bor2);line-height:1.2;width:14px;flex:none}
.work-rev-page .wrx-mrow .mc{min-width:0;display:flex;flex-direction:column;gap:4px}
.work-rev-page .wrx-mt{font-size:12px;font-weight:700;color:var(--t1);line-height:1.4;text-wrap:pretty}
.work-rev-page .wrx-ms{font-family:'Space Mono';font-size:9.5px;color:var(--t3)}

/* 타입 2 — 칩 (태그 · 키워드) */
.work-rev-page .wrx-chips{display:flex;flex-wrap:wrap;gap:8px}
.work-rev-page .wrx-chip{font-size:11px;color:var(--t2);border:1px solid var(--bor);padding:4px 8px;cursor:pointer;white-space:nowrap}
.work-rev-page .wrx-chip:hover{border-color:var(--acc);color:var(--acc-br)}

/* 타입 3 — 사미네일 그리드 3열 (관련 작품 · 시리즈) */
.work-rev-page .wrx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.work-rev-page .wrx-grid .c{display:flex;flex-direction:column;gap:4px;cursor:pointer}
.work-rev-page .wrx-grid .c i{aspect-ratio:2/3;background:var(--bg4);border:1px solid var(--bor);display:block;background-size:cover;background-position:center}
.work-rev-page .wrx-grid .c span{font-size:9.5px;color:var(--t3);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 타입 4 — 광고 컨테이너 (오버레이·필터 금지, 자리와 여백만) */
.work-rev-page .wrx-ad{height:250px;border:1px solid var(--bor);background:var(--pane2);display:grid;place-items:center;font-family:'Space Mono';font-size:9.5px;letter-spacing:.14em;color:var(--t3)}

/* 기수 전체 통합 모드(work.js series-all — 미선택 기수 && 형제 2+) — 카드마다 소속 기수를 보이게 작품칩을 도로 켠다.
   기본은 community-zine-s4.css:272 `.work-rev-page .rv-work{display:none}`(단일 작품 문맥이라 자기 자신 칩은 불필요).
   여기 셀렉터(.work-rev-page.series-all .rv-card .rv-work, 특이도 0,4,0)가 그 규칙(0,2,0)보다 상세도가 높아
   로드 순서(pages.css가 community-zine-s4.css보다 먼저)와 무관하게 승리한다. */
.work-rev-page.series-all .rv-card .rv-work{display:flex}

/* 좁은 화면 — 1열로 접고 sticky 해제 */
@media(max-width:900px){
  .work-rev-page{grid-template-columns:minmax(0,1fr);gap:16px}
  .work-rev-page .wrx-side{position:static}
}
/* ── .led — work-rev-page 안 어디서든 쓰는 공용 펄스 인디케이터.
   ★2026-08-11 모아보기 2열 개편: 옛 .rv-sum/.rl/.rvb(가로형)는 위 .wrx-sum(세로형, 이 파일
     상단 패치 블록)으로 대체되어 여기서 걷어냈다(소비처 0 확인 후 삭제 — review.js _revSumHTML
     이 이제 wrx-* 클래스만 발행). 단 이 .led 규칙은 남긴다 — .wrx-sum .wrx-sk .led 가 계속
     이 규칙(펄스 애니메이션)을 소비한다. 지우면 좌측 요약 판의 초록 점이 정적으로 굳는다.
   ★무스코프로 승격하지 않는다 — work-detail-zine.css:308 의 `.wdz .rd-brow .rl` 은
     이름만 같은 다른 클래스라 전역 .rl 은 그걸 오염시킨다.
   ★.led 는 --cz-led(=.cmz 스코프 변수)를 못 쓴다. 여기선 전역 토큰 var(--led) 를 직접 쓴다.
     @keyframes ledpulse 는 components.css:2593 전역이라 그대로 걸린다. */
.work-rev-page .led{width:6px;height:6px;border-radius:50%;background:var(--led);box-shadow:0 0 7px var(--led);display:inline-block;flex:none;animation:ledpulse 1.9s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.work-rev-page .led{animation:none!important}}
.rev-filter-spacer{flex:1}
.rev-card-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex-shrink:0;cursor:pointer;}
.rev-card-avatar--init{background:var(--acc-dim);color:var(--acc);display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;}

/* ── COMMUNITY BOARD 6-COL GRID ── */
.bd-row{display:grid;grid-template-columns:64px 1fr 80px 58px 52px 40px;align-items:center;padding:0 12px;min-height:36px;border-bottom:1px solid var(--bor);gap:8px;cursor:pointer;transition:background .12s;}
.bd-row:hover{background:var(--bg3);}
.bd-row.pinned{background:color-mix(in srgb,var(--acc) 6%,transparent);}
.bd-row.notice{background:var(--bg2);}
.bd-row.bd-head{background:var(--bg2);border-top:1px solid var(--bor);cursor:default;font-size:11px;color:var(--t3);font-weight:600;min-height:30px;}
.bd-row.bd-head:hover{background:var(--bg2);}
.bd-flair{font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bd-title{display:flex;align-items:center;gap:3px;overflow:hidden;white-space:nowrap;font-size:13px;}
.bd-title-text{color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.bd-title-text.hot{color:var(--acc);font-weight:600;}
.bd-cmt{font-size:11px;color:var(--acc);flex-shrink:0;}
.bd-poppin{font-size:9px;font-weight:800;color:var(--acc);border:1px solid var(--acc);border-radius:var(--rad);padding:0 4px;margin-right:5px;flex-shrink:0;line-height:1.5}
.bd-hot{font-size:9px;font-weight:800;color:var(--c-white);background:var(--acc);border-radius:var(--rad);padding:1px 5px;margin-left:5px;flex-shrink:0;line-height:1.5;letter-spacing:.02em}
.bd-best{font-size:9px;font-weight:800;color:var(--t2);background:var(--bg3);border:1px solid var(--bor2);border-radius:var(--rad);padding:0 4px;margin-left:5px;flex-shrink:0;line-height:1.5;letter-spacing:.02em}
.bd-author{font-size:11px;color:var(--t2);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.bd-date{font-size:10px;color:var(--t3);text-align:center;}
.bd-views{font-size:10px;color:var(--t3);text-align:center;}
.bd-up{font-size:11px;font-weight:700;text-align:center;color:var(--t3);}
.bd-up.hot{color:var(--acc);}
.bd-up.mid{color:var(--t2);}
.bd-pin{display:inline-block;width:7px;height:7px;background:var(--acc);clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);margin-right:3px;flex-shrink:0;}

/* ── PREFIX TABS ── */
.comm-prefix-tab-row{display:flex;gap:4px;padding:5px 12px;border-bottom:1px solid var(--bor);overflow-x:auto;scrollbar-width:none;}
.comm-prefix-tab-row::-webkit-scrollbar{display:none;}
.comm-prefix-tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--t3);font-size:12px;padding:2px 7px 4px;cursor:pointer;white-space:nowrap;font-family:inherit;}
.comm-prefix-tab:hover{color:var(--t1);}
.comm-prefix-tab.on{color:var(--t1);font-weight:700;}

/* ── PREFIX BADGE ── */
.comm-prefix-badge{font-size:11px;font-weight:700;flex-shrink:0;}

/* ── BOARD VIEW TOGGLE ── */
.bd-view-toggle{display:flex;gap:2px;margin-left:6px;}
.bd-view-btn{background:none;border:1px solid var(--bor);border-radius:var(--r-sm);color:var(--t3);width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:inherit;}
.bd-view-btn:hover{color:var(--t1);border-color:var(--bor2);}
.bd-view-btn.on{color:var(--acc);border-color:var(--acc);}

/* ── IMAGE VIEW GRID ── */
.bd-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;padding:12px;}
.bd-card{background:var(--bg3);border-radius:var(--r-sm);overflow:hidden;cursor:pointer;border:1px solid var(--bor);}
.bd-card:hover{border-color:var(--bor2);}
.bd-card-thumb{width:100%;aspect-ratio:16/9;overflow:hidden;}
.bd-card-thumb img{width:100%;height:100%;object-fit:cover;}
.bd-card-nothumb{display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:800;color:var(--c-white);}
.bd-card-body{padding:8px;}
.bd-card-meta{display:flex;align-items:center;gap:6px;margin-bottom:4px;}
.bd-card-author{font-size:10px;color:var(--t3);}
.bd-card-title{font-size:12px;color:var(--t1);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:6px;line-height:1.4;}
.bd-card-title.hot{color:var(--acc);}
.bd-card-foot{display:flex;gap:8px;font-size:10px;color:var(--t3);}
.bd-card-up.hot{color:var(--acc);}
.adm-pfx-list{margin:8px 0;border:1px solid var(--bor);border-radius:var(--r-sm);overflow:hidden;}
.adm-pfx-row{display:flex;align-items:center;gap:10px;padding:7px 12px;border-bottom:1px solid var(--bor);font-size:12px;}
.adm-pfx-row:last-child{border-bottom:none;}
.adm-pfx-preview{min-width:60px;}
.adm-pfx-color-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;}
.adm-pfx-mo{font-size:10px;padding:1px 6px;border:1px solid var(--bor);border-radius:var(--rad);cursor:pointer;color:var(--t3);}
.adm-pfx-mo.on{border-color:var(--acc);color:var(--acc);}
.adm-pfx-del{margin-left:auto;background:none;border:1px solid var(--bor);color:var(--t3);font-size:11px;padding:2px 8px;border-radius:var(--r-sm);cursor:pointer;}
.adm-pfx-del:hover{border-color:var(--neg);color:var(--neg);}
.adm-pfx-add-row{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap;}
.admin-sub-tabs{display:flex;gap:4px;margin-bottom:10px;}
.admin-sub-tab{background:none;border:1px solid var(--bor);color:var(--t3);font-size:12px;padding:4px 10px;border-radius:var(--r-sm);cursor:pointer;}

/* ── LIBRARY PHASE 1-2 ── */
.lib-histo-row{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.lib-histo-score{width:30px;font-size:11px;color:var(--t2);text-align:right}
.lib-histo-track{flex:1;height:12px;background:var(--bg3);border-radius:var(--rad);overflow:hidden}
.lib-histo-bar{height:100%;background:var(--acc);border-radius:var(--rad)}
.lib-histo-cnt{width:30px;font-size:11px;color:var(--t3)}
.lib-unrated-cta{margin-top:10px;background:var(--bg3);border:1px dashed var(--bor2);border-radius:var(--rad);padding:10px 12px;font-size:12px;color:var(--t2);cursor:pointer;display:flex;align-items:center;justify-content:space-between}
.lib-unrated-cta:hover{border-color:var(--acc);color:var(--t1)}
.lib-unrated-cta b{color:var(--acc)}
.admin-sub-tab.on{border-color:var(--acc);color:var(--acc);}

/* ===== 평점 분포 히스토그램 .rat-dist-* ===== */
.rat-dist-head{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.rat-dist-tabgroups{display:flex;flex-direction:column;gap:6px}
.rat-dist-tabs{display:flex;gap:4px;flex-wrap:wrap}
.rat-dist-tab{font-size:11px;padding:4px 9px;border:1px solid var(--bor2);border-radius:var(--rad);background:transparent;color:var(--t2);cursor:pointer;font-family:inherit}
.rat-dist-tab:hover{border-color:var(--t2);color:var(--t1)}
.rat-dist-tab.on{background:var(--acc);border-color:var(--acc);color:var(--c-white);font-weight:700}
.rat-dist-stability{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--t2);white-space:nowrap}
.rat-dist-dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex-shrink:0}
.rat-dist-dot.stable{background:var(--st-completed)}
.rat-dist-dot.normal{background:var(--st-onhold)}
.rat-dist-dot.divisive{background:var(--acc)}
.rat-dist-periodavg{font-size:12px;color:var(--t2);margin:2px 0 10px}
.rat-dist-periodavg strong{color:var(--t1)}
.rat-dist-rows{display:flex;flex-direction:column;gap:5px}
.rat-dist-row{display:flex;align-items:center;gap:8px;font-size:12px;position:relative}
.rat-dist-row.mode .rat-dist-pct{color:var(--t1);font-weight:700}
.rat-dist-num{width:18px;text-align:right;color:var(--t2);font-variant-numeric:tabular-nums;flex-shrink:0}
.rat-dist-track{flex:1;height:14px;background:var(--bg3);border-radius:var(--r-sm);overflow:hidden}
.rat-dist-bar{height:100%;border-radius:var(--r-sm);transition:width .25s ease}
.rat-dist-pct{width:90px;text-align:right;color:var(--t2);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:11px}
.rat-dist-modeflag{font-size:10px;color:var(--t3);margin-left:2px;flex-shrink:0}
.rat-dist-row .rat-dist-tip{position:absolute;left:50%;top:-30px;transform:translateX(-50%);background:var(--bg4);border:1px solid var(--bor2);border-radius:var(--rad);padding:3px 8px;font-size:11px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:var(--z-dropdown)}
.rat-dist-row:hover .rat-dist-tip{opacity:1}
.rat-dist-empty{font-size:12px;color:var(--t3);text-align:center;padding:18px 0}
.rat-dist-legend{display:flex;gap:14px;font-size:11px;color:var(--t3);margin-top:12px;justify-content:center}
/* 미디어믹스 (작품 상세 다른 포맷) */
.mm-grid{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.mm-card{flex:0 0 92px;cursor:pointer}
.mm-thumb{aspect-ratio:3/4;border-radius:var(--rad);overflow:hidden;position:relative;background:var(--bg3)}
.mm-info{margin-top:5px;display:flex;flex-direction:column;gap:1px}
.mm-type{font-size:10px;font-weight:700;color:var(--acc)}
.mm-name{font-size:11px;color:var(--t2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mm-rate{font-size:10px;color:#F5C518}

/* 허브 사이드 연동작품 슬라이드 */
.frx-hero{position:relative;margin:4px 0 0;border-radius:var(--rad);overflow:hidden}
.frx-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.frx-track::-webkit-scrollbar{display:none}
.frx-slide{flex:0 0 100%;scroll-snap-align:start;aspect-ratio:4/3;position:relative;display:flex;align-items:flex-end;cursor:pointer}
.frx-slide::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.78),transparent 60%);z-index:1}
.frx-badges{position:absolute;top:7px;right:7px;z-index:2;display:flex;gap:4px;align-items:center}
.frx-star{font-size:10px;font-weight:700;color:#F5C518;background:rgba(0,0,0,.72);padding:2px 6px;border-radius:var(--rad);display:inline-flex;align-items:center;gap:2px}
.frx-herb{background:rgba(0,0,0,.72);padding:1px 5px;border-radius:var(--rad);display:inline-flex;align-items:center;gap:2px;color:var(--c-white);font-size:10px;font-weight:700}
.frx-herb svg{display:block}
.frx-ov{position:relative;z-index:2;padding:8px 10px;font-size:12px;font-weight:700;color:var(--c-white);text-shadow:0 1px 2px rgba(0,0,0,.6)}
.frx-type{color:#ff8a96}
.frx-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;border:none;background:none;color:rgba(255,255,255,.9);font-size:22px;cursor:pointer;line-height:1;padding:0 3px;text-shadow:0 1px 4px rgba(0,0,0,.9)}
.frx-arrow:hover{color:var(--c-white)}
.frx-arrow.left{left:6px}.frx-arrow.right{right:6px}

/* 즐겨찾기 설정 (마이페이지) */
.fav-set-desc{font-size:12px;color:var(--t3);line-height:1.6;margin-bottom:14px}
.fav-set-head,.fav-set-row{display:grid;grid-template-columns:50px 1fr 170px 64px;align-items:center;gap:10px;padding:9px 8px}
.fav-set-head{border-bottom:2px solid var(--bor2);font-size:12px;color:var(--t3);font-weight:700}
.fav-set-row{border-bottom:1px solid var(--bor)}
.fav-set-key{color:var(--t3);text-align:center}
.fav-set-name{color:var(--t1);font-weight:600;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fav-set-name:hover{color:var(--acc)}
.fav-set-order{display:flex;gap:5px}
.fav-set-btn{font-size:11px;background:var(--bg3);border:1px solid var(--bor2);border-radius:var(--rad);padding:3px 8px;cursor:pointer;color:var(--t2);font-family:inherit}
.fav-set-btn:hover{border-color:var(--acc);color:var(--acc)}
.fav-set-del{font-size:11px;background:var(--bg3);border:1px solid var(--bor2);border-radius:var(--rad);padding:3px 10px;cursor:pointer;color:var(--t2);font-family:inherit}
.fav-set-del:hover{border-color:var(--danger);color:var(--danger)}

/* 허브 대문 배너 (디자인 시안) */
.hub-banner{position:relative;border-radius:var(--r);overflow:hidden;margin-bottom:14px;border:1px solid var(--bor)}
.hub-banner-bg{height:150px;position:relative}
.hub-banner-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.92),rgba(0,0,0,.25) 55%,rgba(0,0,0,.1))}
.hub-banner-info{position:absolute;left:18px;right:18px;bottom:14px;display:flex;align-items:flex-end;justify-content:space-between;gap:14px;z-index:2}
.hub-banner .hub-name{font-size:24px;font-weight:800;color:var(--c-white);letter-spacing:-.5px;text-shadow:0 2px 6px rgba(0,0,0,.7);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hub-banner .hub-fav-btn{flex-shrink:0;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.45);color:var(--c-white);padding:6px 13px;border-radius:var(--rad);font-size:12px;font-weight:700;cursor:pointer;font-family:inherit}
.hub-banner .hub-fav-btn:hover{background:rgba(0,0,0,.65)}
.hub-banner .hub-fav-btn.on{color:var(--acc);border-color:var(--acc)}

/* 허브 디렉터리 카드 (디자인 시안 gal-card 구조) */
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
/* 허브 목록 정렬탭 + 초성필터 바 */
.hublist-bar{display:flex;gap:8px;align-items:center;margin-bottom:12px}
.hublist-search{flex:1}
.hublist-sortdd{position:relative}
.hublist-dd-btn,.hublist-cho-toggle{display:flex;align-items:center;gap:6px;height:36px;padding:0 12px;background:var(--bg2);border:1px solid var(--bor2);border-radius:var(--r);color:var(--t2);font-size:13px;cursor:pointer;white-space:nowrap}
.hublist-cho-toggle.active{color:var(--acc);border-color:var(--acc)}
.hublist-dd-menu{position:absolute;top:100%;right:0;margin-top:4px;z-index:var(--z-dropdown);background:var(--bg2);border:1px solid var(--bor2);border-radius:var(--r);padding:4px;min-width:110px;box-shadow:0 4px 16px rgba(0,0,0,.4)}
.hublist-dd-item{padding:7px 10px;font-size:13px;color:var(--t2);cursor:pointer;border-radius:var(--r)}
.hublist-dd-item:hover,.hublist-dd-item.on{background:var(--bg3,rgba(255,255,255,.06));color:var(--t1)}
.hublist-cho-panel{display:flex;flex-direction:column;gap:6px;align-items:center;padding:8px;background:var(--bg2);border:1px solid var(--bor2);border-radius:var(--r);margin-bottom:12px}
.hublist-cho-row{display:flex;flex-wrap:wrap;gap:3px;justify-content:center}
.hublist-cho-item{min-width:26px;padding:4px 7px;font-size:12px;color:var(--t2);cursor:pointer;border-radius:var(--r);text-align:center;border:1px solid transparent}
.hublist-cho-item:hover{background:var(--bg3,rgba(255,255,255,.06))}
.hublist-cho-item.on{background:var(--acc);color:#fff}
.gal-card{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);overflow:hidden;cursor:pointer;transition:border-color .15s,transform .15s}
.gal-card:hover{border-color:var(--bor2);transform:translateY(-2px)}
.gal-card .gal-kv{height:96px;position:relative}
.gal-card .gal-kv::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.45),transparent 60%)}
.gal-card .gal-body{padding:10px 12px}
.gal-card .gal-name{font-size:14px;font-weight:700;display:flex;align-items:center;gap:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:0}
.gal-card .gal-name .fav{color:#F5C518;font-size:11px;flex-shrink:0}
.gal-card .gal-meta{font-size:11px;color:var(--t3);margin-top:3px}
.gal-act{font-size:11px;color:var(--acc);margin-top:6px;display:flex;align-items:center;gap:4px}
.gal-act .live{width:6px;height:6px;border-radius:50%;background:var(--acc);display:inline-block;flex-shrink:0}
.gal-card .gal-subbtn{margin-top:9px}

/* 허브 카드 즐겨찾기 별 (우상단, 가볍게) */
.gal-card{position:relative}
/* [S5-1 2026-08-03] 전역 .gal-fav → .gal-card 스코프로 좁힘. 허브 목록 마크업이 .gal-card 를 안 쓰게 돼
   이 4규칙은 현재 매치 0(死)이다. 삭제하지 않고 좁히는 이유: 다른 곳에서 .gal-card 를 되살릴 때 짝이 남아야 한다.
   ★좁힌 사유 — 전역이면 커뮤니티의 .cmz .gal-fav(community-zine-s5.css)와 겹쳐 width:24px 가 살아남고,
     시안의 .flbl 라벨(hover/on 시 max-width:56px 확장)이 24px 고정 폭에 갇혀 안 보인다. */
.gal-card .gal-fav{position:absolute;bottom:10px;right:11px;z-index:3;width:24px;height:24px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--t3);padding:0;transition:color .15s}
.gal-card .gal-fav:hover{color:var(--t1)}
.gal-card .gal-fav.on{color:var(--acc)}
.gal-card .gal-fav svg{display:block}

/* ═══ 허브 2단계 계층 말머리 ═══ */
/* 목록 하위 말풍선 — hover 드롭다운(absolute 오버레이, 게시판 줄 안 밀림) */
.comm-prefix-wrap{position:relative}
.comm-prefix-bubble{position:absolute;top:calc(100% - 1px);left:var(--bubble-left,12px);z-index:var(--z-dropdown);display:inline-flex;gap:2px;align-items:center;padding:6px 10px;background:var(--bg3);border:1px solid var(--bor2);border-radius:var(--r);box-shadow:0 4px 14px rgba(0,0,0,.35)}
.comm-prefix-bubble[hidden]{display:none}
.comm-prefix-bubble::before{content:"";position:absolute;top:-5px;left:var(--caret,28px);width:9px;height:9px;background:var(--bg3);border-left:1px solid var(--bor2);border-top:1px solid var(--bor2);transform:rotate(45deg)}
.cpb-sub{background:none;border:none;color:var(--t3);font-size:12px;padding:2px 8px;border-radius:var(--rad);cursor:pointer;font-family:inherit;white-space:nowrap}
.cpb-sub:hover{color:var(--t1);background:var(--bg4)}
.cpb-sub.on{color:var(--t1);font-weight:700;background:var(--bg4)}
.cps-sep{color:var(--bor2);font-size:11px;user-select:none}
/* 글쓰기 하위 = 언더라인 미니탭 */
.write-cat-col{display:flex;flex-direction:column;gap:8px}
.wc-subline{display:flex;gap:2px;padding-left:4px}
.wc-subline:empty{display:none}
.wc-subtab{background:none;border:none;border-bottom:2px solid transparent;color:var(--t3);font-size:11px;font-weight:600;padding:2px 8px 3px;cursor:pointer;font-family:inherit}
.wc-subtab:hover{color:var(--t1)}
.wc-subtab.on{color:var(--acc);border-bottom-color:var(--acc)}
/* 에디터(adm-pfx 확장) */
.admin-select{background:var(--bg);border:1px solid var(--bor);color:var(--t1);border-radius:var(--rad);padding:4px 8px;font-size:12px;font-family:inherit}
.adm-scope{margin-left:auto;font-size:10px;color:var(--t3);border:1px solid var(--bor2);border-radius:var(--r);padding:2px 9px}
.mo-check{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--t3)}
.adm-pfx-parent{border-bottom:1px solid var(--bor)}
.adm-pfx-parent:last-child{border-bottom:none}
.adm-pfx-parent .adm-pfx-row{border-bottom:none}
.adm-pfx-caret{width:14px;height:14px;color:var(--t3);cursor:pointer;flex-shrink:0;transition:transform .12s}
.adm-pfx-caret.open{transform:rotate(90deg)}
.adm-pfx-count{font-size:10px;color:var(--t3);background:var(--bg4);border-radius:var(--r);padding:0 6px}
.adm-pfx-tools{margin-left:auto;display:flex;gap:4px}
.adm-pfx-ico{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;background:none;border:1px solid var(--bor);border-radius:var(--rad);color:var(--t3);cursor:pointer}
.adm-pfx-ico:hover{color:var(--acc);border-color:var(--acc)}
.adm-pfx-ico.del:hover{color:var(--neg);border-color:var(--neg)}
.adm-pfx-ico.save:hover{color:var(--acc);border-color:var(--acc)}
.adm-pfx-editing{gap:8px}
.adm-pfx-ico svg{width:13px;height:13px}
.adm-pfx-children{background:var(--bg);padding:2px 12px 8px 38px}
.adm-pfx-crow{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px dashed var(--bor);font-size:12px}
.adm-pfx-crow:last-of-type{border-bottom:none}
.adm-pfx-cname{font-weight:600}
.adm-pfx-addchild{display:flex;align-items:center;gap:6px;padding-top:8px;flex-wrap:wrap}
.ghost-btn{background:none;border:1px dashed var(--bor2);color:var(--t3);font-size:11px;padding:4px 10px;border-radius:var(--r-sm);cursor:pointer;font-family:inherit}
.ghost-btn:hover{border-color:var(--acc);color:var(--acc)}
.pfx-color{width:32px;height:30px;border:none;background:none;cursor:pointer;padding:0;flex-shrink:0}

/* ═══ 관리자 대시보드 v2 ═══ */
.dash-bar{display:flex;align-items:center;gap:8px;margin-bottom:16px}
.dash-seg{display:flex;border:1px solid var(--bor);border-radius:var(--r-sm);overflow:hidden}
.dash-seg button{background:none;border:none;color:var(--t3);font-size:11px;padding:5px 12px;cursor:pointer;font-family:inherit}
.dash-seg button.on{background:var(--acc);color:var(--c-white);font-weight:700}
.dash-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:8px}
.dash-kpi{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:14px}
.dash-kpi-l{font-size:11px;color:var(--t3);margin-bottom:6px}
.dash-kpi-v{font-size:24px;font-weight:900;letter-spacing:-.5px}
.dash-kpi-s{font-size:11px;color:var(--t3);margin-top:4px}
.dash-sec-h{font-size:13px;font-weight:700;margin:22px 0 10px}
.dash-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.dash-card{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:14px;display:flex;flex-direction:column}
.dash-card.click{cursor:pointer;transition:border-color .12s}
.dash-card.click:hover{border-color:var(--bor2)}
.dash-card-h{font-size:12px;font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:6px}
.dash-st{font-size:9px;font-weight:700;padding:1px 7px;border-radius:var(--r)}
.dash-st.st-real{background:var(--acc-dim);color:var(--acc)}
.dash-st.st-part{background:rgba(255,183,77,.15);color:#ffb74d}
.dash-st.st-be{background:var(--bg4);color:var(--t3)}
.dash-more{margin-left:auto;font-size:10px;color:var(--t3);font-weight:400}
.dash-card.click:hover .dash-more{color:var(--acc)}
.dash-chart{flex:1;display:flex;flex-direction:column;justify-content:center;min-height:130px}
.dash-verify{font-size:10px;color:var(--t3);margin-top:10px;border-top:1px solid var(--bor);padding-top:8px}
.dash-export{background:var(--bg2);border:1px solid var(--bor);border-radius:var(--r);padding:16px;margin-bottom:16px}
.dash-exp-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dash-exp-t{font-size:11px;color:var(--t3);margin-bottom:6px}
.dash-exp-chk{display:block;font-size:12px;margin-bottom:4px;color:var(--t2)}
.dash-exp-foot{display:flex;align-items:center;gap:8px;margin-top:14px;border-top:1px solid var(--bor);padding-top:12px}
/* 차트(charts.js) */
.ch-bar-row{display:flex;align-items:center;gap:8px;margin-bottom:7px;font-size:11px}
.ch-bar-l{width:70px;color:var(--t2);flex-shrink:0;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ch-bar-t{flex:1;height:14px;background:var(--bg4);border-radius:var(--rad);overflow:hidden}
.ch-bar-f{display:block;height:100%;background:var(--acc);border-radius:var(--rad)}
.ch-bar-v{width:48px;color:var(--t3);flex-shrink:0;text-align:right}
.ch-hist{display:flex;align-items:flex-end;gap:8px;height:150px;padding-bottom:18px}
.ch-hb{flex:1;background:var(--acc);border-radius:var(--rad) var(--rad) 0 0;min-height:2px;position:relative}
.ch-hb span{position:absolute;bottom:-17px;left:0;right:0;text-align:center;font-size:10px;color:var(--t3)}
.ch-line{width:100%;height:140px;display:block}
.ch-line-x{display:flex;justify-content:space-between;font-size:9px;color:var(--t3);margin-top:2px}
.ch-donut-wrap{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap}
.ch-donut{position:relative;width:132px;height:132px;flex-shrink:0}
.ch-donut svg{width:100%;height:100%;display:block;transform:rotate(0)}
.ch-donut .ch-seg{transition:stroke-width .12s}
.ch-donut-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.ch-donut-c b{font-size:24px;font-weight:900;line-height:1;letter-spacing:-.5px}
.ch-donut-c span{font-size:9px;color:var(--t3);margin-top:3px}
.ch-donut-legend{font-size:11px;color:var(--t2);min-width:130px}
.ch-donut-legend div{display:flex;align-items:center;gap:7px;padding:3px 0}
.ch-lg-l{color:var(--t2)}
.ch-lg-v{margin-left:auto;color:var(--t3);font-variant-numeric:tabular-nums}
.ch-dot{width:9px;height:9px;border-radius:var(--rad);flex-shrink:0}
.ch-table{width:100%;border-collapse:collapse;font-size:11px}
.ch-table th{text-align:left;color:var(--t3);font-size:9px;padding:5px 8px;border-bottom:1px solid var(--bor)}
.ch-table td{padding:6px 8px;border-bottom:1px solid var(--bor);color:var(--t2)}
.ch-table td.num{text-align:right}
.ch-kpi-val{font-size:30px;font-weight:900;color:var(--acc)}
.ch-kpi-sub{font-size:11px;color:var(--t3);margin-top:4px}

/* ═══ 멤버 관리 / 제재 모달 ═══ */
.badge-gray{background:var(--bg4);color:var(--t3)}
.appoint-row{display:flex;gap:8px;align-items:center;margin-top:8px}
.modal-title{font-size:15px;font-weight:700;margin-bottom:4px}
.modal-target{font-size:12px;color:var(--t3);margin-bottom:16px}
.modal-target b{color:var(--acc)}
.modal-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.mbtn{font-size:13px;padding:7px 16px;border-radius:var(--r-sm);border:1px solid var(--bor);background:none;color:var(--t2);cursor:pointer;font-family:inherit}
.mbtn:hover{border-color:var(--bor2)}
.mbtn-primary{background:var(--acc);border-color:var(--acc);color:var(--c-white);font-weight:600}
/* 파기(비가역) — 짝은 components.css 의 .abtn-purge. 여기 두는 이유는 .mbtn 이 이 파일에 있어서다
   (components.css 에 두면 동일 특이도에서 뒤에 로드되는 .mbtn 이 이겨 스타일이 죽는다). */
.mbtn-purge{background:var(--t1);border-color:var(--t1);color:var(--bg);font-weight:700}
.mbtn-purge:hover{background:var(--danger);border-color:var(--danger);color:var(--c-white)}
.sc-field{margin-bottom:14px}
.sc-flabel{font-size:11px;font-weight:600;color:var(--t2);margin-bottom:6px}
/* [S8 2026-08-03] 제재 모달 sc-seg/sc-opt/sc-days 는 community-zine-s8.css 가 정본이다.
   같은 화면(moderation.js 제재 모달)을 그리던 옛 규칙이라 제거했다 — s8 이 전역이 되면서
   두 벌이 겹친다. sc-sub·sc-day 등 s8 에 없는 나머지는 아래에 그대로 남아 있다. */
.sc-daybtn{font-size:12px;padding:5px 12px;border:1px solid var(--bor);border-radius:var(--r-sm);cursor:pointer;color:var(--t3);background:none;font-family:inherit}
.sc-daybtn.on{border-color:var(--acc);color:var(--acc);background:var(--acc-dim);font-weight:700}
.sc-dayinput{width:64px;background:var(--bg);border:1px solid var(--bor);color:var(--t1);border-radius:var(--rad);padding:5px 8px;font-size:12px;font-family:inherit}
.sc-textarea{width:100%;min-height:70px;background:var(--bg);border:1px solid var(--bor);color:var(--t1);border-radius:var(--rad);padding:8px 10px;font-size:12px;font-family:inherit;resize:vertical;outline:none;line-height:1.5}
/* 파기 확인 모달 입력(사유·타이핑 확인) — 제재 모달 입력과 같은 규격. 신규 규격 도입 아님. */
.pg-input{width:100%;background:var(--bg);border:1px solid var(--bor);color:var(--t1);border-radius:var(--rad);padding:8px 10px;font-size:12px;font-family:inherit;outline:none}
.sc-textarea:focus{border-color:var(--acc)}
.sc-check{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--t2)}
.abtn-ghost{color:var(--t3)}
.gate{font-size:11px;color:var(--t3);background:var(--bg3);border:1px solid var(--bor);border-radius:var(--r);padding:8px 10px;margin-bottom:12px}
.hub-mng-btn{background:none;border:1px solid var(--bor);color:var(--t3);font-size:12px;padding:5px 10px;border-radius:var(--r-sm);cursor:pointer;font-family:inherit;margin-left:6px}
.hub-mng-btn:hover{border-color:var(--acc);color:var(--acc)}
/* 허브 배너 에디터 */
.bn-field{margin-bottom:18px}
.bn-label{font-size:12px;font-weight:600;color:var(--t2);margin-bottom:8px}
.bn-prev-banner{height:150px;border-radius:var(--r);border:1px solid var(--bor);position:relative;overflow:hidden;margin-bottom:10px}
.bn-prev-card{width:180px;height:96px;border-radius:var(--r);border:1px solid var(--bor);margin-bottom:10px}
.bn-drag{cursor:grab;touch-action:none;transition:background-position .15s ease}
.bn-drag--dragging{cursor:grabbing;transition:none}
.bn-input-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.bn-input-row .admin-input{flex:1;min-width:200px}
.bn-upload{font-size:11px;padding:7px 12px;border:1px dashed var(--bor2);border-radius:var(--r-sm);color:var(--t3);background:none;cursor:pointer;font-family:inherit}
.bn-upload:hover{border-color:var(--acc);color:var(--acc)}
.bn-clear{font-size:11px;padding:7px 10px;border:1px solid var(--bor);border-radius:var(--r-sm);color:var(--t3);background:none;cursor:pointer;font-family:inherit}
.bn-clear:hover{border-color:var(--acc);color:var(--acc)}
.pxhint{font-size:10px;color:var(--t3);margin-top:6px}
.bn-thumb-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.bn-thumb-chip{position:relative;width:52px;height:52px;border-radius:var(--r-sm);border:2px solid var(--bor);background-color:var(--c-black);cursor:pointer;background-size:cover;background-position:center}
.bn-thumb-chip:hover{border-color:var(--bor2)}
.bn-thumb-chip.on{border-color:var(--acc)}
.bn-thumb-chip-del{position:absolute;top:-6px;right:-6px;width:16px;height:16px;border-radius:50%;background:var(--c-black);color:var(--t2);border:1px solid var(--bor);font-size:11px;line-height:14px;text-align:center;cursor:pointer}
.bn-thumb-chip-del:hover{border-color:var(--acc);color:var(--acc)}
/* 로고 설정 */
.site-logo-img{height:28px;width:auto;max-width:200px;object-fit:contain;display:block}
.site-logo-svg{display:inline-flex;align-items:center}
.site-logo-svg svg{height:28px;width:auto;display:block}
.logo-prevbar{display:flex;align-items:center;gap:8px;background:#101010;border:1px solid var(--bor);border-radius:var(--r);padding:12px 16px}
/* 허브 매니저 안내줄 */
.hub-nomgr{display:flex;align-items:center;gap:9px;margin:10px 0;padding:7px 12px;background:var(--bg3);border:1px solid var(--bor);border-radius:var(--r-sm);font-size:12px;color:var(--t2)}
.hub-mgr-tag{flex-shrink:0;font-size:10px;font-weight:700;color:var(--t3);background:var(--bg);border:1px solid var(--bor2);border-radius:var(--r);padding:2px 9px;line-height:1.4}
.hub-nomgr-txt{color:var(--t3)}
.hub-nomgr .author-wrap{display:inline-flex;align-items:center}
/* 허브 한정 매니저/부매니저 닉 색 */
.author-nick.nick-mgr{color:var(--acc);font-weight:700}
.author-nick.nick-submgr{color:#4fc3f7;font-weight:700}
.hub-nomgr-apply{margin-left:auto;background:none;border:1px solid var(--acc);color:var(--acc);font-size:11px;font-weight:600;padding:4px 12px;border-radius:var(--r-sm);cursor:pointer;font-family:inherit}
.hub-nomgr-apply:hover{background:var(--acc);color:var(--c-white)}

/* ═══ 게시판/허브 안내문구 ═══ */
.comment-textarea::placeholder{white-space:pre-line} /* 댓글 안내 다줄 */
.bg-field{margin-bottom:14px}
.bg-label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--t2);margin-bottom:5px}
.bg-label .hint{font-size:10px;font-weight:400;color:var(--t3)}
.bg-textarea{width:100%;min-height:90px;padding:9px 11px;border:1px solid var(--bor);border-radius:var(--rad);background:var(--bg);color:var(--t1);font-size:12px;font-family:inherit;resize:vertical;outline:none;line-height:1.6}
.bg-textarea:focus{border-color:var(--acc)}
.bg-save-row{display:flex;align-items:center;gap:10px;margin-top:4px}
.bg-saved{font-size:11px;color:var(--acc)}

/* ── 작품 상세 탭(평가/위키/회차/커뮤니티) + 히어로 보러가기 (신디자인) ── */
/* 히어로 3열: 포스터 | 메타 | 점수 레일 */
.work-hero-inner{align-items:flex-start}
.work-hero-meta{display:flex;flex-direction:column;gap:10px}
.work-hero-meta .mbadges,.work-hero-meta .work-title,.work-hero-meta .work-submeta,.work-hero-meta .work-actions,.work-hero-meta .hero-progrow{margin:0}
.affinity-badge{align-self:flex-start;width:auto}
/* 구 스코어클러스터·외부평점칩(.work-score-cluster · .work-cluster- · .work-ext-chip 계열) 제거
   — S2서 zine .score-ext · .ext 로 대체, renderExtRatings(dead) 삭제로 고아화.
   ★위 목록에 별표를 슬래시 앞에 쓰지 말 것 — 주석이 그 자리에서 닫힌다(리터럴 종료 토큰). */
/* __init만 보존: platformToIconHTML(live, _workExtRows 호출)이 여전히 방출(현재 _workExtRows가 폴백 discard하나 방출 함수가 살아있어 보수적 유지). */
.work-ext-chip__init{width:13px;height:13px;border-radius:var(--rad);background:var(--bor2);display:flex;align-items:center;justify-content:center;font-size:7px;font-weight:700;color:var(--t2);line-height:1}
/* 히어로 기수 드롭다운 — 책갈피와 동일(searchSelect) */
.work-season-group{margin-left:0}
/* 히어로 진행: 위=게이지 풀폭(길게), 아래=책갈피·기수·보러가기 한 행 */
.work-hero .work-progress{flex-direction:column;align-items:stretch;gap:8px;flex-wrap:nowrap}
.wp-gauge-row{display:flex;align-items:center;gap:10px}
.wp-gauge-row .work-progress-bar{flex:1 1 auto;min-width:0}
.wp-ctrl-row{display:flex;align-items:center;gap:12px;flex-wrap:nowrap}
.work-hero .work-progress .ssel{width:120px}
.work-tabs{display:flex;gap:2px;border-bottom:1px solid var(--bor);margin-bottom:22px;overflow-x:auto}
.work-tab{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;color:var(--t3);padding:13px 16px;border:none;background:none;border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap}
.work-tab.on{color:var(--t1);border-bottom-color:var(--acc)}
.work-tab svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.work-tab.on svg{stroke:var(--acc)}
.work-tab:hover{color:var(--t1)}
.work-tabpanel{display:none}
.work-tabpanel.on{display:block;animation:wtfade .2s}
@keyframes wtfade{from{opacity:0}to{opacity:1}}
.hero-progrow{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.hero-progrow .work-progress{flex:1;min-width:200px}
.hero-plats{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}
.hero-plats-l{font-size:12px;font-weight:700;color:rgba(255,255,255,.85)}
.hero-plat{width:28px;height:28px;border-radius:var(--r);background:var(--bg3);border:1px solid var(--bor);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:var(--t2);cursor:pointer;transition:.12s}
.hero-plat:hover{border-color:var(--acc);color:var(--c-white);transform:translateY(-2px)}

/* 위키 탭 풀폭 — 모든 블록 자식이 컨테이너 가로 전체 사용 */
#wt-wiki{width:100%}
#wt-wiki>*,#wt-wiki .wiki-body,#wt-wiki .wiki-doc,#wt-wiki .wsec,#wt-wiki .msynopsis{width:100%;max-width:none;box-sizing:border-box}

/* ═══ 설정 페이지 (#settings) — .st-* 네임스페이스 ═══
   pages.css 1330–1391 (.set-* 블록) 전체를 이 블록으로 교체한다.
   ★진 페이지 어휘 정렬: 라운드 0 / 내부 구분 --hair / 섹션 제목 --font 700 19px /
     모노 라벨 --acc-br 대문자 .1em / 버튼 .nfc .btn 스펙 / 토글 .nfc .sw 스펙.
   ★.set-* 는 전량 삭제 대상이다(.set-sec-badge·.set-badge-*·.set-wip-tag 는 참조 0건).
   ★공통 .sw-toggle 은 마이페이지(mypage-profile-tab.js)가 아직 쓰므로 남긴다. */
.st-page{padding-bottom:64px}
/* 페이지 마스트헤드 — .page-title(스타일 없음) 대체. .nfc .ph 와 같은 수치. */
.st-mast{display:grid;grid-template-columns:1fr auto;align-items:end;gap:12px;padding:0 0 12px;border-bottom:2px solid var(--bor);margin-bottom:20px}
.st-mast .eyerow{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-family:var(--font-mono);font-size:10px;letter-spacing:.11em;color:var(--acc-br);text-transform:uppercase}
.st-mast h1{font-family:'Chakra Petch',var(--font);font-weight:700;font-size:27px;letter-spacing:-.6px;margin:0;line-height:1}
.st-mast .who{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:11px;color:var(--t3);letter-spacing:.04em}
.st-mast .who b{color:var(--t2);font-weight:700}
.st-mast .who .save{color:var(--t3);padding-right:10px;border-right:1px solid var(--bor)}
.st-mast .who .av{width:28px;height:28px;border-radius:50%;background:var(--bg4);border:1px solid var(--bor);display:grid;place-items:center;font-family:var(--font);font-size:11px;font-weight:700;color:var(--t2)}
/* 섹션 — 카드 없음. 규칙선 + 모노 번호. */
.st-sec{margin-bottom:40px}
.st-sec-hd{display:flex;align-items:center;gap:10px;padding-bottom:9px;border-bottom:1px solid var(--bor)}
.st-sec-hd i{font-family:var(--font-mono);font-size:10px;font-style:normal;font-weight:700;color:var(--acc-br);letter-spacing:.1em}
.st-sec-hd h2{font-family:var(--font);font-weight:700;font-size:19px;letter-spacing:-.4px;margin:0}
.st-sec-hd .cnt{margin-left:auto;font-family:var(--font-mono);font-size:10px;color:var(--t3);letter-spacing:.06em}
.st-sec-note{font-size:12px;color:var(--t3);line-height:1.55;padding:10px 0 0;max-width:62ch;text-wrap:pretty}
.st-sec-note b{color:var(--t2);font-weight:600}
/* 행 */
.st-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;padding:12px 0;border-bottom:1px solid var(--hair)}
.st-row:last-child{border-bottom:none}
.st-lb{min-width:0}
.st-lb h3{font-size:13.5px;font-weight:600;color:var(--t1);margin:0;display:flex;align-items:center;gap:7px;letter-spacing:-.005em}
.st-lb p{font-size:12px;color:var(--t3);line-height:1.5;margin:4px 0 0;max-width:58ch;text-wrap:pretty}
.st-lb p b{color:var(--t2);font-weight:600}
.st-ac{display:flex;align-items:center;gap:10px;flex-shrink:0}
.st-row--off h3{color:var(--t3)}
.st-row--off .st-sw{opacity:.4;pointer-events:none}
.st-hint{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:9.5px;color:var(--t3);letter-spacing:.06em;margin-top:6px;border:1px solid var(--bor);padding:2px 6px}
/* 컨트롤 — .nfc .btn / .nfc .sw 와 동일 스펙(라운드 0) */
.st-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px;border:1px solid var(--bor);background:transparent;color:var(--t2);font-size:12.5px;font-weight:600;font-family:inherit;cursor:pointer;transition:.12s;white-space:nowrap}
.st-btn:hover:not(:disabled){color:var(--t1);border-color:var(--bor2)}
.st-btn:disabled{opacity:.35;cursor:not-allowed}
.st-btn--pri{background:var(--acc-br);border-color:var(--acc-br);color:#fff;font-weight:700}
.st-btn--pri:hover{background:var(--acc);border-color:var(--acc);color:#fff}
/* 탈퇴 = 부정 신호(디렉터 확정). 리브랜드가 폐기한 것은 '액센트로서의 레드'(#e50914)이고
   부정·위험 신호 레드는 --neg 로 살아 있다(base.css:22). --danger 3종은 그 파생 정본이다.
   ★var(--red) 를 쓰지 않는다 — work-detail-zine.css:9 가 :root 에 선언해 전역 해석은 되지만,
     그 별칭은 해당 페이지 네임스페이스 소유다(library-zine.css:19 는 .lbz 스코프). 여기선 정본을 직접 쓴다.
   ★var(--adult) 금지 — 19금 전용이라 성인경고 신호가 오염된다. */
.st-btn--warn{border-color:var(--danger-bor);color:var(--danger)}
.st-btn--warn:hover:not(:disabled){background:var(--danger-dim);border-color:var(--danger)}
.st-sel{height:32px;min-width:180px;background:var(--pane2);border:1px solid var(--bor);color:var(--t1);font-size:12.5px;font-family:inherit;padding:0 28px 0 10px;cursor:pointer;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--t3) 50%),linear-gradient(135deg,var(--t3) 50%,transparent 50%);background-position:calc(100% - 15px) 14px,calc(100% - 10px) 14px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.st-sel:focus{outline:none;border-color:var(--acc)}
.st-sel[data-pinned]{border-color:rgba(47,148,96,.5)}
.st-sw{position:relative;display:inline-block;width:36px;height:21px;border:1px solid var(--bor2);background:transparent;flex-shrink:0;cursor:pointer}
.st-sw input{position:absolute;opacity:0;width:0;height:0}
.st-sw .kn{position:absolute;top:2px;left:2px;width:15px;height:15px;background:var(--bor2);transition:left .15s,background .15s;pointer-events:none}
.st-sw:has(input:checked){background:var(--acc-dim);border-color:var(--acc)}
.st-sw input:checked~.kn{left:17px;background:var(--acc-br)}
.st-sw input:focus-visible~.kn{box-shadow:0 0 0 2px var(--acc-dim)}
.st-sw input:disabled~.kn{opacity:.5}
/* 계정 */
.st-id{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--bor);background:var(--pane);margin-top:14px}
.st-id>div{padding:13px 15px;display:flex;flex-direction:column;gap:5px;border-right:1px solid var(--hair)}
.st-id>div:last-child{border-right:none}
.st-id .k{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.12em;color:var(--t3);display:flex;align-items:center;gap:6px}
.st-id .v{font-size:14px;font-weight:600;color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-id .foot{display:flex;align-items:center;gap:8px;margin-top:2px}
.st-id .ro{font-family:var(--font-mono);font-size:9px;letter-spacing:.08em;color:var(--t3);border:1px solid var(--bor);padding:1px 5px}
.st-id .lnk{font-size:11.5px;font-weight:600;color:var(--acc-br);cursor:pointer;background:none;border:none;font-family:inherit;padding:0}
.st-soc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.st-soc-c{border:1px solid var(--bor);background:var(--pane);padding:14px;display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:center}
.st-soc-c.on{border-color:rgba(47,148,96,.4)}
.st-soc-c .ico{width:32px;height:32px;overflow:hidden;display:grid;place-items:center}
.st-soc-c .nm{font-size:13.5px;font-weight:700;color:var(--t1)}
.st-soc-c .stt{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;margin-top:3px;display:flex;align-items:center;gap:5px;color:var(--t3)}
.st-soc-c.on .stt{color:var(--acc-br)}
.st-soc-c .act{grid-column:1/-1;margin-top:4px}
.st-soc-c .act .st-btn{width:100%;justify-content:center;height:28px;font-size:11.5px}
/* 차단 */
.st-search{display:flex;align-items:center;gap:10px;margin-top:16px}
.st-search input{flex:1;height:34px;background:var(--pane2);border:1px solid var(--bor);color:var(--t1);font-size:12.5px;font-family:inherit;padding:0 12px;outline:none}
.st-search input:focus{border-color:var(--acc)}
.st-search input::placeholder{color:var(--t3)}
.st-blk{margin-top:4px}
.st-blk--scroll{max-height:320px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--bor) transparent}
.st-blk-row{display:grid;grid-template-columns:34px minmax(0,220px) minmax(0,1fr) auto;gap:14px;align-items:center;padding:11px 0;border-bottom:1px solid var(--hair)}
.st-blk-row:last-child{border-bottom:none}
.st-blk-row .av{width:34px;height:34px;border-radius:50%;background:var(--bg4);border:1px solid var(--bor);display:grid;place-items:center;font-size:12.5px;font-weight:700;color:var(--t2)}
.st-blk-row .nk{font-size:13px;font-weight:700;color:var(--t1);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-blk-row .nk:hover{color:var(--acc-br)}
.st-blk-row .dt{font-family:var(--font-mono);font-size:9px;color:var(--t3);letter-spacing:.06em;margin-top:2px}
.st-memo{width:100%;background:transparent;border:none;border-bottom:1px dashed var(--bor2);color:var(--t2);font-size:12px;font-family:inherit;padding:4px 2px;outline:none;transition:.15s}
.st-memo:hover{border-bottom-color:var(--t3);background:rgba(255,255,255,.02)}
.st-memo:focus{border-bottom-style:solid;border-bottom-color:var(--acc);color:var(--t1)}
.st-memo::placeholder{color:var(--t3);font-style:italic}
.st-blk-empty{padding:20px 0;font-size:12.5px;color:var(--t3)}
/* 개인화 — 4그룹 2열 */
.st-prefs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;row-gap:8px;margin-top:18px}
.st-grp{padding-bottom:8px}
.st-grp>.gh{display:flex;align-items:center;gap:9px;padding:10px 0 6px}
.st-grp>.gh span{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--acc-br);text-transform:uppercase}
.st-grp>.gh::after{content:"";flex:1;height:1px;background:var(--hair)}
.st-prow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:8px 0;border-bottom:1px solid var(--hair)}
.st-prow:last-child{border-bottom:none}
.st-prow .pl{font-size:12.5px;font-weight:500;color:var(--t2);display:flex;align-items:center;gap:6px;min-width:0}
.st-prow .pin{font-family:var(--font-mono);font-size:8.5px;color:var(--acc-br);border:1px solid rgba(47,148,96,.4);padding:0 4px;letter-spacing:.06em}
.st-prow .st-sel{min-width:168px;width:168px}
.st-disp{border-top:1px solid var(--bor);margin-top:16px}
.st-savebar{position:sticky;bottom:0;display:flex;align-items:center;gap:14px;padding:11px 13px;background:var(--pane);border-top:1px solid var(--bor);border-bottom:1px solid var(--bor)}
.st-savebar .msg{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;color:var(--t3)}
.st-savebar .msg b{color:var(--acc-br)}
.st-savebar .sp{flex:1}
/* 위험 영역 */
/* 컨테이너는 중립(--bor) — 액센트 초록은 긍정·진행 신호라 위험영역 테두리로 쓰면 버튼(--danger)과
   신호가 갈린다. 위험 신호는 행동(버튼)에만 두고 컨테이너는 구역 표시로만 둔다.
   --bor 인 이유: 이 블록의 박스 컨테이너가 쓰는 토큰이다(.st-id·.st-soc-c 등 9건). --hair 는 내부 구분선 전용. */
.st-dz{border:1px solid var(--bor);background:var(--pane);padding:17px 19px;margin-top:14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center}
.st-dz h3{margin:0 0 6px;font-size:14.5px;font-weight:700}
.st-dz ul{margin:0;padding-left:15px;display:grid;gap:3px}
.st-dz li{font-size:12px;color:var(--t3);text-wrap:pretty}
/* 반응형 — 설명문을 숨기지 않는다(구 .set-row__desc display:none 이 동의 안내·탈퇴 경고를 지웠다) */
@media(max-width:1023px){.st-prefs{grid-template-columns:minmax(0,1fr);column-gap:0}.st-soc{grid-template-columns:minmax(0,1fr)}}
@media(max-width:639px){.st-id{grid-template-columns:minmax(0,1fr)}.st-id>div{border-right:none;border-bottom:1px solid var(--hair)}.st-id>div:last-child{border-bottom:none}
.st-row,.st-prow{grid-template-columns:minmax(0,1fr);gap:10px}.st-ac{justify-content:flex-start}
.st-blk-row{grid-template-columns:34px minmax(0,1fr);grid-template-areas:"av nk" "memo memo" "btn btn";gap:8px 12px}
.st-blk-row .av{grid-area:av}.st-blk-row>div:nth-child(2){grid-area:nk}.st-memo{grid-area:memo}.st-blk-row .st-btn{grid-area:btn;justify-self:start}
.st-dz{grid-template-columns:minmax(0,1fr)}.st-prow .st-sel,.st-sel{width:100%;min-width:0}}
.st-legal-links{margin-top:40px;padding-top:16px;border-top:1px solid var(--hair);font-size:11.5px;color:var(--t3)}

/* ── 법적 문서(#terms·#privacy) — 관문 E. .lg-* 는 로그인게이트 버튼(community-zine-s8.css)이라 회피 */
.legal-page{max-width:720px;margin:0 auto;padding-bottom:64px}
.legal-mast{margin-bottom:22px}
.legal-mast h1{font-family:var(--font);font-weight:700;font-size:22px;letter-spacing:-.4px;margin:6px 0 0}
.legal-meta{font-size:11.5px;color:var(--t3);margin:6px 0 0;line-height:1.6}
.legal-h2{font-size:14.5px;font-weight:700;color:var(--t1);margin:26px 0 8px;padding-top:16px;border-top:1px solid var(--hair)}
.legal-h2:first-of-type{border-top:none;padding-top:0;margin-top:0}
.legal-p{font-size:12.5px;color:var(--t2);line-height:1.75;margin:0}
.legal-tbl-wrap{overflow-x:auto;margin:4px 0 6px}
.legal-link{color:var(--acc-br);cursor:pointer;text-decoration:underline}