/* Meja Kerja v1.0 — additive platform pass. Keeps v0.9 features and improves scale, context, launcher, and new apps. */
:root{--rail:304px;--top:68px;--context-h:38px;--content:1680px}
body{font-size:calc(15px * var(--ui-scale))}

/* Expanded navigation: intentionally more readable. */
.rail{padding:14px 14px 12px;gap:3px}
.brand{height:72px;padding:4px 8px 14px;gap:12px}
.brand-mark{width:42px;height:42px;flex:0 0 42px}
.brand-copy strong{font-size:17px;font-weight:750;letter-spacing:-.025em}
.brand-copy small{font-size:10px;max-width:214px}
.rail-group{padding:14px 10px 6px;font-size:9px;letter-spacing:.16em}
.rail-link{min-height:50px;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:7px 10px;border-radius:9px}
.rail-link>svg{width:20px;height:20px}
.rail-label{display:block;font-size:20px;font-weight:600;line-height:1.05;letter-spacing:-.025em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rail-link::after{font-size:11px;line-height:1.45}
.rail-collapse{min-height:40px}
body.rail-collapsed{--rail:80px}
.rail-collapsed .rail-link{width:56px;min-height:52px}

/* Context strip is a quiet semantic status layer, not another card. */
.context-strip{position:sticky;top:var(--top);z-index:86;height:var(--context-h);display:flex;align-items:center;gap:10px;padding:0 clamp(12px,2vw,24px);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(8px);overflow:hidden}
.context-strip .context-app{font:800 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.11em;color:var(--muted);flex:0 0 auto}
.context-strip .context-main{font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.context-strip .context-meta{margin-left:auto;display:flex;gap:7px;align-items:center;white-space:nowrap}
.context-strip .context-meta span{font:700 8px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--quiet)}
.context-strip .context-dot{width:6px;height:6px;border-radius:50%;background:var(--green);border:1px solid var(--ink)}

/* App drawer pin controls. */
.app-menu-row{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:4px;align-items:stretch}
.app-menu-row .app-menu-item{min-width:0}
.app-pin{border:1px solid transparent;background:transparent;color:var(--muted);display:grid;place-items:center;border-radius:7px;min-height:42px}
.app-pin:hover,.app-pin.active{background:var(--paper-2);border-color:var(--line);color:var(--blue)}
.app-pin svg{width:16px;height:16px}
.apps-pinned-summary{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:0 0 9px;padding:7px 8px;border:1px dashed var(--line);background:var(--paper-2)}
.apps-pinned-summary b{font-size:10px}
.apps-pinned-summary span{font:700 8px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted)}

/* New platform apps. */
.data-layout{display:grid;grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr);gap:12px}.data-table-host{min-height:420px;overflow:auto}.sql-box{font:500 13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;min-height:130px}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.stat-mini{padding:12px;border:1px solid var(--line);background:var(--paper-2)}.stat-mini b{display:block;font-size:22px}
.scan-layout{display:grid;grid-template-columns:minmax(320px,1.2fr) minmax(260px,.8fr);gap:12px}.scan-stage{min-height:520px;display:grid;place-items:center;background:var(--paper-2);border:1px solid var(--line);overflow:auto}.scan-stage canvas,.scan-stage video{max-width:100%;max-height:72vh}.scan-pages{display:flex;gap:7px;overflow:auto;padding:7px}.scan-thumb{width:90px;min-width:90px;height:112px;border:1px solid var(--line);background:var(--paper-2);padding:4px;position:relative}.scan-thumb img{width:100%;height:100%;object-fit:cover}.scan-thumb.active{outline:2px solid var(--blue)}
.archive-layout{display:grid;grid-template-columns:240px minmax(0,1fr) 340px;gap:12px}.archive-list{display:grid;gap:7px}.archive-item{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:9px;align-items:center;padding:10px;border:1px solid var(--line);background:var(--paper)}.archive-item.active{border-color:var(--ink);background:var(--paper-2)}
.people-layout{display:grid;grid-template-columns:minmax(250px,.75fr) minmax(0,1.25fr);gap:12px}.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}.person-card{padding:13px;border:1px solid var(--line);background:var(--paper);display:grid;gap:8px}.person-avatar{width:42px;height:42px;border:1px solid var(--ink);display:grid;place-items:center;font-weight:800;background:var(--cyan-soft)}
.automation-layout{display:grid;grid-template-columns:minmax(270px,.75fr) minmax(0,1.25fr);gap:12px}.rule-card{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:9px;padding:10px;border:1px solid var(--line);background:var(--paper)}.rule-flow{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.rule-node{border:1px solid var(--line);background:var(--paper-2);padding:10px;min-width:150px}.rule-arrow{font-size:20px;color:var(--quiet)}
.library-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:12px}.library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}.library-card{min-height:145px;padding:13px;border:1px solid var(--line);background:var(--paper);display:flex;flex-direction:column;gap:8px}.library-card>svg{width:26px;height:26px}.library-card .library-actions{margin-top:auto;display:flex;gap:5px}

/* Better responsive typography and wide-layout control. */
@media(max-width:1320px) and (min-width:1101px){:root{--rail:286px}.rail-label{font-size:20px;font-weight:600}.brand-copy strong{font-size:16px}.page{padding-inline:28px}.archive-layout{grid-template-columns:210px minmax(0,1fr) 300px}}
@media(max-width:1100px) and (min-width:901px){:root{--rail:88px}.brand{width:58px;justify-content:center;padding-inline:0}.brand-copy,.rail-label,.rail-group,.sidebar-foot{display:none!important}.rail{align-items:center;padding-inline:12px}.rail-link{width:58px;grid-template-columns:1fr;padding-inline:6px;margin-inline:auto}.rail-link::after{left:calc(100% + 13px)}.rail-collapse{width:58px}.data-layout,.scan-layout,.people-layout,.automation-layout{grid-template-columns:1fr}.archive-layout{grid-template-columns:210px minmax(0,1fr)}.archive-detail{grid-column:1/-1}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){:root{--context-h:34px}.context-strip{top:var(--top);height:34px;padding-inline:10px}.context-strip .context-main{font-size:10px}.context-strip .context-meta span:nth-child(n+2){display:none}.rail-label{font-size:9px!important;font-weight:700!important;letter-spacing:-.01em}.data-layout,.scan-layout,.people-layout,.automation-layout,.archive-layout,.library-layout{grid-template-columns:1fr}.archive-detail{grid-column:auto}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.library-side{display:flex;gap:5px;overflow:auto}.library-side .eyebrow{display:none}.library-side .btn{flex:0 0 auto}}
@media(max-width:560px){.stat-grid{grid-template-columns:1fr 1fr}.people-grid,.library-grid{grid-template-columns:1fr 1fr}.scan-stage{min-height:360px}.context-strip .context-app{display:none}}
@media(max-width:390px){.people-grid,.library-grid{grid-template-columns:1fr}}

.floating-tip{position:fixed;z-index:2500;max-width:260px;padding:9px 11px;border:1px solid var(--ink);background:var(--paper);box-shadow:var(--shadow-lg);font-size:11px;font-weight:650;line-height:1.45;color:var(--ink);pointer-events:none;opacity:0;transform:translateY(2px);transition:opacity .12s ease,transform .12s ease}.floating-tip.show{opacity:1;transform:none}body.floating-tips .rail-link::after{display:none!important}
.editor-layout.split-enabled{display:flex;gap:0}.editor-layout.split-enabled>.editor-pane,.editor-layout.split-enabled>.preview-pane{min-width:0}.gutter{background:var(--paper-3);border-left:1px solid var(--line);border-right:1px solid var(--line);cursor:col-resize}.gutter:hover{background:var(--cyan-soft)}
@media(max-width:1050px){.editor-layout.split-enabled{display:grid;grid-template-columns:1fr}.gutter{display:none!important}}