/* SPDX-License-Identifier: AGPL-3.0-only
   App-specific layout; shared palette and components live in site.css. */
/* The route shell is revealed synchronously, before any identity/API await.
   A slow JS download must not paint Browse and then reflow into another route. */
body:not([data-route]) main,body:not([data-route]) footer{visibility:hidden}
html{scrollbar-gutter:stable}
button{font:inherit;font-weight:620;min-height:44px;border:1px solid transparent;border-radius:10px;padding:8px 16px;background:var(--accent);color:var(--accent-ink);cursor:pointer}
button.secondary{background:transparent;border-color:var(--line-2);color:var(--ink)}
button:disabled{opacity:.55;cursor:not-allowed}
button.danger{background:var(--bad);color:var(--accent-ink)}
input:not([type=checkbox]),select,textarea{font:inherit;width:100%;min-height:44px;color:var(--ink);background:var(--bg);border:1px solid var(--line-2);border-radius:10px;padding:10px 12px}
input:disabled,textarea:disabled{opacity:.6}
label{display:block;color:var(--muted);font-size:14px}
.fields{display:grid;gap:16px;margin:20px 0}
.fields label input,.fields label select{margin-top:6px}
.create-card{max-width:720px;margin:0 auto}
.create-card h2{margin-bottom:12px}
.meta,.hint{color:var(--muted)}
.panel{min-height:650px}
.count-line{height:26px;margin:0 0 10px}
.listing-window{height:calc(100dvh - 330px);min-height:440px;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;margin-bottom:16px}
.swarm-card{height:420px;min-height:420px;overflow:hidden;gap:10px}
.swarm-card h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.swarm-card .desc{height:44px;min-height:44px;overflow:hidden}
.swarm-card .foot{flex-wrap:nowrap;min-height:44px}
.swarm-card .foot a{white-space:nowrap}
.swarm-card .who{overflow:hidden;text-overflow:ellipsis}
.swarm-card .stats{flex:none;height:90px}
.swarm-card .status{flex:none}
.status{border:1px solid var(--line-2);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:650;text-transform:capitalize;white-space:nowrap}
.status.serving{color:var(--accent);background:var(--good-bg)}
.status.warming{color:var(--warn);background:var(--warn-bg)}
.status.offline{color:var(--muted)}
.skeleton .skel{height:100%}
.card-fresh{flex:none;font-size:12px;height:20px;white-space:nowrap;overflow:hidden}
.notice-link{flex:none;font-size:12px}
.empty{padding:24px;color:var(--muted)}
.stat .v{font-size:1rem}
.stat .k{font-size:10px}
.swarm-card .meta{font-size:12px}
.owner-chip{font-family:var(--mono);font-size:11px}
.detail-head{height:148px;overflow:auto}
.detail-head h2{margin-bottom:8px;height:30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.detail-head p{height:46px;max-height:46px;overflow:auto}
#detail-owner{height:1.55em;overflow:auto}
#detail-model{height:3.1em;overflow:auto}
.bigstats{margin-bottom:20px}
.bs{height:190px;min-height:190px;overflow:hidden}
.bs .v{font-size:1.7rem;white-space:nowrap}
.bs .src{min-height:40px}
.keychip{width:265px;min-height:44px}
.keychip .mono{font-size:12px;white-space:nowrap}
.mono{overflow-wrap:anywhere}
#panel-contributing .card{margin-bottom:20px;min-height:190px}
#download-body{height:200px;min-height:200px;overflow:auto}
#panel-owned h2{margin-bottom:14px}
#owned-list{height:650px;overflow:auto;overscroll-behavior:contain}
#owned-empty{margin:0}
#owned-empty a{pointer-events:auto}
[data-owned]{border:1px solid var(--line);border-radius:12px;padding:20px;margin:0 0 16px;background:var(--card)}
[data-owned] h3{margin-bottom:12px}
.qr{width:180px;height:180px;background:white;border-radius:8px}
.link{font-size:12px}
.owner-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}
.owner-grid>div{height:290px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:14px;min-width:0}
.request{padding:14px 0;border-bottom:1px solid var(--line)}
.request .row label{width:105px}
.request .row{align-items:end}
.decision-buttons{position:relative}
.request[data-holding="1"] [data-approve]{visibility:hidden}
[data-undo]{visibility:hidden;position:absolute;left:0;top:0;z-index:1}
.decision-slot{min-height:90px;display:flex;align-items:center;gap:8px}.decision-slot span{flex:1;min-width:0;height:60px;overflow:auto;font-size:13px}.decision-slot button{flex:none}
.sec{font-size:14px;margin:12px 0}
.sec[data-available=false]{color:var(--muted)}
.error{color:var(--bad)}
.chat-list{height:96px;flex-direction:row;overflow:auto;gap:10px;padding-bottom:10px}
.chat-item{flex:0 0 230px;overflow:hidden}
.chat-item .n{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat{height:calc(100dvh - 350px);min-height:480px}
.chat-head{height:76px;flex:none;overflow:hidden;flex-wrap:nowrap}
.chat-head>div{min-width:0;flex:1;height:50px}
.chat-head h2{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.livebar{height:52px;min-height:52px;flex:none;overflow:auto;gap:4px 16px;font-size:12px}
#chat-state{flex:0 0 110px;height:30px;line-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#chat-metrics{flex:1;min-width:0;height:30px;line-height:30px;white-space:nowrap;overflow:auto}
.conversation{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;display:flex;flex-direction:column}
.gate{margin:16px;flex:none;max-width:none}
.gate p{font-size:14px}
.gate button{margin:5px 6px 0 0}
.log{overflow:visible;flex:initial;padding:0 16px 16px;min-height:0}
.log:empty{padding:0}
.msg{flex:none;overflow-wrap:anywhere}
.msg.meta,.msg.terminal{font-size:12px;color:var(--muted)}
.msg.terminal[data-terminal=completed]{color:var(--accent)}
.msg.terminal[data-terminal=failed],.msg.terminal[data-terminal=killed]{color:var(--bad)}
.dock{height:190px;min-height:190px;flex:none;gap:8px;padding:12px 16px}
.composer textarea{resize:none;height:64px;min-height:64px}
.composer button{width:80px;flex:none}
#tokens{width:78px;display:inline;padding:3px;min-height:30px}
.fine{align-items:center}
#chat-privacy{display:block;font-size:12px;margin:0}
#composer-reason{font-size:12px;flex:1;min-width:0;text-align:right;max-width:65%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.toast:not(:empty){opacity:1;transform:translate(-50%,0)}
.toast{font-size:14px;top:64px;bottom:auto;max-height:120px;overflow:auto}
#privacy{height:160px;overflow:auto}
#demo{height:64px;overflow:auto}
@media(max-width:640px){#privacy{height:260px}
#demo{height:180px}
}
footer.foot{min-height:160px}
.confirm{border:1px solid var(--warn);padding:16px;border-radius:10px;margin:12px 0}
dialog h2,dialog p{margin-bottom:14px}
dialog button{margin:4px}
#create-state{min-height:50px}
.preview{font-size:13px}

@media(max-width:900px){.owner-grid{grid-template-columns:1fr}
}

@media(max-width:640px){.owner-grid>div:nth-child(2){height:410px}
.preview,.keychip .lbl{display:none}
.keychip{width:172px;padding:0 10px}
.keychip .mono{font-size:11px}
.page-head{height:100px;align-items:center;gap:8px}
.page-head .row{gap:8px}
.page-head .row>*{font-size:13px;padding:8px 12px}
.app{padding-top:12px}
.toolbar{gap:6px}
.toolbar .chip{font-size:12px;padding:0 10px;min-height:44px}
.search{flex-basis:100%}
.listing-window{height:calc(100dvh - 375px);min-height:400px}
.swarm-card{height:480px;min-height:480px;padding:16px}
.swarm-card .stats{height:160px}
.swarm-card .foot{gap:6px}
.swarm-card .foot button,.swarm-card .foot .btn{padding:8px 10px;font-size:13px}
.stat .k{font-size:11px}
.stat .v{font-size:1rem}
.bs{height:162px;min-height:162px}
.bs .v{font-size:1.25rem}
.bs .src{font-size:11px;min-height:52px}
.panel{min-height:640px}
.chat-list{height:86px}
.chat{height:calc(100dvh - 345px);min-height:390px}
.chat-head{height:55px;min-height:55px;padding:8px 12px}
.chat-head button{font-size:12px;padding:6px}
.livebar{height:46px;min-height:46px;white-space:normal;flex-wrap:wrap;line-height:1.3;padding:6px 12px}
.dock{height:188px;min-height:188px;padding:10px 12px}
.composer textarea{height:56px;min-height:56px}
.composer button{width:64px;padding:8px}
.gate{margin:12px}
.gate p{font-size:13px}
.gate button{font-size:13px}
.gate h3{font-size:16px}
.chat-item{flex-basis:200px;font-size:14px}
.chat-item .s{font-size:12px}
#composer-reason{max-width:52%}
.detail-head{height:170px}
#owned-list{height:650px}
footer.foot{padding-bottom:90px!important}
}
