*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--ground);color:var(--ink);font:14px/1.5 "JetBrains Mono",Consolas,"Courier New",monospace}body{background-image:radial-gradient(rgba(255,255,255,.035) 1px,transparent 1px),radial-gradient(circle at center,transparent 55%,rgba(0,0,0,.55));background-size:22px 22px,100% 100%;background-attachment:fixed}[hidden]{display:none!important}
button,select,input,textarea{font:inherit;background:var(--field);color:var(--ink);border:1px solid var(--line);border-radius:0;padding:9px 11px;transition:background 80ms,color 80ms,border-color 80ms}button{cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.12em}button:hover{background:var(--ink);border-color:var(--ink);color:var(--ground)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--secondary);outline-offset:2px}button:disabled{opacity:.4;cursor:not-allowed}.primary{background:var(--primary);border-color:var(--primary);color:var(--primary-ink);font-weight:800}.primary:hover{background:var(--ink);border-color:var(--ink);color:var(--ground)}.full{width:100%}.quiet{background:transparent;border-color:transparent;color:var(--dim)}.iconBtn{display:none;border:0;background:transparent;padding:7px}.secondary{background:transparent;border-color:var(--secondary)}
.center{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.card{background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--primary);padding:32px;display:flex;flex-direction:column;gap:12px;width:min(390px,100%)}.card h1{margin:0;font-size:34px;letter-spacing:-1px}.card label{display:flex;flex-direction:column;gap:6px;color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:.12em}.card input{width:100%;text-transform:none;letter-spacing:normal}.card button{margin-top:8px;padding:12px}.eyebrow,.label,.composerControl>span,.themeSwitch>span{font-size:10px;letter-spacing:.12em;font-weight:800;color:var(--dim);text-transform:uppercase}.loginIntro,.note,.purpose{color:var(--dim)}.loginIntro{margin:-5px 0 10px}.err{color:var(--danger)}
#topbar{min-height:60px;display:flex;gap:12px;align-items:center;padding:8px 24px;background:var(--panel);border-bottom:2px solid var(--primary);position:relative;z-index:4}.brand{font-size:16px;letter-spacing:.12em}.brandMark{color:var(--primary);margin-right:6px}#who{color:var(--dim);font-size:11px}#adminToggle{margin-left:auto}.appErr{margin:14px 28px;padding:10px 14px;border:1px solid var(--danger);background:var(--panel)}.themeSwitch{display:flex;align-items:center;gap:3px}.themeSwitch>span{margin-right:4px}.themeSwitch button{padding:5px 8px}.themeSwitch button.on{background:var(--primary);border-color:var(--primary);color:var(--primary-ink)}
#balances{display:flex;gap:8px;flex-wrap:wrap;padding:10px 28px;background:var(--panel);border-bottom:1px solid var(--line);font-size:12px;color:var(--dim)}#balances .b{border:1px solid var(--line);padding:3px 10px}#balances .b.err{color:var(--danger);border-color:var(--danger)}
#layout{display:flex;min-height:calc(100vh - 110px)}#side{width:286px;flex:none;background:var(--panel);border-right:1px solid var(--line);padding:24px 18px;display:flex;flex-direction:column;gap:22px}.sideHead{display:flex;flex-direction:column;gap:14px}.sideHead h2{font-size:18px;margin:1px 0 0}#chatList{list-style:none;margin:0;padding:0;overflow:auto;flex:1;min-height:100px;display:flex;flex-direction:column;gap:5px}#chatList li{display:flex;gap:4px;align-items:center;border:1px solid transparent;padding:8px 9px;color:var(--dim);cursor:pointer}#chatList li:hover{background:var(--field);color:var(--ink)}#chatList li.on{border-color:var(--primary);color:var(--ink)}#chatList li span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#chatList li button{padding:0 6px;background:transparent;border:0;color:var(--dim)}
#main{flex:1;min-width:0;display:flex;flex-direction:column;height:calc(100vh - 110px)}#chatBar{height:58px;flex:none;padding:0 28px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;background:var(--ground)}#chatTitle{font-weight:800;letter-spacing:.08em}#regenBtn{margin-left:auto}#messages{flex:1;overflow:auto;padding:30px 6%;display:flex;flex-direction:column;gap:16px}.msg{width:min(850px,88%);border:1px solid var(--line);background:var(--panel);padding:14px 16px}.msg.user{align-self:flex-end;border-right:3px solid var(--tertiary)}.msg.assistant{align-self:flex-start;border-left:3px solid var(--primary)}.msg.sys{align-self:center;color:var(--dim)}.meta{display:flex;gap:12px;color:var(--dim);font-size:10px;text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px}.meta span:last-child{margin-left:auto}.mult{color:var(--primary)}.body{overflow-wrap:anywhere}.body pre{overflow:auto;padding:14px;background:var(--ground);border:1px solid var(--line);border-left:3px solid var(--tertiary);color:var(--ink)}.body code{background:var(--ground);color:var(--code);padding:1px 4px}.body pre code{padding:0}.att{max-width:min(460px,100%);max-height:420px;border:1px solid var(--line);cursor:zoom-in}.imgPh{border:1px dashed var(--danger);padding:20px;color:var(--danger)}.acts{display:flex;gap:5px;margin-top:10px}.acts button{padding:4px 7px;font-size:10px}
#composer{flex:none;padding:12px 6% 18px;background:var(--panel);border-top:1px solid var(--line)}#input{width:100%;resize:vertical;min-height:74px;background:var(--ground)}#crow{display:flex;align-items:flex-end;gap:8px;margin-top:8px}.composerControl{display:flex;flex-direction:column;gap:4px}.composerControl select{max-width:310px}.composerControl button{min-width:88px}.help{display:inline-grid;place-items:center;width:16px;height:16px;border:1px solid var(--secondary);color:var(--secondary);cursor:help}#imgBtn,#audioBtn,#composerMode{background:transparent;border-color:var(--secondary);color:var(--secondary)}#imgBtn:hover,#audioBtn:hover,#composerMode:hover{background:var(--secondary);border-color:var(--secondary);color:var(--ground)}#imgBtn:disabled,#audioBtn:disabled{border-color:var(--line);color:var(--dim);background:transparent}#imgCount:before,#audioCount:before{content:"["}#imgCount:after,#audioCount:after{content:"]"}#sendBtn{margin-left:auto;height:39px}#previews{display:flex;gap:8px;flex-wrap:wrap}.pv{display:flex;align-items:center;gap:5px;border:1px solid var(--line);padding:5px}.pv img{width:52px;height:42px;object-fit:cover}.pv audio{max-width:240px}.pv button{padding:4px}
#adminPanel{overflow:auto;padding:26px 5%;background:var(--ground)}#adminPanel h2,.modal h2{display:flex;align-items:center;gap:12px;color:var(--primary);font-size:16px;letter-spacing:.12em;text-transform:uppercase;margin-top:28px}#adminPanel h2:after,.modal h2:after{content:"";height:1px;flex:1;background:var(--line)}.purpose{margin:0 0 9px}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.grow{flex:1}table{width:100%;border-collapse:collapse;margin:8px 0 15px}th,td{text-align:left;border-bottom:1px solid var(--line);padding:8px;font-size:12px}th,.fld{color:var(--dim)}th{text-transform:uppercase;letter-spacing:.12em}.fld{display:flex;flex-direction:column;gap:7px}.fld select{width:100%}#promptList,#settingPromptList{list-style:none;padding:0;margin:8px 0;min-width:200px}#promptList li,#settingPromptList li{padding:7px 9px;border:1px solid var(--line);cursor:pointer;margin-bottom:4px}#promptList li.on,#settingPromptList li.on{border-color:var(--primary);color:var(--primary)}
.overlay{position:fixed;inset:0;z-index:20;background:rgba(0,0,0,.82);display:flex;align-items:center;justify-content:center;padding:18px}.modal{width:min(620px,96vw);max-height:90vh;overflow:auto;background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--primary);padding:25px}.modal h2{margin-top:0}.ackText{white-space:pre-line;color:var(--ink)}#settingsModal{align-items:flex-start;overflow:auto}#settingsModal .modal{width:min(720px,94vw);max-height:none;margin:24px 0}.rateHeadline{color:var(--primary);font-size:12px;font-weight:800}.promptManager{border-top:1px solid var(--line);padding-top:10px}.promptManager input,.promptManager textarea{width:100%;margin-top:7px}.toast{background:var(--panel);border:1px solid var(--primary);padding:10px 14px;margin:8px;color:var(--ink)}#toasts{position:fixed;right:12px;top:70px;z-index:30}#lightbox{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.92);display:grid;place-items:center}#lightbox img{max-width:94vw;max-height:94vh}
@media(max-width:760px){body{background-image:radial-gradient(circle at center,transparent 60%,rgba(0,0,0,.5))}#topbar{padding:8px 12px;gap:6px;flex-wrap:wrap}.iconBtn{display:block}#who{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand{font-size:14px}.themeSwitch>span{display:none}#adminToggle{margin-left:auto}#balances{padding:8px 12px}#layout{min-height:calc(100vh - 100px)}#side{position:fixed;z-index:5;top:60px;bottom:0;left:0;width:min(300px,88vw);transform:translateX(-105%);transition:transform 80ms;padding:20px 16px}body.menuOpen #side{transform:translateX(0)}#mobileScrim{position:fixed;display:none;inset:60px 0 0;background:rgba(0,0,0,.55);z-index:4}body.menuOpen #mobileScrim{display:block}#main{width:100%;height:calc(100vh - 100px)}#messages{padding:16px 12px}.msg{width:96%}#composer{padding:10px 12px}#crow{align-items:stretch;flex-wrap:wrap}.composerControl:first-child{width:100%}.composerControl select{width:100%;max-width:none}#sendBtn{margin-left:auto}.card{padding:25px 20px}table{display:block;overflow:auto}}
.b.inf{border-color:var(--primary);display:inline-flex;align-items:center;gap:6px}
.infTxt{background:linear-gradient(90deg,var(--primary),var(--secondary),var(--tertiary),var(--primary));background-size:300%% 100%%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:infShimmer 3s linear infinite;font-weight:800;letter-spacing:.14em}
@keyframes infShimmer{0%%{background-position:0%% 50%%}100%%{background-position:300%% 50%%}}
/* ------------- v3 UX polish ------------- */
@media(min-width:761px){html{zoom:1.1}}
.tiny{padding:4px 8px;font-size:10px}
.chip{position:fixed;z-index:12;top:6px;left:12px;background:var(--panel);border:1px solid var(--secondary);color:var(--secondary);padding:4px 9px;font-size:10px}
#chipBal{top:6px;left:76px}
body.topHidden #topbar{display:none}
body.balHidden #balances{display:none}
body.topHidden #layout{min-height:calc(100vh - 50px)}
body.topHidden #main{height:calc(100vh - 50px)}
body.balHidden #layout{min-height:calc(100vh - 60px)}
body.balHidden #main{height:calc(100vh - 60px)}
body.topHidden.balHidden #layout{min-height:100vh}
body.topHidden.balHidden #main{height:100vh}
.stats{flex:none;padding:5px 6%;color:var(--dim);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--line);background:var(--ground)}
.stats:empty{display:none}
#balances .b.clickable{cursor:pointer}
#balances .b.clickable:hover{border-color:var(--secondary);color:var(--ink)}
#sendBtn.stop{background:var(--danger);border-color:var(--danger);color:#fff;animation:stopPulse 1.1s ease-in-out infinite}
@keyframes stopPulse{0%,100%{box-shadow:0 0 0 var(--danger)}50%{box-shadow:0 0 15px -2px var(--danger)}}
.msg{animation:msgIn .16s ease-out both}
@keyframes msgIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.msg.streaming .body:after{content:"\25AE";color:var(--secondary);animation:caret 1s steps(2,start) infinite;margin-left:2px}
@keyframes caret{50%{opacity:0}}
.modal{animation:popIn .15s ease-out both}
@keyframes popIn{from{opacity:0;transform:scale(.985) translateY(4px)}to{opacity:1;transform:none}}
#toasts .toast{animation:toastIn .18s ease-out both}
@keyframes toastIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
button:active{transform:translateY(1px)}
.primary{box-shadow:none}.primary:hover{box-shadow:0 0 14px -3px var(--primary)}
.poolModal table{margin-top:6px}
@media(max-width:760px){.chip{top:auto;bottom:12px;left:12px}#chipBal{bottom:auto;top:56px;left:12px}.stats{padding:4px 12px;font-size:10px}}
/* ------------- round 6 ------------- */
.chatMenu{position:absolute;right:6px;top:32px;background:var(--panel);border:1px solid var(--secondary);z-index:7;display:flex;flex-direction:column;padding:3px}
#chatList li{position:relative}
.chatMenu button{border:0;background:transparent;padding:5px 11px;text-align:left;font-size:10px;min-width:110px}
.chatMenu button:hover{background:var(--field);color:var(--ink)}
.tiny.icon{padding:3px 7px;font-size:13px;letter-spacing:0;min-width:0}
.tiny.icon.off{opacity:.4}
#input{min-height:60px}
@media(min-width:761px){
  #layout{min-height:calc((100vh - 110px)/1.1)}
  #main{height:calc((100vh - 110px)/1.1)}
  body.topHidden #layout{min-height:calc((100vh - 50px)/1.1)}
  body.topHidden #main{height:calc((100vh - 50px)/1.1)}
  body.balHidden #layout{min-height:calc((100vh - 60px)/1.1)}
  body.balHidden #main{height:calc((100vh - 60px)/1.1)}
  body.topHidden.balHidden #layout{min-height:calc(100vh/1.1)}
  body.topHidden.balHidden #main{height:calc(100vh/1.1)}
}
#topbar .themeSwitch{margin-left:auto}
/* reasoning + thinking */
.reasoning{margin:4px 0 8px;border:1px dashed var(--line);padding:4px 8px;background:transparent}
.reasoning summary{cursor:pointer;color:var(--dim);font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.reasoning pre{white-space:pre-wrap;color:var(--dim);font-size:11.5px;margin:6px 0 2px;max-height:260px;overflow:auto}
.thinking{color:var(--secondary);font-size:10px;letter-spacing:.16em;text-transform:uppercase;margin:2px 0 4px}
.blink{animation:blinkSoft 1.2s ease-in-out infinite}
@keyframes blinkSoft{0%,100%{opacity:1}50%{opacity:.25}}
/* settings tabs */
.settingsModal{max-width:640px;max-height:86vh;overflow:auto}
.stabs{display:flex;gap:6px;border-bottom:1px solid var(--line);padding-bottom:6px}
.stab{background:transparent;border:1px solid var(--line);color:var(--dim);padding:5px 12px}
.stab.on{border-color:var(--secondary);color:var(--secondary)}
.stabPage{display:flex;flex-direction:column;gap:10px;padding-top:8px}
/* slash menu */
.slashMenu{position:absolute;left:12px;right:12px;bottom:70px;z-index:8;background:var(--panel);border:1px solid var(--secondary);max-height:180px;overflow:auto}
.slashItem{display:flex;gap:10px;align-items:baseline;width:100%;text-align:left;background:transparent;border:0;padding:7px 10px;color:var(--ink)}
.slashItem strong{color:var(--secondary);min-width:80px}
.slashItem span{color:var(--dim);font-size:11px}
.slashItem:hover{background:var(--field)}
#composer{position:relative}
/* code blocks */
.cb{margin:8px 0;border:1px solid var(--line);background:var(--ground)}
.cbh{display:flex;justify-content:space-between;align-items:center;padding:3px 8px;border-bottom:1px solid var(--line)}
.cbl{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.cbtn{background:transparent;border:1px solid var(--line);color:var(--dim);font-size:9.5px;padding:2px 8px;letter-spacing:.1em}
.cbtn:hover{border-color:var(--secondary);color:var(--secondary)}
.cb pre{margin:0;padding:10px;overflow:auto;max-height:420px}
.cb code{font-size:12.5px;line-height:1.5;white-space:pre}
/* chat title clamp */
#chatList li span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
/* ghost message actions: invisible until message hover; hovered button goes solid */
.msg .acts{opacity:.08;transition:opacity .12s ease}
.msg:hover .acts{opacity:1}
.msg .acts button{background:transparent;border-color:var(--line);color:var(--dim)}
.msg:hover .acts button{color:var(--ink)}
.msg .acts button:hover{background:var(--secondary);border-color:var(--secondary);color:var(--ground);opacity:1}
/* compact slash menu */
.slashMenu{left:14px;right:auto;min-width:230px;max-width:300px;bottom:64px;border-color:var(--line);background:var(--panel);box-shadow:none;font-size:11px}
.slashItem{padding:4px 9px;gap:8px}
.slashItem strong{min-width:64px;font-size:11px}
.slashItem span{font-size:10px}
/* ------- round 11: rhythm + polish (4px scale: 4 8 12 16 24 32 48) ------- */
#topbar{height:46px;padding:0 12px;gap:10px;align-items:center}
#topbar .brand{letter-spacing:.14em}
#topbar button{height:30px}
#topbar .tiny{height:24px}
#who{color:var(--dim);font-size:11px}
#balances{height:32px;gap:12px;padding:0 12px;align-items:center}
#balances .b{padding:2px 10px;font-size:10.5px}
#layout{gap:20px;padding:16px 20px 0}
#side{width:248px;padding:12px;gap:8px}
.sideHead{margin-bottom:8px}
#chatList li{padding:5px 8px;border-radius:2px}
#chatList li+li{margin-top:2px}
#chatBar{padding:10px 6% 6px;margin-bottom:0}
#chatTitle{font-size:12px;letter-spacing:.14em}
.stats{padding:4px 6% 8px;border-bottom:0}
#messages{padding:20px 6% 12px;gap:0}
.msg{max-width:820px;margin:0 auto 18px}
.msg .meta{gap:8px;margin-bottom:4px}
.msg .body{line-height:1.58}
.msg.user .body{padding:6px 10px}
#composer{padding:12px 6% 14px;gap:8px;display:flex;flex-direction:column}
#composer #input{min-height:52px;padding:10px 12px;line-height:1.5}
#crow{gap:10px;margin-top:0;align-items:center}
#crow .composerControl{gap:3px}
#crow button,#crow select{height:32px}
#crow .tiny{height:26px}
#composer.dragOn,#messages.dragOn{outline:1px dashed var(--secondary);outline-offset:-6px}
.slashMenu{left:6%;right:auto;min-width:280px;bottom:100%;margin-bottom:6px}
.modal{padding:20px;gap:14px}
.modal h2{margin:0 0 4px}
button{transition:background .12s ease,border-color .12s ease,color .12s ease,opacity .12s ease}
:focus-visible{outline:1px solid var(--secondary);outline-offset:1px}
@media(max-width:760px){#layout{padding:10px 10px 0}#messages{padding:14px 12px 8px}#composer{padding:10px 12px 12px}.slashMenu{left:12px;right:12px;min-width:0}}
/* ------- round 12: control metrics + scrollbars ------- */
#crow{align-items:flex-end}
#crow select,#crow button{height:34px;min-height:34px;line-height:1.25;padding:5px 10px;font-size:12.5px;display:inline-flex;align-items:center;justify-content:center}
#crow .composerControl>span{height:14px;line-height:14px;font-size:9.5px;color:var(--dim);letter-spacing:.14em}
#crow .composerControl{gap:2px}
#crow select{padding-right:22px}
.composerControl select{max-width:320px}
*{scrollbar-width:thin;scrollbar-color:var(--line) var(--ground)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--ground)}
::-webkit-scrollbar-thumb{background:var(--line);border:2px solid var(--ground)}
::-webkit-scrollbar-thumb:hover{background:var(--secondary)}
.apiSetup{white-space:pre-wrap;font-size:11px;background:var(--ground);border:1px solid var(--line);padding:10px;overflow:auto;max-height:220px}
/* ------- round 13: sides, unread dots ------- */
.msg.user{margin-left:auto;margin-right:0;max-width:74%}
.msg.user .body{background:var(--field);border:1px solid var(--line);padding:8px 12px}
.msg.assistant{margin-right:auto;margin-left:0}
#chatList li .unreadDot{display:inline-block;width:7px;height:7px;background:var(--secondary);margin-right:6px;flex:none}
#chatList li{display:flex;align-items:center;gap:4px}
#chatList li span{flex:1;min-width:0}
#chatList li button{flex:none}
/* ------- round 14: sidebar header, tool notes, markdown blocks ------- */
.sideHead{display:flex;align-items:center;justify-content:space-between;position:relative;margin-bottom:6px}
.sideHead .headLabel{font-size:10px;letter-spacing:.16em;color:var(--dim)}
#newChatBtn.full{width:100%;margin:6px 0 10px;height:34px;font-weight:700;letter-spacing:.12em}
#chatsMenu{right:0;left:auto;top:26px;min-width:150px}
.toolNotes{margin:4px 0 8px;display:flex;flex-direction:column;gap:4px}
.toolNote{border:1px dashed var(--line);background:transparent}
.toolNote summary{cursor:pointer;color:var(--dim);font-size:10px;letter-spacing:.1em;padding:3px 8px}
.toolNote summary:hover{color:var(--secondary)}
.toolNote pre{margin:0;padding:8px;max-height:220px;overflow:auto;color:var(--dim);font-size:11.5px;white-space:pre-wrap;border-top:1px dashed var(--line)}
.msg .body h2,.msg .body h3,.msg .body h4{margin:10px 0 4px;line-height:1.3}
.msg .body p{margin:0 0 8px}
.msg .body ul,.msg .body ol{margin:4px 0 8px;padding-left:20px}
.msg .body li{margin:2px 0}
.msg .body blockquote{border-left:2px solid var(--secondary);margin:6px 0;padding:2px 10px;color:var(--dim)}
.msg .body hr{border:0;border-top:1px solid var(--line);margin:10px 0}
.msg .body table{border-collapse:collapse;margin:6px 0;font-size:12px;max-width:100%;display:block;overflow-x:auto}
.msg .body th,.msg .body td{border:1px solid var(--line);padding:4px 8px;text-align:left;vertical-align:top}
.msg .body th{background:var(--field);color:var(--ink)}
/* round 15: sidebar buttons, bin chip, generating blink */
.sideBtns{display:flex;gap:6px}
.sideBtns .tiny{height:24px;min-width:24px;padding:0 7px;font-size:12px}
#newChatBtn.full{display:none}
.binChip{display:inline-block;margin:2px 0 6px;border:1px solid var(--line);color:var(--dim);font-size:10.5px;letter-spacing:.08em;padding:2px 8px}
.genBlink .body{color:var(--dim);animation:blinkSoft 1.2s ease-in-out infinite}
/* round 16: toast controls */
#toasts{gap:6px}
.toast{display:flex;align-items:center;gap:6px;max-width:340px}
.toast span{flex:1}
.tbtn{background:transparent;border:0;color:var(--dim);padding:0 4px;font-size:11px;height:18px;min-height:18px;cursor:pointer}
.tbtn:hover{color:var(--secondary)}
.toast.fadeOut{opacity:0;transform:translateX(8px);transition:opacity .35s ease,transform .35s ease}
/* round 19: tabular figures for counters (de-AI pattern: numbers with intent) */
#balances, .stats, #chatStats, .msg .meta, table, .rateHeadline{font-variant-numeric:tabular-nums}

#keyModal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.7)}
#keyModal .card{max-width:560px;width:100%}
#keyModal code{display:block;word-break:break-all;background:var(--ground);border:1px solid var(--line);padding:10px;margin:8px 0;font-size:12px}

@media(max-width:760px){body{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}input,select,textarea{font-size:16px}.tiny,.acts button{padding:7px 10px;font-size:11px}#messages{-webkit-overflow-scrolling:touch}}

/* --- mobile fix round: topbar/token bar must grow when items wrap --- */
@media(max-width:760px){
  #topbar{height:auto;min-height:46px;flex-wrap:wrap;padding:6px 10px;row-gap:6px}
  #topbar .themeSwitch{margin-left:0}
  #topbar button{height:28px}
  #topbar .tiny{height:24px}
  #balances{height:auto;min-height:32px;flex-wrap:wrap;padding:6px 12px;row-gap:4px}
  #balances .b{padding:2px 8px}
}

/* --- topbar buttons: fix clipped/off-center text (fixed height vs big padding) --- */
#topbar button{height:30px;line-height:30px;padding:0 12px;font-size:12.5px}
#topbar .tiny{height:24px;line-height:24px;padding:0 8px;font-size:10px}
#topbar .themeSwitch button{height:26px;line-height:26px;padding:0 7px}
@media(max-width:760px){
  #topbar button{height:32px;line-height:32px;padding:0 10px}
  #topbar .tiny{height:28px;line-height:28px;padding:0 9px;font-size:10.5px}
  #topbar .themeSwitch button{height:28px;line-height:28px;padding:0 8px}
}

html,body{-webkit-user-select:text;user-select:text}.msg,.msg .body,.msg pre,.card,.card p{-webkit-user-select:text;user-select:text}a,.msg .body{-webkit-touch-callout:default}
