/* Functional app layout using Claude’s KliXplan brand tokens. */
@font-face{font-family:Manrope;src:url("brand/manrope-latin.woff2") format("woff2");font-weight:200 800;font-display:swap}:root{--kx-text:var(--kx-fg);--kx-accent:var(--kx-brand);font-family:var(--kx-font-sans);line-height:1.6}
*{box-sizing:border-box}body{margin:0;background:var(--kx-bg);color:var(--kx-text)}a{color:inherit;text-underline-offset:3px}button,input,select,textarea{font:inherit}button{cursor:pointer;padding:.45rem .8rem;border:1px solid var(--kx-line);border-radius:var(--kx-radius-md);background:var(--kx-surface);color:var(--kx-text)}button:hover{border-color:var(--kx-accent)}:focus-visible{outline:2px solid var(--kx-brand);outline-offset:3px}input:not([type=checkbox]),textarea,select{width:100%;padding:.5rem;border:1px solid var(--kx-line);border-radius:var(--kx-radius-md);background:var(--kx-surface);color:var(--kx-text)}label{display:block;margin:.65rem 0}textarea{min-height:100px}form{margin:.65rem 0}h1{font-size:1.8rem}h2{font-size:1.15rem}h3{font-size:1rem}small,.kx-muted{color:var(--kx-muted)}.kx-header{display:flex;align-items:center;gap:1.4rem;padding:.7rem 1.5rem;border-bottom:1px solid var(--kx-line);background:var(--kx-surface);flex-wrap:wrap}.kx-header a{text-decoration:none;font-weight:650}.kx-header form{margin:0}.kx-header span:first-of-type{margin-right:auto}.kx-workspace{display:grid;grid-template-columns:210px minmax(0,1fr)}.kx-sidebar{padding:1rem;background:var(--kx-surface);border-right:1px solid var(--kx-line)}.kx-sidebar a{display:block;padding:.6rem .4rem;text-decoration:none}.kx-sidebar a[aria-current=page]{font-weight:700;background:var(--kx-bg)}.kx-main{padding:1.5rem;max-width:1700px;width:100%;margin:0 auto;min-height:75vh}.kx-card{display:block;border:1px solid var(--kx-line);background:var(--kx-surface);border-radius:var(--kx-radius-lg);padding:1.1rem;margin:1rem 0;text-decoration:none}.kx-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}.kx-grid>.kx-card{margin:.5rem 0}.kx-kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}.kx-kpis strong{display:block;font-size:1.6rem}.kx-banner{padding:.8rem 1rem;border:1px solid var(--kx-line);border-left:4px solid var(--kx-accent);background:var(--kx-surface);margin:.8rem 0}.kx-badge{display:inline-block;border:1px solid currentColor;border-radius:var(--kx-radius-md);padding:.1rem .45rem;font-size:.85rem}.kx-green{color:var(--kx-ok)}.kx-orange{color:var(--kx-warn)}.kx-red{color:var(--kx-bad)}table{border-collapse:collapse;width:100%;background:var(--kx-surface);text-align:left}th,td{padding:.65rem;border-bottom:1px solid var(--kx-line);vertical-align:top}.kx-table-wrap{overflow:auto}.kx-mono{font-family:ui-monospace,monospace;overflow-wrap:anywhere}.kx-footer{padding:1rem 1.5rem;color:var(--kx-muted);font-size:.85rem}.kx-login{max-width:450px;margin:3rem auto}.kx-skip{position:absolute;left:-9999px}.kx-skip:focus{position:fixed;top:0;left:0;background:var(--kx-surface);padding:1rem;z-index:30}.kx-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,440px);gap:1rem}.kx-detail{background:var(--kx-surface);border:1px solid var(--kx-line);padding:1rem;align-self:start}.kx-tabs{display:flex;gap:.5rem;flex-wrap:wrap}.kx-tabs button[aria-selected=true]{font-weight:700;border-bottom:3px solid var(--kx-accent)}.kx-unread{font-weight:700}summary{cursor:pointer;padding:.4rem 0}.kx-inline{display:flex;gap:.6rem;align-items:end;flex-wrap:wrap}.kx-inline label{flex:1}.kx-hidden,[hidden]{display:none!important}
@media(max-width:900px){.kx-split{grid-template-columns:1fr}.kx-workspace{grid-template-columns:1fr}.kx-sidebar{display:flex;flex-wrap:wrap;gap:.4rem;border-right:0;border-bottom:1px solid var(--kx-line)}.kx-sidebar p{width:100%}.kx-main{padding:1rem}.kx-header span:first-of-type{display:none}}
.kx-primary{background:var(--kx-fg);color:var(--kx-bg);border-color:var(--kx-fg);border-radius:var(--kx-radius-pill);padding:.7rem 1.2rem}.kx-logo img{width:125px;height:30px;object-fit:contain}.kx-logo-dark{display:none}.kx-header .kx-logo{display:flex;align-items:center}.kx-app h1,.kx-app h2,.kx-app h3{letter-spacing:-.03em}.kx-sidebar a[aria-current=page]{background:var(--kx-brand-soft);color:var(--kx-brand-ink);border-radius:var(--kx-radius-md)}.kx-login p{margin:1rem 0}.kx-account{margin-left:auto}@media(prefers-color-scheme:dark){.kx-logo-light{display:none}.kx-logo-dark{display:block}}
