/* The translucent surface pass: cards, buttons, dialogs, motion.
 * A later pass over the base layer — order matters, keep it loaded after the files above. */
body{background:radial-gradient(ellipse at 80% 0%,#dce8fa 0,transparent 45%),radial-gradient(ellipse at 20% 60%,#e7eddc 0,transparent 40%),#f1f4f9;background-attachment:fixed}
.side{background:#f4f6fadb;border-right:1px solid #ffffff;backdrop-filter:blur(28px) saturate(125%);-webkit-backdrop-filter:blur(28px) saturate(125%)}
.top{background:#ffffffb8;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-bottom:1px solid #ffffffb0}
.content{padding-top:40px}
.page-head h1{font-weight:650;letter-spacing:-.055em}
.eyebrow{font-weight:600;letter-spacing:.13em}
.card{background:#ffffffb8;border:1px solid #fff;border-radius:22px;box-shadow:0 4px 20px #26395105,0 1px 3px #26395105;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.card h2,.card h3{font-weight:600}
.hero{background:linear-gradient(125deg,#24364bea,#263749f5 60%,#374b61eb);border:1px solid #ffffff55;box-shadow:0 14px 35px #253e5814,inset 0 1px #ffffff20;border-radius:26px;padding:36px}
.hero .eyebrow{color:#d2e8bd}
.hero h2{font-weight:600;letter-spacing:-.04em}
.hero p{color:#c5d2e1}
.btn{border-radius:12px;font-weight:550;font-size:.88rem;background:#2b405b;box-shadow:0 2px 5px #2035520b;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}
.btn.white{background:#ffffffab;border:1px solid #dce3ed;color:#41546d}
.btn.lime{background:#deedc8;color:#34482c}
.btn.ghost{box-shadow:none}
.btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 15px #233b5511}
.btn:active:not(:disabled){transform:translateY(0)}
.toggle{background:#dce4ef99;border:1px solid #ffffff90;border-radius:13px;gap:3px}
.toggle button{border-radius:9px;font-size:.86rem}
.toggle button.active{box-shadow:0 2px 6px #23334b12;background:#fff;color:#304f7d}
.tag{border-radius:7px;background:#e7edf5;color:#69788e;font-weight:500}
.tag.blue{background:#e5ecf8;color:#4d6894}
.tag.lime{background:#e1edcf;color:#4b6636}
.stat strong{font-weight:600;color:#304865}
input,textarea,select{border:1px solid #d9e1ec;background:#ffffffc9;border-radius:11px;box-shadow:inset 0 1px 2px #26394d03}
input:focus,textarea:focus,select:focus{border-color:#96b4de}
.filter button{background:#ffffff85;border-color:#e0e6ef;border-radius:10px;color:#65758a}
.filter button.active{background:#425d7c;color:#fff;border-color:#425d7c}
.scenario{transition:transform .22s ease,box-shadow .22s ease}
.scenario:hover{transform:translateY(-3px);box-shadow:0 12px 28px #3347630d}
.scenario.selected{border:1px solid #b5c9e2;padding:25px;box-shadow:0 0 0 3px #d3e1f22e}
.scenario h3{margin-top:18px}
.footer{opacity:.8}
.negotiation-table{background:linear-gradient(130deg,#2c4059ed,#385269e8);border:1px solid #ffffff65;box-shadow:0 12px 28px #2e425914,inset 0 1px #ffffff20;border-radius:25px}
.character-head,.avatar.character-head{border-color:#dcecc9;box-shadow:0 0 0 5px #ffffff0a}
.character-head.illustrated{border-color:#b8cce3}
.deal-metrics b{color:#e1edcf;font-size:1.9rem}
.deal-metrics .their-metric b{color:#cfdded}
.chat-log{background:linear-gradient(160deg,#f8fafdc9,#edf3fac0);border:1px solid #ffffff;border-radius:18px;padding:20px}
.chat-bubble{border-radius:17px;box-shadow:0 3px 10px #29456008}
.chat-bubble.them{background:#ffffffec;color:#36465d;border:1px solid #e1e8f2}
.chat-bubble.me{background:linear-gradient(135deg,#456588,#344f70);color:#fff}
.live-toolbar{gap:10px}
.live-toolbar .btn{font-size:.76rem;padding:9px 11px;min-height:38px}
.live-numbers>div{background:#ffffff9e;border:1px solid white;border-radius:15px}
.live-numbers strong{color:#405d7e}
.private-notes textarea{background:#fffef8b8}
.planning-options>div{background:#f5f8fcaa;border-color:#e0e7f0;border-radius:12px}
.note{background:#e7eef8b8;color:#526985;border:1px solid #f6faff;border-radius:15px}
.choice{background:#ffffff8c;border-color:#e0e6ef;border-radius:12px;transition:background .18s,border-color .18s}
.choice:has(input:checked){background:#e8f0fb;border-color:#8eacd1;color:#355b86}
.issue-number{background:#e6edf7;color:#5b7395}
.bar{background:#e3eaf3}
.bar i,.bar>span{background:linear-gradient(90deg,#9cb8d8,#638bb7);transition:width .35s ease}
dialog{background:#f8fafff5;backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);border:1px solid #fff;box-shadow:0 30px 100px #142c4a33;border-radius:22px}
dialog::backdrop{background:#24395045;backdrop-filter:blur(5px)}
.case-dialog-header{background:#f8fafff5;border-color:#e1e8f1}
.case-close{background:#edf2f9;border-color:#e0e7f0}
.tour-bubble{background:#fafffff5;border-color:#fff;border-radius:20px}
.tour-target{outline-color:#adc4df!important}
.live-icon{width:18px;height:18px;flex-shrink:0;vertical-align:middle}
.live-action-icon{display:inline-flex!important;align-items:center;justify-content:center;gap:9px}
.source-attachment{margin-top:15px;border-top:1px solid #e0e7f0;padding-top:15px}
.source-attachment p{font-size:.8rem!important;margin:6px 0!important}
.auth-panel{background:#ffffffbd}
.auth-story{background:linear-gradient(140deg,#273a53,#3c5367)}
@media(prefers-reduced-motion:no-preference){.content{animation:glass-enter .3s ease both}.chat-row:last-child{animation:glass-enter .22s ease both}@keyframes glass-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:760px){.card{border-radius:18px}.hero{padding:26px;border-radius:21px}.scenario.selected{padding:20px}.content{padding-top:26px}.top{flex-wrap:wrap}.top>.row{gap:8px}.top .btn{font-size:.74rem}.negotiation-table{padding:20px 16px}.live-toolbar{flex-wrap:wrap}.side{background:#f4f6faf5}}
:root,html,body{font-family:"Segoe UI Variable Text","Segoe UI",-apple-system,BlinkMacSystemFont,Arial,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,textarea,select{font-family:inherit}
h1,h2,h3,.brand-wordmark{font-family:"Segoe UI Variable Display","Segoe UI",-apple-system,BlinkMacSystemFont,Arial,sans-serif}
h1{font-weight:650;letter-spacing:-.045em;line-height:1.12}
h2{font-weight:600;letter-spacing:-.025em;line-height:1.25}
h3{font-weight:600;letter-spacing:-.01em}
p{font-size:.95rem;line-height:1.7}
.meta,small{font-size:.8rem;line-height:1.6}
.eyebrow{font-size:.68rem;font-weight:650;letter-spacing:.13em}
.btn{font-weight:600;letter-spacing:0}
.nav button{font-weight:500}