/* ========================================================================== WeMind web — terminal / pixel theme (matches the Unity app's warm-dark look) Tokens taken from AgoraTheme.cs. Themes switch via [data-theme] on . ========================================================================== */ :root{ --bg:#14120F; --surface:#25211D; --panel:#1D1A17; --card:#28241F; --btn:#34302A; --accent:#DEA147; --line:#52493C; --text:#E6DECC; --dim:#948A78; --bright:#F7F2E6; --userbubble:#3D3830; --green:#79cf72; --purple:#b98be6; --rose:#d47a52; --amber:#DEA147; --navh:64px; } body[data-theme="mid"]{ --bg:#12141f;--surface:#1f2233;--panel:#191b29;--card:#232639;--btn:#2e334c;--accent:#facb5c;--line:#4c547a;--text:#e2e6f7;--dim:#8c93b3;--bright:#f5f7ff;--userbubble:#333857;--green:#7fd0a0;--purple:#a9b4ff;--rose:#e08a6a; } body[data-theme="forest"]{ --bg:#0f1a12;--surface:#1a291d;--panel:#16231b;--card:#1f2e22;--btn:#293e2e;--accent:#f2b347;--line:#476651;--text:#e3f0dd;--dim:#8ba386;--bright:#f5fceF;--userbubble:#2e452f;--green:#7ed47f;--purple:#c39be0;--rose:#df9a5c; } body[data-theme="rose"]{ --bg:#1e1418;--surface:#31232a;--panel:#291c22;--card:#38262e;--btn:#4c333f;--accent:#db7480;--line:#704c5c;--text:#f5e6ec;--dim:#ae8f9c;--bright:#fff2f7;--userbubble:#52343f;--green:#8fce8f;--purple:#c79be6;--rose:#e0708a; } body[data-theme="paper"]{ --bg:#fbfbf9;--surface:#ffffff;--panel:#f7f7f6;--card:#ffffff;--btn:#e6e6e2;--accent:#1a1a1a;--line:#8c8c88;--text:#161616;--dim:#575757;--bright:#000;--userbubble:#e6e6e2;--green:#2f9e44;--purple:#7048c0;--rose:#c0553a; } *{box-sizing:border-box;-webkit-tap-highlight-color:transparent} html,body{margin:0;background:var(--bg);color:var(--text)} body{font-family:"Atkinson Hyperlegible",system-ui,-apple-system,Arial,sans-serif; line-height:1.55;letter-spacing:.2px;overscroll-behavior:none} #app{max-width:720px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column; padding-bottom:var(--navh)} a{color:var(--accent)} .mono,.k,.htitle,.statusbar,.sub,.mode span,.pill,.nav,.tk{font-family:"Silkscreen","Courier New",monospace} /* ---- status ticker ---- */ .statusbar{position:sticky;top:0;z-index:20;background:var(--bg); border-bottom:1px solid var(--line);padding:9px 14px;font-size:10px;letter-spacing:1px; color:var(--green);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:8px;vertical-align:1px} .dot.on{box-shadow:0 0 8px var(--green)} /* ---- screens ---- */ #screens{flex:1;padding:14px 14px 24px} .scr-head{display:flex;align-items:center;gap:9px;margin:4px 0 14px} .hicon{color:var(--accent);font-size:16px} .htitle{font-size:13px;letter-spacing:2px;color:var(--bright);text-transform:uppercase;flex:0 0 auto} .scr-head .newbtn,.scr-head .hint{margin-left:auto} .hint{color:var(--dim);font-size:11px;font-family:"Silkscreen",monospace;letter-spacing:.5px} .card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:15px;margin:0 0 14px} .sub{font-family:"Silkscreen",monospace;font-size:10px;letter-spacing:2px;color:var(--dim); text-transform:uppercase;margin:16px 2px 8px} label.k,.k{display:block;font-family:"Silkscreen",monospace;font-size:10px;letter-spacing:1.5px; color:var(--dim);text-transform:uppercase;margin:0 0 6px} input,textarea,select{width:100%;background:color-mix(in srgb,var(--bg) 70%,#000);color:var(--text); border:1px solid var(--line);border-radius:11px;padding:12px;font:inherit;line-height:1.5} textarea.q{min-height:80px;resize:vertical} select{width:auto;min-width:150px} input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent)} .row{display:flex;gap:9px;align-items:center;flex-wrap:wrap} .cta-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:4px} .muted{color:var(--dim);font-size:13px} .who{font-size:13px;color:var(--dim)} .who b{color:var(--accent)} .err{color:var(--rose);font-size:14px;min-height:18px;margin-top:8px} /* ---- buttons ---- */ .btn{cursor:pointer;border:1px solid var(--line);border-radius:12px;padding:13px 16px;font:inherit; font-weight:700;background:var(--btn);color:var(--text)} .btn.big{width:100%;font-size:16px} .btn.gold{background:linear-gradient(180deg,#f0bd63,var(--accent));color:#241704;border-color:#f0bd63; font-family:"Silkscreen",monospace;letter-spacing:1px;box-shadow:0 0 18px rgba(222,161,71,.28)} .btn.gold:disabled{opacity:.45;cursor:default;box-shadow:none} .btn.ghost{background:transparent;color:var(--accent)} .chip{cursor:pointer;background:var(--btn);border:1px solid var(--line);border-radius:10px; padding:7px 12px;font-family:"Silkscreen",monospace;font-size:10px;letter-spacing:1px;color:var(--text)} /* ---- mode tabs ---- */ .modes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px} .mode{cursor:pointer;background:var(--panel);border:1px solid var(--line);border-radius:12px; padding:10px 6px;text-align:center;color:var(--text)} .mode b{display:block;font-size:14px;color:var(--bright)} .mode span{display:block;font-size:9px;letter-spacing:.5px;color:var(--dim);margin-top:3px} .mode.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--panel))} /* ---- the council table ---- */ .table-card{padding:8px 8px 10px} .table-wrap{position:relative} .seatlabel{font-family:"Silkscreen",monospace;font-size:9px;letter-spacing:1px} /* ---- suggested chips ---- */ .suggests{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px} .suggest{cursor:pointer;background:var(--panel);border:1px solid var(--line);border-radius:20px; padding:8px 14px;font-size:14px;color:var(--text)} /* ---- brain row ---- */ .brainrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:12px 0} .pill{cursor:pointer;background:var(--panel);border:1px solid var(--line);border-radius:20px; padding:8px 14px;font-size:11px;letter-spacing:1px;color:var(--text)} .pill.on{border-color:var(--purple);background:color-mix(in srgb,var(--purple) 20%,var(--panel));color:var(--bright)} .pill:disabled{opacity:.4;cursor:default} .pill .pdot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--purple);vertical-align:1px;margin-right:3px} .brainrow .k{margin:0} /* ---- verdict / transcript ---- */ .bubble.user{background:var(--userbubble);border-radius:16px 16px 4px 16px;padding:12px 15px; margin:14px 0 14px auto;max-width:82%;width:fit-content} .board{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 14px; display:flex;align-items:center;gap:12px;margin:12px 0} .board .avs{display:flex;gap:6px} .board .status{font-family:"Silkscreen",monospace;font-size:10px;letter-spacing:1px;color:var(--green)} .board .split{margin-left:auto;display:flex;align-items:center;gap:8px;font-family:"Silkscreen",monospace;font-size:11px} .splitbar{display:flex;gap:2px} .splitbar i{width:16px;height:9px;border-radius:2px;display:block} .verdictcard{background:var(--card);border:1px solid var(--accent);border-radius:16px;padding:16px; box-shadow:0 0 22px rgba(222,161,71,.12)} .vline{margin:0 0 11px} .vk{font-family:"Silkscreen",monospace;font-size:10px;letter-spacing:1.5px;display:block;margin-bottom:3px} .vv{font-size:16px;color:var(--text)} .vk.bottom{color:var(--accent)} .vline.bottom .vv{font-size:19px;color:var(--bright);font-weight:700} .vk.because{color:var(--green)} .vk.split{color:var(--purple)} .vk.watch{color:var(--rose)} .vk.next{color:var(--accent)} .vsources{border-top:1px dashed var(--line);margin-top:12px;padding-top:9px;display:flex; justify-content:space-between;font-family:"Silkscreen",monospace;font-size:10px;color:var(--dim)} .vsources .live{color:var(--green)} .verdict-actions{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:9px;margin-top:12px} /* ---- lists (rooms / dms / notes) ---- */ .list{display:flex;flex-direction:column;gap:9px} .item{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:12px 14px; display:flex;align-items:center;gap:10px} .item .grow{flex:1;min-width:0} .item .t{color:var(--bright);font-weight:700} .item .m{color:var(--dim);font-size:12px;font-family:"Silkscreen",monospace;letter-spacing:.5px} .item .livedot{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 7px var(--green)} .item .livedot.off{background:var(--dim);box-shadow:none} .empty{color:var(--dim);font-size:13px;padding:8px 2px} /* ---- room open view ---- */ .roomfeed{display:flex;flex-direction:column;gap:8px;margin:10px 0} .post{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 13px} .post .who{font-family:"Silkscreen",monospace;font-size:10px;color:var(--accent);letter-spacing:1px} .post.q{border-color:var(--accent)} /* ---- settings ---- */ .setrow{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px dashed var(--line)} .setrow:last-child{border-bottom:0} .setrow span:first-child{flex:1} input[type=range]{width:150px;accent-color:var(--accent)} .proline{margin-top:12px;font-family:"Silkscreen",monospace;font-size:11px;letter-spacing:1px} .proline.pro{color:var(--accent)} .proline.free{color:var(--dim)} /* ---- bottom nav ---- */ .bottomnav{position:fixed;bottom:0;left:0;right:0;height:var(--navh);z-index:30; max-width:720px;margin:0 auto;background:color-mix(in srgb,var(--bg) 92%,#000); border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr); align-items:center;padding:0 8px;gap:6px;backdrop-filter:blur(8px)} .nav{cursor:pointer;background:transparent;border:1px solid transparent;border-radius:11px; padding:9px 4px;color:var(--dim);font-size:12px;letter-spacing:1px} .nav.on{color:var(--accent)} .nav.center{color:var(--text)} .nav.center.on{background:color-mix(in srgb,var(--accent) 16%,transparent);border-color:var(--line);color:var(--accent)} .spin{display:inline-block;width:15px;height:15px;border:2px solid var(--line); border-top-color:var(--accent);border-radius:50%;animation:sp 1s linear infinite;vertical-align:-2px} @keyframes sp{to{transform:rotate(360deg)}} /* ---- beta gate overlay ---- */ .gate{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:24px} .gatebox{max-width:340px;width:100%;text-align:center;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px} .gatebox .kick{color:var(--accent);font-family:"Silkscreen",monospace;font-size:11px;letter-spacing:2px;margin-top:8px} [hidden]{display:none !important}