*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Nunito","Segoe UI",system-ui,sans-serif;color:#2d2a4a;
 background:linear-gradient(135deg,#fff6d6 0%,#ffe1ec 40%,#dff3ff 75%,#e3ffe9 100%);background-attachment:fixed}
.top{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;gap:10px}
.back{text-decoration:none;color:#fff;background:#7c5cff;padding:8px 14px;border-radius:999px;font-weight:700;box-shadow:0 4px 12px #7c5cff55}
.title{font-size:1.5rem;font-weight:800;text-align:center;background:linear-gradient(90deg,#ff7a59,#ff4fa3,#7c5cff);-webkit-background-clip:text;background-clip:text;color:transparent}
.title small{display:block;font-size:.75rem;color:#8a84a8;-webkit-text-fill-color:#8a84a8;font-weight:600}
.clock{background:#fff;padding:8px 14px;border-radius:999px;font-weight:700;box-shadow:0 4px 12px #0001}
.layout{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;padding:10px 20px 24px;max-width:1300px;margin:0 auto}
@media(max-width:900px){.layout{grid-template-columns:1fr}}
.room{background:#ffffffaa;border-radius:28px;padding:20px;box-shadow:0 10px 30px #7c5cff22;display:flex;flex-direction:column;align-items:center}
.table-wrap{position:relative;width:min(520px,82vw);aspect-ratio:1;margin-bottom:56px}
.table{position:absolute;inset:22%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffd98a,#ffb648 60%,#f39a2b);
 box-shadow:0 18px 0 #d9822088,0 24px 40px #f39a2b55,inset 0 -8px 20px #0001;display:grid;place-items:center;transition:box-shadow .3s}
.table-top{width:62%;aspect-ratio:1;border-radius:50%;background:#fff7e6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;box-shadow:inset 0 4px 12px #0001}
.logo{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:1.4rem;color:#fff;background:linear-gradient(135deg,#ff4fa3,#7c5cff)}
.state{font-size:.7rem;font-weight:800;letter-spacing:.1em;padding:3px 10px;border-radius:999px;background:#e9e6ff;color:#7c5cff}
.state.speaking{background:#ffe0ef;color:#ff4fa3}.state.listening{background:#dcfce7;color:#16a34a}.state.processing{background:#fff1c2;color:#c27c00}
.seat{position:absolute;inset:0;width:auto;height:auto;margin:0;text-align:center;pointer-events:none;
 transform:rotate(calc(var(--i) * 360deg / var(--n))); transform-origin:center center}
.seat .chair{pointer-events:auto; margin-top:2%; transform:rotate(calc(var(--i) * -360deg / var(--n)))}
.seat .label{pointer-events:auto; transform:rotate(calc(var(--i) * -360deg / var(--n)))}
.chair{width:64px;height:64px;margin:0 auto;border-radius:50%;display:grid;place-items:center;font-size:1.6rem;font-weight:800;transition:transform .2s}
.seat.open .chair{border:3px dashed #b9b2e0;background:#ffffffcc;color:#b9b2e0}
.seat.open:hover .chair{transform:rotate(calc(var(--i) * -360deg / var(--n))) scale(1.08);border-color:#7c5cff;color:#7c5cff}
.seat.ceo .chair{width:78px;height:78px;background:linear-gradient(135deg,#ff7a59,#ff4fa3);color:#fff;font-size:2rem;box-shadow:0 0 0 5px #fff,0 0 0 9px #ffcf3f,0 8px 20px #ff4fa366}
.label{margin-top:4px;line-height:1.1}.label b{display:block;font-size:.85rem}.label small{font-size:.68rem;color:#8a84a8}
.seat.ceo .label b{color:#ff4fa3;font-size:1rem}
body.speaking .seat.ceo .chair{animation:chairpulse .7s infinite alternate}
body.speaking .table{box-shadow:0 18px 0 #d9822088,0 0 60px #ff4fa388;animation:tableglow .7s infinite alternate}
body.listening .table{box-shadow:0 18px 0 #d9822088,0 0 60px #22c55e88}
@keyframes chairpulse{from{transform:rotate(calc(var(--i) * -360deg / var(--n))) scale(1)}to{transform:rotate(calc(var(--i) * -360deg / var(--n))) scale(1.06)}}
@keyframes tableglow{from{filter:brightness(1)}to{filter:brightness(1.08)}}
@keyframes pulse{from{transform:scale(1)}to{transform:scale(1.06)}}
.stats{margin-top:14px;font-size:.8rem;color:#6b6590;background:#fff;padding:8px 14px;border-radius:14px}
.chat{background:#fff;border-radius:28px;padding:16px;box-shadow:0 10px 30px #ff4fa322;display:flex;flex-direction:column;min-height:460px;max-height:80vh}
.chat-head{font-weight:800;margin-bottom:8px}
.transcript{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:6px}
.msg{padding:10px 14px;border-radius:18px;max-width:85%;line-height:1.35;white-space:pre-wrap}
.msg.user{align-self:flex-end;background:linear-gradient(135deg,#7c5cff,#5b8cff);color:#fff;border-bottom-right-radius:4px}
.msg.jarvis{align-self:flex-start;background:#fff3d6;border-bottom-left-radius:4px}
.inputbar{display:flex;gap:8px;margin-top:10px}
.inputbar input{flex:1;padding:12px 16px;border-radius:999px;border:2px solid #ece8ff;font-size:16px;outline:none}
.inputbar input:focus{border-color:#7c5cff}
.mic,.send{border:0;border-radius:999px;padding:0 16px;font-weight:800;cursor:pointer;font-size:1rem}
.mic{background:#22c55e;color:#fff;min-width:48px}.mic.on{background:#ef4444;animation:pulse .6s infinite alternate}
.send{background:#ff4fa3;color:#fff}
.opts{display:flex;justify-content:space-between;font-size:.8rem;color:#8a84a8;margin-top:8px;flex-wrap:wrap;gap:6px}
.needvoice{outline:3px solid #ffcf3f!important;outline-offset:2px}
.seat{cursor:pointer}
.seat.filled .chair{border:3px solid #22c1c3;background:linear-gradient(135deg,#e0fbff,#fff);color:#0e7490;box-shadow:0 6px 16px #22c1c355}
.seat.filled:nth-of-type(odd) .chair{border-color:#7c5cff;background:linear-gradient(135deg,#efe9ff,#fff);box-shadow:0 6px 16px #7c5cff44}
.seat.filled:hover .chair{transform:rotate(calc(var(--i) * -360deg / var(--n))) scale(1.08)}
.seat.filled .label b{color:#0e7490}
.state.thinking{background:#fff1c2;color:#c27c00;animation:think 1s ease-in-out infinite alternate}
@keyframes think{from{opacity:.55;transform:scale(.96)}to{opacity:1;transform:scale(1.04)}}

/* voice picker */
.opts{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:8px 10px;font-size:13px}
.opts label{display:inline-flex;align-items:center;gap:6px;min-height:40px}
.opts select{min-height:40px;max-width:100%;flex:1 1 180px;border-radius:12px;border:1px solid rgba(0,0,0,.15);padding:6px 10px;background:#fff;font:inherit}
.opts .sl input[type=range]{width:110px;min-height:32px;accent-color:#ff7a59}
.opts output{min-width:2.6em;font-variant-numeric:tabular-nums;opacity:.8}
.opts .preview{min-height:40px;padding:6px 14px;border:0;border-radius:20px;background:linear-gradient(135deg,#ff7a59,#ff4fa3);color:#fff;font:600 13px system-ui;cursor:pointer}
.opts #voiceinfo{flex-basis:100%;opacity:.7;font-size:12px}
@media (max-width:600px){.opts .sl{flex:1 1 45%}.opts .sl input[type=range]{flex:1;width:auto}}

@media(max-width:600px){.table-wrap{width:min(520px,88vw)}.seat .chair{width:52px;height:52px;font-size:1.25rem}.seat.ceo .chair{width:64px;height:64px;font-size:1.6rem}.seat .label small{font-size:.6rem}.seat .label b{font-size:.78rem}}
html,body{overflow-x:hidden}

/* v9: header, agenda strip, 8-seat fit, evening theme */
.hdr-r{display:flex;gap:8px;align-items:center}
.themebtn{border:0;background:#fff;border-radius:999px;width:42px;height:42px;font-size:1.2rem;cursor:pointer;box-shadow:0 4px 12px #0001}
.table-wrap{margin-bottom:70px}
.seat .chair{width:58px;height:58px}.seat.ceo .chair{width:72px;height:72px}
.label b{white-space:nowrap}.label small{display:block;max-width:110px;margin:0 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.agenda{width:100%;max-width:560px;background:#fff;border-radius:20px;padding:10px 12px;box-shadow:0 6px 18px #ff7a5922}
.agenda-head{font-weight:800;font-size:.85rem;margin-bottom:6px;color:#ff7a59}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}
.chip{flex:0 0 auto;max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:7px 12px;border-radius:999px;font-size:.8rem;font-weight:600}
.chip b{font-weight:800;margin-right:4px}
.chip.c0{background:#ffe0ef;color:#c2185b}.chip.c1{background:#e9e6ff;color:#5b3fd6}.chip.c2{background:#dcfce7;color:#15803d}.chip.c3{background:#fff1c2;color:#a16207}.chip.c4{background:#dff3ff;color:#0369a1}
.chip.empty,.chip.note{background:#f4f2ff;color:#8a84a8;border:2px dashed #d9d3f5}
@media(max-width:600px){.seat .chair{width:46px;height:46px;font-size:1.1rem}.seat.ceo .chair{width:58px;height:58px}.label small{max-width:80px}.seat .label b{font-size:.72rem}.table-wrap{width:min(520px,80vw);margin-top:10px}}
html.evening body{color:#ece8ff;background:linear-gradient(135deg,#2a2342 0%,#3b2a4f 40%,#1f3147 75%,#1f3a34 100%);background-attachment:fixed}
html.evening .room{background:#2f2848cc;box-shadow:0 10px 30px #00000055}
html.evening .chat,html.evening .agenda,html.evening .stats,html.evening .clock,html.evening .themebtn{background:#3a3158;color:#ece8ff}
html.evening .msg.jarvis{background:#4a3d5e;color:#fff3d6}
html.evening .table-top{background:#4a3d5e}
html.evening .label small,html.evening .title small{color:#bdb4e0;-webkit-text-fill-color:#bdb4e0}
html.evening .seat.open .chair{background:#3a3158cc}
html.evening .seat.filled .label b{color:#7ee7f0}
html.evening .inputbar input,html.evening .opts select{background:#2a2342;color:#ece8ff;border-color:#5a4d80}
html.evening .chip.c0{background:#5a2a48;color:#ffc2dd}html.evening .chip.c1{background:#3d3270;color:#d6ccff}html.evening .chip.c2{background:#1f4a35;color:#a7f3c4}html.evening .chip.c3{background:#5a4620;color:#ffe08a}html.evening .chip.c4{background:#1f3f5a;color:#b5e2ff}
html.evening .chip.empty,html.evening .chip.note{background:#2a2342;color:#bdb4e0;border-color:#5a4d80}
.layout>*{min-width:0}.agenda{max-width:100%}
@media(max-width:600px){.top{padding:10px 12px}.back{padding:6px 10px;font-size:.8rem}.title{font-size:1.1rem}.clock{padding:6px 10px;font-size:.8rem}.themebtn{width:36px;height:36px;font-size:1rem}.layout{padding:8px 10px 20px}.room{padding:14px 8px}.stats{font-size:.7rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
.inputbar input{min-width:0}
