/* Shared shell for both apps: sidebar, app switcher, nav, theme control, mobile bottom tabs, sheets, toast.
   Breakpoints: desktop ≥1200 (full sidebar) · tablet 768–1199 (72px icon rail) · mobile <768 (bottom tabs). */
.kc-side{width:248px;flex:none;background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;height:100vh;height:100dvh;position:sticky;top:0;padding:18px 14px 14px;gap:14px;overflow:hidden}
.kc-brand{display:flex;align-items:center;gap:10px;padding:0 4px;text-decoration:none;color:var(--ink)}
.kc-mark{width:36px;height:36px;border-radius:10px;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font:700 12px/1 var(--f-body);letter-spacing:.3px;flex:none}
.kc-brand b{display:block;font-size:14px;line-height:1.3}.kc-brand small{display:block;font-size:11.5px;color:var(--muted);line-height:1.3}
.kc-switch{display:grid;grid-template-columns:1fr 1fr;background:var(--sunken);border-radius:10px;padding:3px;gap:3px}
.kc-switch a{display:block;text-align:center;padding:6px 4px;border-radius:8px;font-size:12.5px;font-weight:500;color:var(--muted);text-decoration:none;white-space:nowrap}
.kc-switch a[aria-current="page"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px oklch(0.3 0.05 285 / 0.12)}
.kc-switch a:hover{color:var(--ink)}
.kc-switch .ic{display:none}
.kc-nav{display:flex;flex-direction:column;gap:2px;flex:1;min-height:0;overflow-y:auto;margin:0 -6px;padding:0 6px;scrollbar-width:thin}
.kc-navlabel{font:500 11px var(--f-mono);letter-spacing:1.5px;color:var(--muted);text-transform:uppercase;margin:12px 10px 4px}
.kc-navlabel:first-child{margin-top:0}
.kc-navitem{display:flex;align-items:center;gap:10px;height:38px;padding:0 10px;border:0;border-radius:10px;background:none;color:var(--ink);font:500 13.5px var(--f-body);text-align:left;cursor:pointer;width:100%;text-decoration:none}
.kc-navitem .ic{width:18px;text-align:center;flex:none;color:var(--muted)}
.kc-navitem .lb{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kc-navitem .ct{font:500 11px var(--f-mono);color:var(--muted)}
.kc-navitem:hover{background:var(--sunken)}
.kc-navitem[aria-current="page"],.kc-navitem.active{background:var(--accent-soft);color:var(--accent-text)}
.kc-navitem[aria-current="page"] .ic,.kc-navitem.active .ic{color:var(--accent-text)}
.kc-sidefoot{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:12px}
.kc-theme{display:grid;grid-template-columns:repeat(3,1fr);background:var(--sunken);border-radius:9px;padding:3px;gap:3px}
.kc-theme button{border:0;background:none;color:var(--muted);border-radius:7px;padding:4px 0;font:500 12px var(--f-body);cursor:pointer}
.kc-theme button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px oklch(0.3 0.05 285 / 0.12)}
.kc-user{display:flex;align-items:center;gap:10px;min-width:0}
.kc-avatar{width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent-text);display:grid;place-items:center;font-weight:700;font-size:13px;flex:none}
.kc-user .who{flex:1;min-width:0;line-height:1.35}.kc-user .who b{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kc-user .who small{display:block;font-size:11px;color:var(--muted)}
.kc-user .who small button{border:0;background:none;padding:0;color:inherit;font:inherit;cursor:pointer;text-decoration:underline dotted}
.kc-iconbtn{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:inline-grid;place-items:center;cursor:pointer;flex:none;font-size:15px;padding:0}
.kc-iconbtn:hover{border-color:var(--accent);color:var(--accent-text)}
.kc-linkbtn{border:0;background:none;color:var(--muted);font:500 12px var(--f-body);cursor:pointer;padding:4px 6px;border-radius:6px}
.kc-linkbtn:hover{color:var(--danger);background:var(--danger-soft)}
.kc-eyebrow{font:500 11px var(--f-mono);letter-spacing:1.5px;text-transform:uppercase;color:var(--accent-text)}

/* mobile top bar + bottom tabs (hidden above 768) */
.kc-mtop{display:none}
.kc-tabbar{display:none}
.kc-apppill{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:999px;background:var(--sunken);color:var(--ink);font:500 13px var(--f-body);text-decoration:none;white-space:nowrap}

/* sheets & scrim */
.kc-scrim{position:fixed;inset:0;background:var(--scrim);z-index:60}
.kc-sheet{position:fixed;left:0;right:0;bottom:0;z-index:61;background:var(--surface);border-radius:20px 20px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom,0px));max-height:85dvh;overflow-y:auto;box-shadow:var(--shadow)}
.kc-sheet h3{font:500 11px var(--f-mono);letter-spacing:1.5px;color:var(--muted);margin:14px 2px 8px;text-transform:uppercase}
.kc-sheet h3:first-child{margin-top:0}
.kc-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.kc-tile{height:64px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font:500 12px var(--f-body);cursor:pointer;padding:0 4px;text-align:center}
.kc-tile .ic{font-size:17px;color:var(--accent-text)}
.kc-tile.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text)}

/* toast */
.kc-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:90;background:var(--ink);color:var(--bg);border-radius:10px;padding:10px 16px;font-size:13.5px;max-width:min(520px,calc(100vw - 32px));box-shadow:var(--shadow);text-align:center}

@media (min-width:768px) and (max-width:1199px){
 .kc-side{width:72px;padding:16px 10px;align-items:center}
 .kc-brand b,.kc-brand small,.kc-navlabel,.kc-navitem .lb,.kc-navitem .ct,.kc-user .who,.kc-theme,.kc-switch a .lb{display:none}
 .kc-brand{padding:0}
 .kc-switch{grid-template-columns:1fr;width:44px;padding:3px}
 .kc-switch a{padding:6px 0}.kc-switch .ic{display:inline}
 .kc-navitem{width:44px;justify-content:center;padding:0}
 .kc-navitem .ic{font-size:16px}
 .kc-nav{align-items:center}
 .kc-sidefoot{align-items:center}
 .kc-user{flex-direction:column;gap:6px}
}
@media (max-width:767px){
 .kc-side{display:none}
 .kc-mtop{display:flex;align-items:center;gap:8px;height:60px;padding:0 12px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
 .kc-mtop .kc-mark{width:32px;height:32px;font-size:11px}
 .kc-mtop .sp{flex:1}
 .kc-tabbar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;position:fixed;left:0;right:0;bottom:0;z-index:40;height:calc(58px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:var(--surface);border-top:1px solid var(--line)}
 .kc-tabbar button{border:0;background:none;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font:500 11px var(--f-body);cursor:pointer;padding:0}
 .kc-tabbar button .ic{font-size:17px;line-height:1.2}
 .kc-tabbar button.active{color:var(--accent-text)}
 .kc-toast{bottom:calc(72px + env(safe-area-inset-bottom,0px))}
 input,select,textarea{font-size:16px!important}
}
:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@keyframes kcdot{0%,80%,100%{opacity:.25}40%{opacity:1}}