:root {
  --bg: #09090b;
  --surface: #111114;
  --surface-2: #18181c;
  --surface-3: #222228;
  --line: #2b2b31;
  --text: #f7f7f5;
  --muted: #85858e;
  --accent: #ff514d;
  --accent-soft: rgba(255, 81, 77, .14);
  --green: #2de36f;
  --blue: #6f71ff;
  --stage: #111526;
  --font: Inter, Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); font-family: var(--font); }
button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible { outline: 2px solid #9496ff; outline-offset: 2px; }
.hidden { display: none !important; }
.app-view { min-height: 100svh; background: radial-gradient(circle at 85% 5%, rgba(84, 76, 255, .07), transparent 26%), var(--bg); }

.onboarding-view { display: grid; grid-template-columns: 1.08fr .92fr; overflow: hidden; }
.onboarding-visual { min-height: 100svh; position: relative; background: #111525; overflow: hidden; display: grid; place-items: center; }
.onboarding-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(111,113,255,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(111,113,255,.15) 1px, transparent 1px); background-size: 46px 46px; mask-image: linear-gradient(90deg,#000,rgba(0,0,0,.3)); }
.onboarding-visual::after { content:""; position:absolute; width:420px; height:420px; border:1px solid rgba(255,81,77,.28); border-radius:50%; box-shadow:0 0 0 80px rgba(255,81,77,.025),0 0 0 160px rgba(255,81,77,.018); }
.onboarding-demo { position: relative; z-index: 2; width: min(70%, 520px); aspect-ratio: 1.35; border: 1px solid #353c65; background: rgba(10,12,24,.76); transform: perspective(700px) rotateX(55deg); box-shadow: 0 55px 70px rgba(0,0,0,.55); transition: transform .6s ease; }
.onboarding-demo i, .auth-formation i { position:absolute; width:22px; height:22px; border-radius:50%; background:var(--dot,#fff); left:var(--x); top:var(--y); transform:translate(-50%,-50%); box-shadow:0 0 24px color-mix(in srgb,var(--dot,#fff) 60%,transparent); }
.onboarding-content { min-height:100svh; padding: clamp(32px,6vw,90px); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; background:linear-gradient(160deg,#111114,#09090b 70%); }
.onboarding-brand { position:absolute; top:34px; }
.onboarding-content h1 { font-size:clamp(40px,5vw,72px); line-height:.98; letter-spacing:-.065em; margin:10px 0 24px; }
.onboarding-content > p:not(.eyebrow) { color:#9999a2; line-height:1.7; max-width:460px; }
.onboarding-dots { display:flex; gap:6px; margin:34px 0 18px; }
.onboarding-dots i { width:6px; height:6px; border-radius:50%; background:#3a3a42; transition:width .2s,background .2s; }
.onboarding-dots i.active { width:24px; background:var(--accent); border-radius:9px; }
.onboarding-next { width:min(100%,420px); border:0; border-radius:13px; background:var(--accent); padding:15px; font-weight:900; cursor:pointer; }
.onboarding-skip { width:min(100%,420px); border:0; background:transparent; color:var(--muted); padding:14px; cursor:pointer; font-size:10px; }

.auth-view { display:grid; grid-template-columns:minmax(360px,520px) 1fr; }
.auth-panel { padding:clamp(30px,6vw,80px); display:flex; flex-direction:column; justify-content:center; text-align:center; }
.auth-brand { justify-content:center; margin-bottom:60px; }
.auth-panel h1 { font-size:clamp(38px,5vw,64px); line-height:.98; letter-spacing:-.06em; margin:10px 0 18px; }
.auth-panel > p:not(.eyebrow) { color:var(--muted); margin-bottom:32px; }
.auth-button { width:100%; border:1px solid var(--line); background:var(--surface-2); border-radius:12px; padding:14px; margin-bottom:9px; cursor:pointer; font-weight:800; }
.auth-button.email { background:var(--accent); border-color:var(--accent); }
.auth-panel small { color:#62626b; line-height:1.5; margin:12px 0 28px; }
.auth-signin { border:0; background:transparent; color:var(--muted); cursor:pointer; }
.auth-signin b { color:var(--text); }
.auth-stage { position:relative; overflow:hidden; background-color:#111525; background-image:linear-gradient(#252b49 1px,transparent 1px),linear-gradient(90deg,#252b49 1px,transparent 1px); background-size:50px 50px; display:grid; place-items:center; }
.auth-stage::before { content:""; position:absolute; inset:12%; border:1px solid rgba(255,81,77,.25); border-radius:50%; }
.auth-formation { width:65%; aspect-ratio:1.4; position:relative; transform:perspective(800px) rotateX(58deg); }

.global-header, .editor-header {
  height: 68px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 24px; border-bottom: 1px solid var(--line); background: rgba(9, 9, 11, .9);
  backdrop-filter: blur(18px); position: sticky; top: 0; z-index: 30;
}
.icon-button { border: 0; background: transparent; min-width: 38px; height: 38px; border-radius: 10px; cursor: pointer; font-size: 20px; }
.icon-button:hover { background: var(--surface-3); }
.wordmark { color: var(--text); text-decoration: none; display: flex; gap: 11px; align-items: center; font-weight: 850; letter-spacing: .08em; font-size: 13px; }
.mark { width: 30px; height: 30px; border: 2px solid var(--text); display: grid; place-items: center; border-radius: 50%; color: var(--accent); font-family: Georgia, serif; }
.brand-icon { width: 36px; height: 36px; border-radius: 10px; object-fit: cover; box-shadow: 0 5px 18px rgba(0,0,0,.38); }
.header-actions, .editor-actions, .editor-left { display: flex; align-items: center; gap: 5px; }
.library-shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 64px 0 140px; }
.library-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 26px; }
.eyebrow { margin: 0 0 7px; color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .16em; }
h1, h2, h3, p { margin-top: 0; }
.library-heading h1 { margin: 0; font-size: clamp(32px, 5vw, 54px); letter-spacing: -.055em; }
.text-button { background: none; border: 0; color: #b8b8bf; cursor: pointer; }
.project-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(248px, 1fr)); gap: 16px; min-height: 220px; }
.library-panel { animation:panelIn .24s ease both; }
@keyframes panelIn { from { opacity:0; transform:translateY(8px); } }
.filter-row,.explore-controls { display:flex; gap:8px; align-items:center; margin-bottom:20px; flex-wrap:wrap; }
.filter-chip,.view-toggle { border:1px solid var(--line); background:transparent; color:var(--muted); padding:8px 11px; border-radius:999px; cursor:pointer; font-size:10px; }
.filter-chip.active { background:var(--surface-3); color:var(--text); }
.view-toggle { margin-left:auto; border-radius:9px; }
.project-card { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; cursor: pointer; transition: transform .2s, border-color .2s; text-align: left; padding: 0; }
.project-card:hover { transform: translateY(-4px); border-color: #50505a; }
.project-preview { aspect-ratio: 16 / 10; background: var(--stage); position: relative; overflow: hidden; }
.preview-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(113,115,255,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(113,115,255,.13) 1px, transparent 1px); background-size: 24px 24px; }
.preview-dot { width: 7px; height: 7px; background: #fafafa; border-radius: 50%; position: absolute; transform: translate(-50%, -50%); box-shadow: 0 0 12px rgba(255,255,255,.35); }
.project-info { padding: 15px; display: flex; justify-content: space-between; gap: 14px; }
.project-info b { font-size: 14px; }
.project-info small { color: var(--muted); display: block; margin-top: 6px; }
.card-menu { border: 0; background: none; color: var(--muted); cursor: pointer; font-size: 19px; }
.shared-section { margin-top: 58px; border-top: 1px solid var(--line); padding-top: 28px; }
.asset-section { margin-top:42px; border-top:1px solid var(--line); padding-top:24px; }
.asset-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:10px; margin-top:15px; }
.asset-card { border:1px solid var(--line); background:var(--surface); border-radius:12px; padding:14px; display:grid; grid-template-columns:36px 1fr auto; align-items:center; gap:10px; text-align:left; cursor:pointer; }
.asset-card span:first-child { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:var(--surface-3); }
.asset-card b { display:block; font-size:11px; }
.asset-card small { color:var(--muted); font-size:9px; }
.asset-card em { color:var(--muted); font-style:normal; }
.explore-intro { display:flex; align-items:center; gap:18px; padding:20px 0 28px; }
.compass-mark { width:52px; height:52px; border:2px solid var(--blue); color:var(--blue); border-radius:50%; display:grid; place-items:center; font-size:24px; }
.explore-intro h2 { margin:0 0 5px; }
.explore-intro p { margin:0; color:var(--muted); font-size:12px; }
.explore-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:15px; }
.explore-card { border:1px solid var(--line); background:var(--surface); border-radius:15px; overflow:hidden; cursor:pointer; }
.explore-card .project-preview { aspect-ratio:1.5; }
.explore-card footer { padding:13px; display:flex; justify-content:space-between; align-items:center; }
.explore-card footer b { font-size:12px; }
.explore-card footer span { color:var(--muted); font-size:10px; }
.section-title { display: flex; align-items: center; justify-content: space-between; }
.section-title h2, .section-title h3 { margin: 0; font-size: 16px; }
.section-title span { border: 1px solid var(--line); color: var(--muted); border-radius: 999px; padding: 3px 8px; font-size: 10px; }
.empty-state { min-height: 190px; display: grid; place-items: center; align-content: center; color: var(--muted); gap: 20px; text-align: center; }
.empty-orbit { width: 44px; height: 44px; border-radius: 50%; border: 1px solid #313139; box-shadow: 0 0 0 14px rgba(255,255,255,.018); }
.bottom-nav { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); height: 68px; background: rgba(20,20,24,.92); border: 1px solid var(--line); border-radius: 22px; padding: 7px; display: flex; gap: 5px; z-index: 25; backdrop-filter: blur(18px); }
.bottom-nav button { min-width: 92px; border: 0; background: transparent; border-radius: 15px; color: var(--muted); cursor: pointer; font-size: 10px; display: grid; place-items: center; gap: 3px; }
.bottom-nav button span { font-size: 20px; }
.bottom-nav button.active { background: var(--surface-3); color: var(--text); }
.floating-add { position: fixed; right: max(30px, calc((100vw - 1180px) / 2)); bottom: 26px; width: 58px; height: 58px; border-radius: 50%; border: 0; background: #f5f5f3; color: #111; font-size: 33px; cursor: pointer; z-index: 26; box-shadow: 0 15px 40px rgba(0,0,0,.38); transition: transform .2s; }
.floating-add:hover { transform: rotate(90deg) scale(1.05); }

.review-header { justify-content: space-between; }
.review-header-actions { display:flex; gap:8px; }
.review-shell { width:min(1320px,calc(100% - 40px)); margin:0 auto; padding:52px 0 80px; }
.review-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:28px; }
.review-heading h1 { margin:0; font-size:clamp(34px,5vw,58px); letter-spacing:-.055em; }
.review-heading > div > p:last-child { color:var(--muted); font-size:12px; margin:12px 0 0; }
.review-sync-note { border:1px solid var(--line); border-radius:13px; padding:12px 15px; min-width:170px; }
.review-sync-note span,.review-sync-note b { display:block; }
.review-sync-note span { color:var(--muted); font-size:8px; letter-spacing:.13em; }
.review-sync-note b { margin-top:6px; font-size:11px; }
.review-metrics { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:16px; overflow:hidden; margin-bottom:16px; }
.review-metrics article { padding:18px; background:var(--surface); border-right:1px solid var(--line); }
.review-metrics article:last-child { border-right:0; }
.review-metrics span,.review-metrics b { display:block; }
.review-metrics span { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.review-metrics b { font-size:25px; margin-top:7px; }
.review-filters { display:grid; grid-template-columns:170px 150px 130px 1fr; gap:8px; margin-bottom:16px; }
.review-filters label,.review-decision label { color:var(--muted); font-size:9px; display:grid; gap:6px; }
.review-filters select,.review-filters input,.review-decision input,.review-decision textarea {
  width:100%; box-sizing:border-box; border:1px solid var(--line); background:var(--surface);
  color:var(--text); border-radius:10px; padding:10px 11px; font:inherit;
}
.review-workspace { display:grid; grid-template-columns:280px minmax(420px,1fr) 300px; min-height:650px; border:1px solid var(--line); border-radius:17px; overflow:hidden; background:var(--surface); }
.review-list-panel { border-right:1px solid var(--line); min-width:0; }
.review-panel-title { min-height:52px; display:flex; align-items:center; justify-content:space-between; padding:0 15px; border-bottom:1px solid var(--line); }
.review-panel-title b { font-size:11px; }
.review-panel-title span { color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:3px 7px; font-size:8px; }
.review-list { max-height:720px; overflow-y:auto; }
.review-move-row { width:100%; display:grid; grid-template-columns:8px 1fr auto; gap:10px; align-items:center; padding:13px 12px; border:0; border-bottom:1px solid var(--line); background:transparent; text-align:left; cursor:pointer; }
.review-move-row:hover,.review-move-row.active { background:var(--surface-3); }
.review-move-row.active { box-shadow:inset 2px 0 var(--accent); }
.review-move-row b,.review-move-row small { display:block; }
.review-move-row b { font-size:10px; }
.review-move-row small { color:var(--muted); font-size:8px; margin-top:4px; }
.review-move-row em { font-style:normal; }
.review-risk { width:7px; height:7px; border-radius:50%; }
.risk-low { background:var(--green); color:var(--green); }
.risk-moderate { background:#ffd34f; color:#ffd34f; }
.risk-high { background:var(--accent); color:var(--accent); }
.review-status { border-radius:999px; padding:4px 6px; font-size:7px; border:1px solid currentColor; }
.pending { color:#aaaab2 !important; }
.approved { color:var(--green) !important; }
.rejected { color:var(--accent) !important; }
.review-detail { padding:26px; overflow-y:auto; max-height:720px; }
.review-detail-head { display:flex; justify-content:space-between; align-items:start; gap:18px; }
.review-detail-head h2 { font-size:28px; margin:0 0 6px; }
.review-detail-head span { color:var(--muted); font-size:9px; }
.risk-badge { border:1px solid currentColor; padding:6px 8px; border-radius:999px; font-size:8px; font-style:normal; white-space:nowrap; }
.review-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin:22px 0; }
.review-facts div { border:1px solid var(--line); border-radius:10px; padding:10px; }
.review-facts span,.review-facts b { display:block; }
.review-facts span { color:var(--muted); font-size:8px; }
.review-facts b { font-size:10px; margin-top:5px; }
.review-section { border-top:1px solid var(--line); padding-top:18px; margin-top:18px; }
.review-section > p:last-child { color:#bcbcc4; font-size:10px; line-height:1.65; margin-bottom:0; }
.review-section.cue { background:rgba(108,229,154,.06); border:1px solid rgba(108,229,154,.18); border-radius:12px; padding:15px; }
.review-section.safety { background:rgba(255,211,79,.05); border:1px solid rgba(255,211,79,.18); border-radius:12px; padding:15px; }
.review-section.safety.high { background:var(--accent-soft); border-color:rgba(255,81,77,.3); }
.review-tags { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:10px; }
.review-tags span { border:1px solid var(--line); border-radius:999px; padding:5px 7px; color:#c7c7cf; font-size:8px; }
.review-sources { display:grid; gap:8px; }
.review-source { display:block; border:1px solid var(--line); border-radius:10px; padding:11px; text-decoration:none; transition:border-color .2s; }
.review-source:hover { border-color:#656570; }
.review-source span,.review-source b,.review-source small { display:block; }
.review-source span { color:var(--muted); font-size:7px; text-transform:uppercase; letter-spacing:.08em; }
.review-source b { color:var(--text); font-size:9px; margin:4px 0; }
.review-source small { color:#8f8f98; font-size:8px; line-height:1.5; }
.review-decision { border-left:1px solid var(--line); padding:20px 16px; overflow-y:auto; max-height:720px; }
.decision-current { display:flex; align-items:center; justify-content:space-between; padding:12px; background:var(--surface-3); border-radius:10px; margin:13px 0 18px; }
.decision-current span { color:var(--muted); font-size:9px; }
.decision-current b { font-size:9px; }
.review-decision label { margin-bottom:14px; }
.review-decision textarea { resize:vertical; line-height:1.5; }
.review-safety-check { grid-template-columns:17px 1fr !important; align-items:start; color:#c9c9cf !important; line-height:1.45; }
.review-safety-check input { width:15px; margin-top:1px; }
.review-safety-check.muted { opacity:.45; }
.decision-actions { display:grid; gap:7px; border-top:1px solid var(--line); padding-top:16px; }
.decision-actions button { border:1px solid var(--line); background:var(--surface-3); border-radius:9px; padding:10px; cursor:pointer; font-size:9px; font-weight:850; }
.decision-actions .approve { background:var(--green); border-color:var(--green); color:#08140c; }
.decision-actions .reject { color:var(--accent); }
.review-history { border-top:1px solid var(--line); margin-top:22px; }
.review-history .review-panel-title { padding:0; }
.review-history article { border-bottom:1px solid var(--line); padding:11px 0; }
.review-history article > div { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.review-history article > div button { width:24px; height:24px; border:0; border-radius:7px; background:transparent; color:#74747d; cursor:pointer; }
.review-history article > div button:hover { color:#fff; background:var(--accent); }
.review-history article b,.review-history article span { display:block; }
.review-history article b { font-size:9px; }
.review-history article span,.review-history > p { color:var(--muted); font-size:8px; margin-top:4px; }
.review-history article p { color:#a8a8b0; font-size:8px; line-height:1.5; margin:7px 0 0; }
.review-empty { color:var(--muted); padding:24px; font-size:10px; line-height:1.6; }

.editor-header { padding: 0 16px; }
.project-identity { display: grid; gap: 2px; margin-left: 5px; }
.project-identity input { color: var(--text); background: transparent; border: 0; font-weight: 750; width: min(38vw, 340px); padding: 2px 4px; }
.project-identity span { color: var(--muted); font-size: 9px; padding-left: 4px; }
.editor-layout { height: calc(100svh - 68px); display: grid; grid-template-columns: 76px minmax(500px, 1fr) 284px; overflow: hidden; }
.left-rail { border-right: 1px solid var(--line); padding: 14px 10px; display: flex; flex-direction: column; gap: 7px; }
.rail-button { height: 58px; border: 0; background: transparent; color: var(--muted); border-radius: 12px; cursor: pointer; display: grid; place-items: center; align-content: center; gap: 2px; font-size: 9px; }
.rail-button span { font-size: 20px; }
.rail-button.active, .rail-button:hover { color: var(--text); background: var(--surface-2); }
.stage-column { padding: 16px 18px; display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.stage-toolbar { height: 52px; display: flex; align-items: start; justify-content: space-between; }
.formation-meta span { display: block; color: var(--accent); font-size: 9px; letter-spacing: .12em; font-weight: 900; }
.formation-meta input { border: 0; background: transparent; color: var(--text); font-size: 18px; font-weight: 800; width: 220px; padding: 4px 0; }
.stage-readout { display: flex; gap: 16px; color: var(--muted); font-size: 9px; }
.stage-readout b { color: var(--text); }
.live-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; background: var(--green); margin-right: 6px; box-shadow: 0 0 10px var(--green); }
.stage-frame { position: relative; flex: 1; min-height: 340px; perspective: 900px; display: grid; place-items: center; overflow: hidden; }
#formationStage { width: min(100%, 930px); height: 100%; max-height: 570px; touch-action: none; overflow: visible; transition: transform .45s ease, filter .45s ease; }
#formationStage.pose-muted { opacity:.1; filter:blur(3px); pointer-events:none; }
.pose-preview-overlay { position:absolute; inset:3% 5%; z-index:4; display:grid; grid-template-rows:auto minmax(0,1fr) auto; padding:18px 22px; background:rgba(13,13,17,.94); border:1px solid #3b3b46; border-radius:16px; box-shadow:0 24px 70px rgba(0,0,0,.4); backdrop-filter:blur(12px); }
.pose-preview-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.pose-preview-head span { color:var(--accent); font-size:8px; font-weight:900; letter-spacing:.1em; }
.pose-preview-head h2 { margin:5px 0 0; font-size:18px; }
.pose-preview-head .pose-preview-badge { color:#8c8c97; border:1px solid #42424b; border-radius:999px; padding:5px 8px; }
.pose-preview-canvas { min-height:0; display:grid; place-items:center; }
.pose-figure { width:min(100%,430px); height:100%; max-height:390px; overflow:visible; }
.pose-figure.compact { width:100%; height:100%; max-height:none; }
.pose-ghost { stroke:#34343d; stroke-width:2; stroke-dasharray:3 5; }
.pose-trail { stroke:#ff645f; stroke-width:1.2; stroke-dasharray:3 4; opacity:.42; }
.pose-edge { stroke-width:3.2; stroke-linecap:round; transition:all .22s ease; }
.pose-edge.active { stroke-width:4.3; filter:drop-shadow(0 0 3px rgba(255,100,95,.25)); }
.pose-svg-label { fill:#8e8e98; text-anchor:middle; font-size:7px; letter-spacing:.05em; }
.pose-preview-footer { display:grid; grid-template-columns:32px 42px 32px 1fr; gap:6px; align-items:center; border-top:1px solid var(--line); padding-top:10px; }
.pose-preview-footer button { height:32px; border:1px solid #414149; border-radius:8px; background:#202026; color:var(--text); cursor:pointer; }
.pose-preview-footer .pose-play-button { height:38px; background:var(--text); color:#111; border-radius:50%; font-weight:900; }
.pose-preview-footer p { margin:0 0 0 8px; color:#8b8b94; font-size:8px; line-height:1.5; }
.combined-pose-layer { display:none; }
.stage-frame.is-3d #formationStage { transform: rotateX(52deg) scale(.86) translateY(-8%); filter: drop-shadow(0 42px 24px rgba(0,0,0,.5)); transform-origin: center 70%; }
.stage-direction { position: absolute; color: #575761; font-size: 8px; letter-spacing: .13em; z-index: 2; pointer-events: none; }
.stage-direction.top { top: 2%; }
.stage-direction.bottom { bottom: 1%; }
.stage-frame.audience-top .top { top: auto; bottom: 1%; }
.stage-frame.audience-top .bottom { bottom: auto; top: 2%; }
.stage-base { fill: var(--stage); stroke: #353548; stroke-width: 2; }
.stage-grid { stroke: #252b49; stroke-width: 1; }
.stage-grid.major { stroke: #404867; }
.stage-center { stroke: var(--accent); stroke-width: 1.4; opacity: .55; }
.distance-label { fill: #575d79; font-size: 12px; text-anchor: middle; }
.movement-path { fill: none; stroke: rgba(255,255,255,.28); stroke-width: 3; stroke-dasharray: 8 9; }
.movement-path.risk { stroke: rgba(255,81,77,.8); }
.movement-path.route { stroke-width:4; stroke-dasharray:10 8; animation:routeFlow 1.1s linear infinite; }
.route-label { fill:#d7d7dd; font-size:11px; font-weight:800; text-anchor:middle; paint-order:stroke; stroke:#0e101c; stroke-width:5px; stroke-linejoin:round; }
@keyframes routeFlow { to { stroke-dashoffset:-36; } }
.dancer-node { cursor: grab; filter: drop-shadow(0 8px 10px rgba(0,0,0,.5)); }
.dancer-node:active { cursor: grabbing; }
.dancer-node .body { stroke: #0b0b0d; stroke-width: 6; }
.dancer-node .select-ring { fill: none; stroke: white; stroke-width: 2; opacity: 0; }
.dancer-node.selected .select-ring, .dancer-node:hover .select-ring { opacity: .9; }
.dancer-node.risk .select-ring { stroke: var(--accent); opacity: 1; animation: riskPulse 1.3s infinite; }
.dancer-label { fill: #101012; font-size: 15px; font-weight: 900; text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.outer-label { fill: #d4d4da; font-size: 12px; text-anchor: middle; pointer-events: none; }
.stage-frame.pose-combined .outer-label { transform:translateY(9px); fill:#e6e6ea; font-weight:750; }
.pose-marker-edge { stroke-width:6.5; stroke-linecap:round; opacity:.82; }
.pose-marker-edge.active { stroke-width:8; opacity:1; filter:drop-shadow(0 0 4px rgba(255,255,255,.18)); }
.pose-marker-joint { stroke:#111116; stroke-width:2.5; }
.pose-marker-identity circle { stroke:#0b0b0e; stroke-width:4; }
.pose-marker-label { fill:#101012; font-size:8px; font-weight:950; text-anchor:middle; dominant-baseline:central; }
.stage-frame.pose-combined .dancer-node { filter:none; }
.stage-frame.pose-combined .dancer-node .select-ring { stroke-width:2.5; }
@keyframes riskPulse { 50% { stroke-width: 7; opacity: .45; } }
.selection-toolbar { position: absolute; bottom: 18px; left: 50%; transform: translateX(-50%); background: var(--accent); padding: 5px; border-radius: 12px; display: flex; gap: 3px; box-shadow: 0 16px 40px rgba(0,0,0,.35); }
.selection-toolbar button { border: 0; background: transparent; padding: 9px 12px; font-size: 10px; font-weight: 850; cursor: pointer; border-radius: 8px; }
.selection-toolbar button:hover { background: rgba(0,0,0,.16); }
.playback-row { height: 46px; display: grid; grid-template-columns: 42px 50px 1fr 42px; align-items: center; gap: 4px; border-top: 1px solid var(--line); }
.skip-button, .play-button { border: 0; background: transparent; cursor: pointer; }
.play-button { width: 38px; height: 38px; border-radius: 50%; background: var(--text); color: #111; justify-self: center; }
.time-readout { color: var(--muted); font-size: 10px; text-align: center; }
.time-readout b { color: var(--accent); }
.timeline-wrap { height: 126px; position: relative; border-top: 1px solid var(--line); padding: 24px 54px 10px 8px; }
.timeline-ruler { position: absolute; top: 7px; left: 8px; right: 55px; height: 13px; background-image: repeating-linear-gradient(90deg, #3c3c44 0 1px, transparent 1px 25px); }
.timeline-track { display: flex; gap: 5px; height: 82px; overflow-x: auto; scrollbar-width: thin; }
.timeline-card { min-width: 118px; border: 1px solid var(--line); background: var(--surface); border-radius: 12px; overflow: hidden; cursor: pointer; padding: 0; text-align: left; transition: border-color .2s, transform .2s; }
.timeline-card.active { border-color: var(--accent); transform: translateY(-3px); }
.timeline-mini { height: 50px; background: var(--stage); position: relative; }
.timeline-mini i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: white; transform: translate(-50%, -50%); }
.timeline-copy { padding: 7px 9px; display: flex; justify-content: space-between; align-items: center; }
.timeline-copy b { font-size: 9px; }
.timeline-copy span { color: var(--muted); font-size: 8px; }
.timeline-add { position: absolute; right: 7px; top: 43px; width: 39px; height: 39px; border: 1px solid #52525c; background: var(--surface-2); border-radius: 50%; font-size: 23px; cursor: pointer; }
.timeline-add:hover { border-color: var(--accent); }
.inspector { border-left: 1px solid var(--line); background: var(--surface); overflow-y: auto; padding: 22px 16px; }
.inspector-tabs { display:grid; grid-template-columns:1fr 1fr; background:#0e0e11; padding:4px; border-radius:10px; margin-bottom:20px; }
.inspector-tabs button { border:0; background:transparent; color:var(--muted); padding:9px 4px; border-radius:7px; font-size:8px; cursor:pointer; }
.inspector-tabs button.active { background:var(--surface-3); color:var(--text); }
.inspector-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }
.inspector-head h2 { margin: 0; font-size: 20px; }
.small-add { border: 1px solid var(--line); background: transparent; padding: 7px 10px; border-radius: 9px; color: var(--muted); cursor: pointer; font-size: 10px; }
.dancer-list { display: grid; }
.dancer-row { border: 0; border-bottom: 1px solid var(--line); background: transparent; display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; padding: 10px 4px; cursor: pointer; text-align: left; border-radius: 8px; }
.dancer-row:hover, .dancer-row.active { background: var(--surface-3); }
.dancer-swatch { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; color: #111; font-size: 9px; font-weight: 900; }
.dancer-row b { display: block; font-size: 11px; }
.dancer-row small { color: var(--muted); font-size: 9px; }
.distance { color: var(--muted); font-size: 9px; }
.inspector-section { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 18px; }
.risk-list { margin-top: 11px; display: grid; gap: 7px; }
.risk-item { background: var(--accent-soft); border-left: 2px solid var(--accent); padding: 8px; font-size: 9px; line-height: 1.5; }
.risk-empty { color: var(--muted); font-size: 10px; line-height: 1.5; }
.selected-panel p:last-child { color: #b3b3bb; font-size: 10px; line-height: 1.6; }
.editor-choreo-meta { display:flex; gap:5px; flex-wrap:wrap; margin-bottom:14px; }
.editor-choreo-meta span { border:1px solid var(--line); border-radius:999px; padding:5px 7px; color:var(--muted); font-size:7px; }
.editor-phrase-list { display:grid; gap:9px; }
.editor-phrase-card { border:1px solid var(--line); border-radius:11px; padding:11px; background:#121216; }
.phrase-pose-thumb { width:100% !important; height:72px; margin-top:8px; padding:3px !important; display:block; position:relative; border:1px solid #292934 !important; background:#0c0c10 !important; overflow:hidden; }
.phrase-pose-thumb:hover,.phrase-pose-thumb.active { border-color:var(--accent) !important; background:#17171d !important; }
.phrase-pose-thumb span { position:absolute; right:6px; bottom:5px; color:#696973; text-transform:uppercase; letter-spacing:.1em; }
.editor-phrase-card header,.editor-phrase-card > div { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.editor-phrase-card header span { color:var(--accent); font-size:8px; font-weight:900; }
.editor-phrase-card header em { width:6px; height:6px; border-radius:50%; font-size:0; }
.editor-phrase-card > b { display:block; font-size:11px; margin-top:8px; }
.editor-phrase-card p { color:#9b9ba4; font-size:8px; line-height:1.5; margin:6px 0 10px; }
.editor-phrase-card > div span { color:var(--muted); font-size:7px; }
.editor-phrase-card button { border:0; background:var(--surface-3); border-radius:7px; color:#cfcfd5; padding:6px 7px; font-size:7px; cursor:pointer; }
.editor-phrase-card .phrase-actions { display:flex; gap:4px; }
.editor-phrase-card .phrase-delete { color:#a97275; }
.editor-phrase-card .phrase-delete:hover { color:#fff; background:var(--accent); }
.add-phrase-button { width:100%; border:1px dashed #44444e; background:transparent; color:#9a9aa4; border-radius:10px; padding:10px; font-size:8px; cursor:pointer; }
.add-phrase-button:hover { color:var(--text); border-color:#777782; }
.timeline-move-label { display:block; color:#75757e; font-size:6px; padding:0 9px 7px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.audio-strip { position: fixed; left: 77px; right: 285px; bottom: 0; z-index: 10; background: rgba(21,21,25,.96); border-top: 1px solid var(--line); padding: 9px 20px; display: flex; align-items: center; justify-content: space-between; }
.audio-strip > div { display: grid; grid-template-columns: 140px 1fr; align-items: center; width: 100%; }
.audio-title { font-size: 10px; }
.waveform { height: 26px; background: repeating-linear-gradient(90deg, transparent 0 3px, rgba(255,81,77,.55) 3px 5px, transparent 5px 8px); mask-image: linear-gradient(0deg, transparent, #000 35% 65%, transparent); }
.audio-strip button { border: 0; background: none; color: var(--muted); font-size: 10px; cursor: pointer; }

.popover { position: fixed; z-index: 60; right: max(30px, calc((100vw - 1180px) / 2)); bottom: 94px; background: #222227; border: 1px solid #3a3a42; border-radius: 16px; padding: 8px; width: 220px; box-shadow: 0 24px 60px rgba(0,0,0,.5); }
.popover button { width: 100%; border: 0; background: transparent; display: grid; grid-template-columns: 32px 1fr; text-align: left; align-items: center; padding: 12px; border-radius: 10px; cursor: pointer; }
.popover button:hover { background: #303038; }
.sheet { width: min(520px, calc(100vw - 28px)); border: 1px solid #3a3a42; border-radius: 20px; padding: 0; background: #17171b; color: var(--text); box-shadow: 0 30px 100px rgba(0,0,0,.75); }
.large-sheet { width: min(880px, calc(100vw - 28px)); }
.sheet::backdrop { background: rgba(0,0,0,.7); backdrop-filter: blur(8px); }
.sheet form { margin: 0; }
.sheet-header { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 12px; padding: 16px; border-bottom: 1px solid var(--line); }
.sheet-header.compact-header { grid-template-columns: 1fr auto; }
.sheet-header.compact-header .icon-button { justify-self: end; }
.sheet-header h2 { margin: 0; font-size: 18px; }
.primary-button, .secondary-button { border: 0; border-radius: 10px; padding: 10px 17px; cursor: pointer; font-weight: 850; }
.primary-button { background: var(--accent); }
.secondary-button { background: var(--surface-3); }
.creation-layout { display: grid; grid-template-columns: 1fr 270px; min-height: 440px; }
.creation-stage { padding: 22px; }
.creation-stage > p { color: var(--muted); font-size: 11px; }
.mini-stage { position: relative; height: 320px; background-color: var(--stage); background-image: linear-gradient(#252b49 1px, transparent 1px), linear-gradient(90deg, #252b49 1px, transparent 1px); background-size: 32px 32px; border: 1px solid #394064; border-radius: 9px; cursor: crosshair; }
.mini-stage::before, .mini-stage::after { content: ""; position: absolute; background: rgba(255,81,77,.45); pointer-events: none; }
.mini-stage::before { width: 1px; top: 0; bottom: 0; left: 50%; }
.mini-stage::after { height: 1px; left: 0; right: 0; top: 50%; }
.placed-dancer { width: 19px; height: 19px; border-radius: 50%; background: #f7f7f5; color: #111; display: grid; place-items: center; position: absolute; transform: translate(-50%,-50%); z-index: 2; font-size: 8px; font-weight: 900; }
.placed-dancer { border:0; cursor:pointer; }
.placed-dancer:hover { background:var(--accent); color:#fff; }
.creation-controls { border-left: 1px solid var(--line); padding: 22px; display: grid; align-content: start; gap: 21px; }
.creation-controls label, .drawer-field { color: var(--muted); font-size: 10px; font-weight: 750; display: grid; gap: 9px; }
.creation-controls input, .drawer-field input { background: var(--surface-3); color: var(--text); border: 1px solid #383840; border-radius: 9px; padding: 11px; }
.stepper { display: grid; grid-template-columns: 42px 1fr 42px; align-items: center; border: 1px solid var(--line); border-radius: 11px; overflow: hidden; }
.stepper button { border: 0; background: var(--surface-3); height: 38px; cursor: pointer; }
.stepper b { text-align: center; color: var(--text); font-size: 14px; }
.helper { color: var(--muted); font-size: 10px; }

.ai-sheet { width:min(1120px,calc(100vw - 28px)); max-height:92svh; overflow:hidden; }
.ai-sheet form { display:grid; grid-template-rows:auto minmax(0,1fr) auto; max-height:92svh; }
.ai-engine-badge { border:1px solid rgba(108,229,154,.35); color:var(--green); border-radius:999px; padding:6px 9px; font-size:7px; font-weight:900; letter-spacing:.08em; }
.ai-builder { display:grid; grid-template-columns:360px 1fr; min-height:600px; overflow:hidden; }
.ai-brief { border-right:1px solid var(--line); padding:20px; overflow-y:auto; }
.ai-brief > label,.ai-field-grid label { color:var(--muted); font-size:8px; display:grid; gap:7px; margin-bottom:14px; }
.ai-brief input,.ai-brief select { box-sizing:border-box; width:100%; border:1px solid var(--line); background:var(--surface-3); color:var(--text); border-radius:9px; padding:10px; }
.ai-field-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 9px; }
.ai-constraints { border:1px solid var(--line); border-radius:11px; padding:12px; display:grid; grid-template-columns:1fr 1fr; gap:9px; margin:3px 0 14px; }
.ai-constraints legend { color:var(--muted); font-size:8px; padding:0 5px; }
.ai-constraints label { display:flex; align-items:center; gap:6px; color:#bdbdc5; font-size:8px; }
.ai-constraints input { width:auto; }
.ai-notice { background:rgba(255,211,79,.06); border:1px solid rgba(255,211,79,.18); color:#c7bd91; border-radius:9px; padding:10px; font-size:8px; line-height:1.55; }
.ai-generate { width:100%; margin-top:14px; }
.ai-preview { background:#0f0f12; padding:20px; overflow-y:auto; }
.ai-preview-empty { min-height:520px; display:grid; place-items:center; align-content:center; color:var(--muted); text-align:center; }
.ai-preview-empty span { width:48px; height:48px; display:grid; place-items:center; border:1px solid #3d3d47; border-radius:50%; font-size:20px; margin-bottom:13px; }
.ai-preview-empty b { color:var(--text); }
.ai-preview-empty p { font-size:9px; margin-top:8px; }
.ai-preview-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.ai-preview-head h3 { margin:0; font-size:21px; }
.ai-preview-head > span { border:1px solid var(--line); border-radius:999px; color:var(--muted); padding:6px 9px; font-size:8px; }
.ai-agent-direction { margin:0 0 10px; padding:10px 12px; border:1px solid #34343d; border-radius:10px; background:#151519; color:#b8b8c0; font-size:9px; line-height:1.55; }
.ai-agent-trace { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 12px; }
.ai-agent-trace span { padding:5px 8px; border:1px solid #3a3a43; border-radius:999px; color:#9a9aa4; font-size:7px; font-weight:850; letter-spacing:.04em; }
.ai-agent-trace .is-passed { color:var(--green); border-color:rgba(108,229,154,.28); }
.ai-agent-trace .is-fallback,.ai-agent-trace .is-warning { color:#ffd34f; border-color:rgba(255,211,79,.28); }
.ai-block-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.ai-block { border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#151519; }
.ai-block > header { display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; padding:10px; border-bottom:1px solid var(--line); }
.ai-block > header span { color:var(--accent); font-size:8px; font-weight:900; }
.ai-block > header b { font-size:9px; }
.ai-block > header em { color:var(--muted); font-size:7px; font-style:normal; }
.ai-phrase { display:grid; grid-template-columns:38px 1fr auto; gap:8px; align-items:center; padding:9px 10px; border-bottom:1px solid #24242a; }
.ai-phrase:last-child { border-bottom:0; }
.ai-phrase > span { color:var(--muted); font-size:8px; }
.ai-phrase b,.ai-phrase small { display:block; }
.ai-phrase b { font-size:9px; }
.ai-phrase small { color:#85858e; font-size:7px; margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:190px; }
.ai-phrase em { color:var(--green); font-size:7px; font-style:normal; }
.ai-footer { min-height:60px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 16px; }
.ai-footer span { color:var(--muted); font-size:8px; }
.ai-footer button:disabled { opacity:.35; cursor:not-allowed; }

.settings-drawer { position: fixed; top: 68px; right: 0; bottom: 0; width: min(360px, 100vw); background: #17171b; border-left: 1px solid var(--line); z-index: 50; padding: 22px; overflow-y: auto; box-shadow: -30px 0 70px rgba(0,0,0,.4); animation: drawerIn .25s ease both; }
@keyframes drawerIn { from { transform: translateX(100%); } }
.settings-drawer header { display: flex; align-items: start; justify-content: space-between; }
.settings-drawer h2 { margin: 0; }
.settings-drawer section { border-top: 1px solid var(--line); padding-top: 18px; margin-top: 22px; }
.drawer-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.drawer-actions button, .drawer-button { border: 1px solid var(--line); background: var(--surface-3); padding: 10px; border-radius: 10px; cursor: pointer; font-size: 10px; }
.drawer-button { width: 100%; margin-bottom: 8px; }
.drawer-label { color: var(--muted); letter-spacing: .12em; font-size: 9px; font-weight: 900; }
.segmented { display: grid; grid-template-columns: repeat(3, 1fr); background: #0e0e11; border-radius: 10px; padding: 4px; }
.segmented button { border: 0; background: transparent; color: var(--muted); padding: 9px 5px; border-radius: 8px; font-size: 9px; cursor: pointer; }
.segmented button.active { background: var(--accent); color: white; }
.toggle-row { display: flex; align-items: center; justify-content: space-between; font-size: 11px; padding: 11px 0; }
.toggle-row input { position: absolute; opacity: 0; }
.toggle-row span { width: 42px; height: 24px; border-radius: 999px; background: #3b3b42; position: relative; transition: background .2s; }
.toggle-row span::after { content: ""; position: absolute; width: 18px; height: 18px; border-radius: 50%; background: white; top: 3px; left: 3px; transition: transform .2s; }
.toggle-row input:checked + span { background: var(--accent); }
.toggle-row input:checked + span::after { transform: translateX(18px); }
.dialog-body { padding: 20px; }
.dialog-body label { display: grid; gap: 7px; color: var(--muted); font-size: 10px; margin-bottom: 14px; }
.dialog-body input { background: var(--surface-3); color: var(--text); border: 1px solid #3b3b42; border-radius: 9px; padding: 11px; }
.dialog-footer { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 20px; border-top: 1px solid var(--line); }
.delete-action { width:100%; margin-top:18px; border:1px solid rgba(255,81,77,.25); background:rgba(255,81,77,.06); color:var(--accent); border-radius:10px; padding:11px 12px; display:flex; align-items:center; justify-content:space-between; text-align:left; cursor:pointer; }
.delete-action span { font-size:10px; font-weight:850; }
.delete-action small { color:#8d6668; font-size:8px; }
.delete-action:hover { border-color:var(--accent); background:rgba(255,81,77,.11); }
.danger-button { border:0; border-radius:10px; padding:10px 17px; cursor:pointer; font-weight:850; background:var(--accent); color:#fff; }
.delete-warning { display:grid; grid-template-columns:38px 1fr; gap:12px; align-items:start; }
.delete-warning > span { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; color:var(--accent); background:var(--accent-soft); font-weight:950; }
.delete-warning b { display:block; font-size:12px; margin:2px 0 6px; }
.delete-warning p { margin:0; color:var(--muted); font-size:10px; line-height:1.5; }
.crew-editor-summary { display:flex; align-items:center; justify-content:space-between; margin:20px 0 8px; padding-top:16px; border-top:1px solid var(--line); }
.crew-editor-summary span { color:var(--muted); font-size:8px; font-weight:850; letter-spacing:.1em; }
.crew-editor-summary b { min-width:24px; height:24px; border-radius:999px; display:grid; place-items:center; background:var(--surface-3); font-size:9px; }
.crew-member-list { display:grid; gap:7px; max-height:330px; overflow-y:auto; padding-right:3px; }
.crew-member-row { display:grid; grid-template-columns:30px minmax(0,1fr) minmax(0,.85fr) 28px; gap:7px; align-items:end; padding:9px; border:1px solid var(--line); border-radius:10px; background:#111115; }
.crew-member-row > input[type="color"] { width:28px; height:31px; padding:2px; border-radius:8px; align-self:end; }
.crew-member-row label { gap:4px; }
.crew-member-row label span { color:#71717b; font-size:7px; text-transform:uppercase; letter-spacing:.08em; }
.crew-member-row label input { width:100%; padding:7px 8px; font-size:9px; }
.crew-member-row > button { width:28px; height:31px; border:0; border-radius:8px; background:transparent; color:#777780; cursor:pointer; }
.crew-member-row > button:hover { color:var(--accent); background:var(--accent-soft); }
.crew-add-member { width:100%; margin-top:9px; border:1px dashed #45454f; background:transparent; color:#b7b7be; border-radius:10px; padding:10px; font-size:9px; font-weight:800; cursor:pointer; }
.crew-add-member:hover { border-color:#777782; color:var(--text); }
.crew-empty { margin:0; padding:20px; border:1px dashed var(--line); border-radius:10px; color:var(--muted); font-size:9px; text-align:center; line-height:1.6; }
.folder-project-list { display:grid; gap:7px; max-height:290px; overflow-y:auto; }
.folder-project-row { display:grid !important; grid-template-columns:18px 1fr; gap:10px !important; align-items:center; padding:10px; border:1px solid var(--line); border-radius:10px; background:#111115; cursor:pointer; }
.folder-project-row input { width:15px; height:15px; margin:0; accent-color:var(--accent); }
.folder-project-row b,.folder-project-row small { display:block; }
.folder-project-row b { color:var(--text); font-size:10px; }
.folder-project-row small { color:var(--muted); font-size:8px; margin-top:4px; }
.formation-manager-list { display:grid; gap:7px; max-height:330px; overflow-y:auto; }
.formation-manager-row { display:grid; grid-template-columns:24px minmax(0,1fr) 70px 28px 28px; gap:7px; align-items:end; padding:9px; border:1px solid var(--line); border-radius:10px; background:#111115; }
.formation-manager-row > span { color:var(--accent); font-size:8px; font-weight:900; align-self:center; }
.formation-manager-row label { gap:4px; }
.formation-manager-row label span { color:#71717b; font-size:7px; text-transform:uppercase; letter-spacing:.08em; }
.formation-manager-row input { width:100%; padding:7px 8px; font-size:9px; }
.formation-manager-row > button { width:28px; height:31px; border:0; border-radius:8px; background:var(--surface-3); color:#a4a4ad; cursor:pointer; }
.formation-manager-row > button:last-child:hover { color:var(--accent); background:var(--accent-soft); }
.share-add-row { display:grid; grid-template-columns:1fr 70px; gap:7px; }
.share-add-row input { width:100%; }
.share-add-row button { border:0; border-radius:9px; background:var(--surface-3); color:var(--text); font-size:9px; font-weight:850; cursor:pointer; }
.share-people-list { display:grid; gap:6px; max-height:220px; overflow-y:auto; margin-bottom:16px; }
.share-person-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 10px; border:1px solid var(--line); border-radius:9px; background:#111115; }
.share-person-row span { color:#c9c9cf; font-size:9px; overflow:hidden; text-overflow:ellipsis; }
.share-person-row button { width:25px; height:25px; border:0; border-radius:7px; background:transparent; color:#777780; cursor:pointer; }
.share-person-row button:hover { color:#fff; background:var(--accent); }
.toast-region { position: fixed; top: 82px; left: 50%; transform: translateX(-50%); z-index: 100; display: grid; gap: 8px; }
.toast { background: var(--green); color: #071209; border-radius: 10px; padding: 10px 16px; font-size: 10px; font-weight: 850; animation: toastIn .2s ease both; box-shadow: 0 12px 34px rgba(0,0,0,.35); }
@keyframes toastIn { from { opacity: 0; transform: translateY(-8px); } }

.main-menu { position:fixed; inset:0 auto 0 0; width:min(340px,88vw); background:#151519; border-right:1px solid var(--line); z-index:80; padding:22px; box-shadow:30px 0 80px rgba(0,0,0,.55); animation:menuIn .24s ease both; }
@keyframes menuIn { from { transform:translateX(-100%); } }
.main-menu header { display:flex; justify-content:space-between; align-items:center; }
.profile-block { margin:32px 0 24px; padding:16px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:12px; }
.profile-block > span { width:40px; height:40px; border-radius:50%; background:var(--accent); display:grid; place-items:center; font-weight:900; }
.profile-block b,.profile-block small { display:block; }
.profile-block b { font-size:12px; }
.profile-block small { color:var(--muted); font-size:9px; margin-top:4px; }
.main-menu nav { display:grid; gap:4px; }
.main-menu nav button { border:0; background:transparent; text-align:left; padding:12px; border-radius:9px; cursor:pointer; color:#c8c8ce; }
.main-menu nav button:hover { background:var(--surface-3); color:white; }
.main-menu hr { width:100%; border:0; border-top:1px solid var(--line); margin:10px 0; }
.main-menu footer { position:absolute; left:22px; right:22px; bottom:20px; display:flex; justify-content:space-between; color:#5f5f68; font-size:9px; }

@media (max-width: 980px) {
  .review-workspace { grid-template-columns:240px 1fr; }
  .review-decision { grid-column:1 / -1; border-left:0; border-top:1px solid var(--line); max-height:none; }
  .editor-layout { grid-template-columns: 62px 1fr; }
  .inspector { display: none; }
  .audio-strip { right: 0; left: 63px; }
}
@media (max-width: 680px) {
  .onboarding-view { grid-template-columns:1fr; }
  .onboarding-visual { min-height:45svh; }
  .onboarding-content { min-height:55svh; padding:28px; }
  .onboarding-brand { top:22px; }
  .onboarding-content h1 { font-size:42px; }
  .auth-view { grid-template-columns:1fr; }
  .auth-stage { display:none; }
  .auth-panel { min-height:100svh; padding:28px; }
  .auth-brand { margin-bottom:40px; }
  .global-header { padding: 0 14px; }
  .library-shell { width: calc(100% - 28px); padding-top: 34px; }
  .review-shell { width:calc(100% - 28px); padding-top:30px; }
  .review-heading { align-items:start; }
  .review-sync-note { display:none; }
  .review-metrics { grid-template-columns:1fr 1fr; }
  .review-metrics article:nth-child(2) { border-right:0; }
  .review-metrics article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .review-filters { grid-template-columns:1fr 1fr; }
  .review-workspace { display:block; }
  .review-list-panel { border-right:0; border-bottom:1px solid var(--line); }
  .review-list { max-height:280px; }
  .review-detail,.review-decision { max-height:none; }
  .project-grid { grid-template-columns: 1fr 1fr; }
  .bottom-nav { bottom: 12px; width: calc(100% - 94px); }
  .bottom-nav button { min-width: 0; flex: 1; }
  .floating-add { right: 14px; bottom: 18px; width: 56px; height: 56px; }
  .editor-header { height: 58px; }
  .editor-actions .icon-button:nth-child(-n+2) { display: none; }
  .project-identity span { display: none; }
  .editor-layout { height: calc(100svh - 58px); grid-template-columns: 1fr; }
  .left-rail { position: fixed; z-index: 15; bottom: 10px; left: 10px; right: 10px; border: 1px solid var(--line); background: rgba(20,20,24,.94); border-radius: 16px; flex-direction: row; padding: 6px; justify-content: space-around; backdrop-filter: blur(15px); }
  .rail-button { width: 62px; height: 48px; }
  .stage-column { padding: 10px; padding-bottom: 66px; }
  .stage-toolbar { height: 45px; }
  .stage-readout { display: none; }
  .stage-frame { min-height: 300px; }
  #formationStage { min-height: 300px; }
  .timeline-wrap { height: 120px; }
  .creation-layout { grid-template-columns: 1fr; }
  .creation-controls { border-left: 0; border-top: 1px solid var(--line); }
  .mini-stage { height: 260px; }
  .large-sheet { max-height: 92svh; overflow-y: auto; }
  .ai-sheet { overflow-y:auto; }
  .ai-sheet form { max-height:none; }
  .ai-builder { grid-template-columns:1fr; overflow:visible; }
  .ai-brief { border-right:0; border-bottom:1px solid var(--line); }
  .ai-preview { min-height:420px; }
  .ai-block-list { grid-template-columns:1fr; }
}
@media (max-width: 480px) {
  .review-header-actions .secondary-button { display:none; }
  .review-filters { grid-template-columns:1fr; }
  .review-facts { grid-template-columns:1fr 1fr; }
  .project-grid { grid-template-columns: 1fr; }
  .header-actions .icon-button { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
.cloud-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 999px;
  color: #a8a8ad;
  background: rgba(255, 255, 255, .04);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
}
.cloud-status.is-syncing { color: #ffd34f; }
.cloud-status.is-synced { color: #6ce59a; }
.cloud-status.is-local { color: #a8a8ad; }