*{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:transparent}
:root{--bg:#0a0d13;--panel:#0c1119;--panel2:#111826;--line:#1b2434;--ink:#e6edf7;--mut:#6b7f9c;--amber:#ffd54f;--green:#5fd98a;--blue:#2f7fd1;--danger:#ff6b6b}
html,body{height:100%;background:var(--bg);color:var(--ink);font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.48;cursor:default}
#app{height:100dvh;max-width:760px;margin:auto;display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}
header{padding:calc(9px + env(safe-area-inset-top)) 16px 9px;border-bottom:1px solid var(--line);background:linear-gradient(var(--panel2),var(--panel))}
.brand{display:flex;align-items:center;gap:10px}.logo{width:34px;height:34px;border-radius:9px;flex:none;background:linear-gradient(135deg,var(--amber),#e8a317);color:#1a1200;font-weight:900;font-size:15px;display:flex;align-items:center;justify-content:center}.logo.large{width:50px;height:50px;border-radius:14px;margin:0 auto 12px;font-size:20px}
.brand-copy{min-width:0;flex:1}.title{font-size:15.5px;font-weight:800;letter-spacing:.3px;white-space:nowrap}.title button{border:1px solid #34445c;background:#151e2d;color:#8fa3c0;border-radius:6px;font-size:9px;font-weight:800;padding:2px 5px;vertical-align:2px}.sub{font-size:11px;color:var(--mut);display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dot{width:7px;height:7px;border-radius:50%;background:#64748b;flex:none}.dot.on{background:#3ddc84;box-shadow:0 0 8px #3ddc84}.plain-btn{border:0;background:transparent;color:#8fa3c0;font-size:19px;padding:6px}
.machine-strip{display:flex;gap:7px;margin-top:8px;overflow:hidden}.machine-strip span{flex:1;min-width:0;border:1px solid #202d40;background:#0d1420;border-radius:7px;padding:4px 7px;color:#61748f;font-size:8.5px;font-weight:900;letter-spacing:.5px;white-space:nowrap;text-align:center}.machine-strip b{color:#b8c7db;font-size:10px;margin-left:2px}
.tabs{display:flex;border-bottom:1px solid var(--line);background:var(--panel)}.tab{flex:1;border:0;background:transparent;color:var(--mut);padding:11px 0 10px;font-size:12px;font-weight:800;letter-spacing:.5px}.tab.on{color:var(--amber);box-shadow:inset 0 -2px 0 var(--amber)}
main{min-height:0;flex:1;position:relative}.view{display:none;height:100%;overflow:auto;overscroll-behavior:contain}.view.on{display:block}.thread{min-height:100%;padding:13px 14px 18px;display:flex;flex-direction:column;gap:11px}.welcome{margin:auto 12px;background:#0f1724;border:1px solid #223047;border-radius:13px;color:#7d91af;padding:15px;font-size:13px;line-height:1.6}.welcome b{display:block;color:#d8e3f2;font-size:14px;margin-bottom:3px}
.row{display:flex}.row.me{justify-content:flex-end}.bubble-wrap{max-width:88%}.bubble{padding:9px 12px;border-radius:15px;font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere}.me .bubble{background:linear-gradient(135deg,var(--blue),#2569b0);border-bottom-right-radius:5px}.who{font-size:10px;font-weight:900;letter-spacing:.8px;margin:0 0 3px 3px}.cl .who{color:var(--amber)}.cd .who{color:var(--green)}.cl .bubble{background:#161f2e;border:1px solid #2a3648;border-bottom-left-radius:5px}.cd .bubble{background:#151d18;border:1px solid #26402c;border-bottom-left-radius:5px}.phase{color:#64748b;font-size:9px;margin-left:5px}.bubble.waiting::after{content:"";display:inline-block;width:5px;height:5px;background:currentColor;border-radius:50%;margin-left:6px;animation:pulse 1s infinite alternate}.bubble.error{border-color:#6f2c34;color:#ffb5b5}@keyframes pulse{to{opacity:.2}}
.section-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:11px 15px 7px;background:rgba(10,13,19,.96);color:#61748f;font-size:10.5px;font-weight:900;letter-spacing:1.1px}.text-btn{border:0;background:transparent;color:#7fd4ff;font-size:10px;font-weight:900}.item-list{padding-bottom:18px}.item{display:flex;gap:10px;padding:11px 15px;border-bottom:1px solid #141c29;align-items:flex-start}.item-icon{width:29px;height:29px;border-radius:8px;flex:none;display:flex;align-items:center;justify-content:center;font-size:13px;background:#17202f}.item-copy{min-width:0;flex:1}.item-copy b{display:block;font-size:13.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item-copy span{display:block;font-size:11.5px;color:var(--mut);margin-top:2px;overflow-wrap:anywhere}.item-copy code{display:block;color:#7fd4ff;font:10px/1.4 ui-monospace,Menlo,monospace;margin-top:5px;overflow-wrap:anywhere}.badge{font-size:9px;padding:2px 7px;border-radius:10px;background:#1d2a3d;color:#7fd4ff;align-self:center;text-transform:uppercase}.empty{padding:28px 18px;text-align:center;color:#61748f;font-size:13px}
.search-box{position:sticky;top:0;z-index:2;margin:11px 14px 5px;background:#141d2c;border:1px solid #24314a;border-radius:11px;display:flex;align-items:center;padding-left:12px;box-shadow:0 7px 15px var(--bg)}.search-box span{color:#7fd4ff;font-size:19px}.search-box input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--ink);padding:11px 9px}.search-box button{align-self:stretch;border:0;border-left:1px solid #24314a;background:transparent;color:var(--amber);font-size:10px;font-weight:900;padding:0 11px}.search-meta{padding:4px 15px 8px;color:#61748f;font-size:11px}
.composer{border-top:1px solid var(--line);padding:7px 11px calc(10px + env(safe-area-inset-bottom));background:var(--panel)}.seat-picker{display:flex;width:max-content;margin:0 0 6px 3px;border:1px solid #24314a;border-radius:8px;overflow:hidden}.seat-picker button{border:0;border-right:1px solid #24314a;background:#101825;color:#60748f;padding:4px 10px;font-size:9px;font-weight:900;letter-spacing:.5px}.seat-picker button:last-child{border:0}.seat-picker button[data-who=claude].on{color:#211900;background:var(--amber)}.seat-picker button[data-who=cody].on{color:#071b0f;background:var(--green)}.seat-picker button[data-who=both].on{color:#fff;background:#2f4f7b}.compose-row{display:flex;gap:7px;align-items:flex-end}.compose-row textarea{flex:1;max-height:116px;resize:none;overflow:auto;border:1px solid #24314a;outline:0;background:#141d2c;border-radius:20px;padding:9px 14px;color:var(--ink);line-height:1.35}.round{width:39px;height:39px;border-radius:50%;flex:none;border:0;display:flex;align-items:center;justify-content:center;font-size:17px}.mic{background:#141d2c;border:1px solid #24314a}.mic.on{box-shadow:0 0 0 2px #c23b43;background:#5e2027}.send{background:linear-gradient(135deg,var(--amber),#e8a317);color:#1a1200;font-weight:900}.send.stop{background:#7c2630;color:#fff}
.modal{position:fixed;z-index:20;inset:0;background:rgba(3,6,10,.88);display:flex;align-items:center;justify-content:center;padding:20px}.modal[hidden]{display:none}.modal-card{width:min(390px,100%);background:#111927;border:1px solid #2a3850;border-radius:18px;padding:22px;text-align:center;box-shadow:0 20px 70px #000}.modal-card h1{font-size:18px}.modal-card p{color:#8295b0;font-size:12.5px;line-height:1.6;margin:8px 0 15px}.modal-card code{color:#7fd4ff;overflow-wrap:anywhere}.modal-card input{width:100%;border:1px solid #34445c;outline:0;background:#0b111b;color:#fff;border-radius:10px;padding:12px}.connect{width:100%;border:0;border-radius:10px;background:linear-gradient(135deg,var(--amber),#e8a317);color:#211900;font-weight:900;padding:12px;margin-top:10px}.cancel{border:0;background:transparent;color:#7589a6;padding:10px}.error{min-height:17px;color:#ff8585;font-size:11px;margin-top:5px}
@media(min-width:600px){#app{border-left:1px solid var(--line);border-right:1px solid var(--line)}.thread{padding-left:22px;padding-right:22px}.bubble-wrap{max-width:76%}}