:root{--bg:#050504;--chrome:#0b0b0a;--line:rgba(232,226,207,0.12);--line-strong:rgba(232,226,207,0.26);--text:#e8e2cf;--text-dim:#bfb8a3;--muted:#8c8674;--accent:#d9661f;--accent-hi:#f08a3c;--accent-soft:rgba(217,102,31,0.18);--signal:#9fb56a;--danger:#c4553a;--plate:rgba(8,8,6,0.66);--paper-ink:#241f15;--font-head:"Oswald","Arial Narrow",sans-serif;--font-body:"Rubik",system-ui,sans-serif;--font-mono:"IBM Plex Mono",ui-monospace,monospace;--nav-width:236px;--frame-top:100px;--frame-side:66px;--frame-bottom:60px;--fo:12px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:#050504;color:var(--text);font:400 15px/1.55 var(--font-body);-webkit-font-smoothing:antialiased;overflow:hidden}a{color:var(--accent-hi);text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:3px}:focus-visible{outline:1px solid var(--accent);outline-offset:2px}[hidden]{display:none!important}code{font-family:var(--font-mono);font-size:0.92em;background:rgba(232,226,207,0.06);padding:1px 6px;border-radius:2px}.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.kpk{position:fixed;inset:0;padding:var(--frame-top) var(--frame-side) var(--frame-bottom);background:#050504}.kpk::before{content:"";position:absolute;inset:12px;z-index:0;background:linear-gradient(180deg,#1a1a18,#121211);border-radius:10px}.kpk-frame{position:absolute;inset:0;z-index:10;pointer-events:none;--fc:#8e8c83;--fw:2px}.kpk-frame i{position:absolute;display:block;box-sizing:border-box}.f-outer{inset:var(--fo);border:var(--fw) solid var(--fc);border-radius:10px}.f-tab{top:var(--fo);width:110px;height:90px;border-top:7px solid var(--fc);border-radius:10px 0 0 0}.f-tab.l{left:var(--fo);border-left:7px solid var(--fc)}.f-tab.r{right:var(--fo);border-right:7px solid var(--fc);border-radius:0 10px 0 0}.f-band{top:calc(var(--fo) + (var(--frame-top) - var(--fo) - 6px) * 0.5);left:calc(var(--frame-side) - 6px);right:calc(var(--frame-side) - 6px);bottom:calc(100% - var(--frame-top) + 6px);border:var(--fw) solid var(--fc);border-bottom:0;border-radius:12px 12px 0 0;background:#050504}.f-screen{top:calc(var(--frame-top) - 6px);left:calc(var(--frame-side) - 6px);right:calc(var(--frame-side) - 6px);bottom:calc(var(--frame-bottom) - 6px);border:var(--fw) solid var(--fc);border-radius:0 0 8px 8px}.f-screw{width:20px;height:20px;border:var(--fw) solid var(--fc);border-radius:50%;bottom:calc((var(--frame-bottom) - 6px + var(--fo)) * 0.5 - 10px)}.f-screw::before{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;background:var(--fc);transform:translate(-50%,-50%) rotate(-40deg)}.f-screw.l{left:calc((var(--frame-side) - 6px + var(--fo)) * 0.5 - 10px)}.f-screw.r{right:calc((var(--frame-side) - 6px + var(--fo)) * 0.5 - 10px)}.f-notch{bottom:calc(var(--fo) - 1px);left:46%;right:46%;height:9px;border:var(--fw) solid var(--fc);border-bottom:0;border-radius:7px 7px 0 0;background:#050504}.kpk-bar{position:absolute;z-index:11;left:var(--frame-side);right:var(--frame-side);top:calc(var(--fo) + (var(--frame-top) - var(--fo) - 6px) * 0.5 + 2px);height:calc((var(--frame-top) - var(--fo) - 6px) * 0.5 - 2px);display:flex;align-items:center;gap:22px;padding:0 26px;overflow:hidden;font-family:var(--font-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-dim)}.brand{display:none;align-items:center;gap:10px}.brand:hover{text-decoration:none}.brand-icon{display:block;width:28px;height:28px;filter:drop-shadow(0 2px 6px rgba(0,0,0,0.6))}.brand-logo{display:block;height:26px;width:auto}.nav-brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin:8px 0 16px;padding:0;min-height:0}.nav-brand:hover{text-decoration:none}.nav-brand-compass{width:76px;height:76px;filter:drop-shadow(0 6px 14px rgba(0,0,0,0.8));transition:transform 0.3s}.nav-brand:hover .nav-brand-compass{transform:rotate(-8deg)}.nav-brand-logo{width:100%;max-width:186px;height:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,0.8))}.bar-title{color:var(--accent-hi);letter-spacing:0.2em}.bar-status{display:flex;align-items:center;gap:10px;margin-left:auto}.signal{width:17px;height:14px;background:var(--line-strong);-webkit-mask:url("/static/ui/signal.png") center / contain no-repeat;mask:url("/static/ui/signal.png") center / contain no-repeat}.bar-status[data-online="true"] .signal{background:var(--signal)}.bar-status[data-online="true"] .status-label{color:var(--signal)}.bar-status[data-online="false"] .signal{background:var(--danger);animation:blink 1.2s steps(2) infinite}.bar-status[data-online="false"] .status-label{color:var(--danger)}.bar-status[data-configured="false"] .signal{background:var(--line-strong);animation:none}.bar-right{display:flex;align-items:center;gap:18px}.clock{color:var(--text);font-variant-numeric:tabular-nums}.bar-user{display:inline-flex;align-items:center;gap:8px;color:var(--text)}.bar-link{display:inline-flex;align-items:center;gap:6px;color:var(--accent-hi)}.btn.btn-bar{min-height:0;height:calc(100% - 14px);max-height:24px;padding:0 18px;justify-content:center;font-size:11px;letter-spacing:0.14em}.btn.btn-bar::before{inset:0}.avatar{width:22px;height:22px;border-radius:50%}.bar-logout{margin:0;display:flex;align-items:center;height:100%}.link-button{padding:0;border:0;background:none;color:var(--muted);font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer}.link-button:hover{color:var(--accent-hi)}.link-button.danger:hover{color:var(--danger)}.kpk-foot{position:absolute;z-index:11;left:calc(var(--frame-side) + 52px);right:calc(var(--frame-side) + 52px);bottom:calc(var(--frame-bottom) * 0.2);height:calc(var(--frame-bottom) * 0.5);display:flex;align-items:center;gap:12px;font:400 11px/1 var(--font-mono);letter-spacing:0.08em;text-transform:uppercase;color:var(--muted)}.foot-trefoil{width:12px;height:12px;color:var(--accent)}.foot-coords{margin-left:auto}.kpk-body{position:relative;height:100%;display:grid;grid-template-columns:var(--nav-width) 1fr;min-height:0;overflow:hidden;background:var(--bg);box-shadow:inset 0 0 0 1px rgba(0,0,0,0.8)}.kpk-body:has(.is-single){grid-template-columns:1fr}.kpk-bg{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--bg)}.kpk-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:72% 50%;opacity:0;transition:opacity 0.5s ease}.kpk-bg img.is-on,.kpk-bg img:only-of-type{opacity:1}.kpk-shade{position:absolute;inset:0;background:radial-gradient(ellipse at 55% 45%,transparent 25%,rgba(0,0,0,0.55) 100%)}.kpk[data-bg="tunnel"] .kpk-shade{background:linear-gradient(90deg,rgba(5,5,4,0.92) 0%,rgba(5,5,4,0.78) 34%,rgba(5,5,4,0.25) 58%,transparent 75%),linear-gradient(0deg,rgba(5,5,4,0.5),transparent 30%)}.kpk-body::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:rgba(232,226,207,0.07);-webkit-mask:url("/static/ui/grunge.png") center / cover no-repeat;mask:url("/static/ui/grunge.png") center / cover no-repeat}.kpk-body::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,0.02) 0 1px,transparent 1px 3px)}.kpk-nav{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;padding:24px 14px 22px 16px;background:linear-gradient(180deg,#0f0f0d,#090908);border-right:1px solid var(--line-strong);box-shadow:inset -1px 0 0 rgba(0,0,0,0.8)}.kpk-nav a:not(.nav-brand){position:relative;isolation:isolate;display:flex;align-items:center;gap:12px;min-height:52px;padding:0 16px 0 18px;color:var(--text);font:500 17px/1 var(--font-head);letter-spacing:0.1em;text-transform:uppercase;transition:color 0.15s}.kpk-nav a:not(.nav-brand)::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--text-dim);opacity:0.75;-webkit-mask:url("/static/ui/row.png") center / 100% 100% no-repeat;mask:url("/static/ui/row.png") center / 100% 100% no-repeat;transition:opacity 0.15s}.kpk-nav a:not(.nav-brand)::after{content:"";position:absolute;inset:3px 4px;z-index:-2;background:rgba(0,0,0,0.55)}.kpk-nav a:not(.nav-brand):hover{color:#fff;text-decoration:none}.kpk-nav a:not(.nav-brand):hover::before{opacity:1;background:var(--text)}.kpk-nav a:not(.nav-brand).is-active{color:#fff}.kpk-nav a:not(.nav-brand).is-active::before{background:var(--accent-hi);opacity:1;-webkit-mask-image:url("/static/ui/leftbar.png");mask-image:url("/static/ui/leftbar.png")}.kpk-nav a:not(.nav-brand).is-active::after{background:rgba(217,102,31,0.16)}.kpk-nav a:not(.nav-brand).is-soon{opacity:0.4;cursor:default;pointer-events:none}.kpk-nav .ic{width:22px;height:22px}.kpk-nav a:not(.nav-brand).is-active .ic{color:var(--accent-hi)}.kpk-nav .nav-arrow{display:none;margin-left:auto;width:12px;height:12px;color:var(--accent-hi)}.kpk-nav a:not(.nav-brand).is-active .nav-arrow{display:inline-block}.nav-spacer{flex:1}.kpk-screen{position:relative;z-index:1;min-height:0;overflow-y:auto;padding:clamp(24px,4vh,48px) clamp(24px,3.5vw,60px) 48px;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;outline:none}.ic{display:inline-block;width:1em;height:1em;flex:none;background:currentColor;-webkit-mask:var(--ic) center / contain no-repeat;mask:var(--ic) center / contain no-repeat;vertical-align:-0.15em}.ic-antenna{--ic:url("/static/ui/icon-antenna.png")}.ic-megaphone{--ic:url("/static/ui/icon-megaphone.png")}.ic-book{--ic:url("/static/ui/icon-book.png")}.ic-backpack{--ic:url("/static/ui/icon-backpack.png")}.ic-hood{--ic:url("/static/ui/icon-hood.png")}.ic-key{--ic:url("/static/ui/icon-key.png")}.ic-exit{--ic:url("/static/ui/icon-exit.png")}.ic-folder{--ic:url("/static/ui/icon-folder.png")}.ic-history{--ic:url("/static/ui/icon-history.png")}.ic-plug{--ic:url("/static/ui/icon-plug.png")}.ic-house{--ic:url("/static/ui/icon-house.png")}.ic-chevrons{--ic:url("/static/ui/icon-chevrons.png")}.ic-campfire{--ic:url("/static/ui/icon-campfire.png")}.ic-document{--ic:url("/static/ui/icon-document.png")}.ic-box{--ic:url("/static/ui/icon-box.png")}.ic-chain{--ic:url("/static/ui/icon-chain.png")}.ic-trefoil{--ic:url("/static/ui/trefoil.png")}.ic-map{--ic:url("/static/ui/icon-map.svg")}.ic-cross{--ic:url("/static/ui/cross.png")}.ic-arrow{--ic:url("/static/ui/arrow-right.png")}.ic-play{--ic:url("/static/ui/tri.svg")}.ic-down{--ic:url("/static/ui/arrow-down.png")}.eyebrow{margin:0 0 8px;font:500 11px/1 var(--font-mono);letter-spacing:0.28em;text-transform:uppercase;color:var(--accent-hi)}h1,h2,h3{font-family:var(--font-head);font-weight:500;text-transform:uppercase;letter-spacing:0.04em;color:var(--text);line-height:1.1}h1{margin:0;font-size:clamp(30px,3.4vw,44px)}h2{margin:0 0 14px;font-size:20px}h3{margin:24px 0 10px;font-size:17px}.screen-head{margin-bottom:26px}.divider{width:min(380px,100%);aspect-ratio:1600 / 102;margin:10px 0 0;background:var(--accent);opacity:0.9;-webkit-mask:url("/static/ui/divider.png") left center / 100% 100% no-repeat;mask:url("/static/ui/divider.png") left center / 100% 100% no-repeat}.muted{color:var(--muted)}.small{font-size:12px}.mono{font-family:var(--font-mono)}.note{font-size:13px;margin-top:20px}.lead{font-size:17px;color:var(--text-dim);max-width:60ch}.hint{display:inline;font:400 11px/1 var(--font-mono);color:var(--muted);letter-spacing:0.04em;text-transform:none;margin-left:8px}.ok{color:var(--signal)}.off{color:var(--danger)}.notice{padding:10px 14px;border-left:3px solid var(--signal);background:rgba(159,181,106,0.1);color:var(--text);max-width:560px}.notice.warn{border-color:var(--accent);background:var(--accent-soft)}.tag{display:inline-block;padding:2px 8px;border:1px solid var(--line-strong);font:500 10px/1.4 var(--font-mono);letter-spacing:0.14em;text-transform:uppercase;color:var(--muted)}.tag.ok{color:var(--signal);border-color:rgba(159,181,106,0.5)}.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:24px}.btn{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;min-height:46px;padding:0 44px 0 22px;border:0;background:none;color:#120f0a;font:500 15px/1 var(--font-head);letter-spacing:0.12em;text-transform:uppercase;cursor:pointer;--brush:url("/static/ui/brush-4.png");--brush-color:var(--accent)}.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--brush-color);-webkit-mask:var(--brush) center / 100% 100% no-repeat;mask:var(--brush) center / 100% 100% no-repeat;transition:background 0.15s,transform 0.15s}.btn:hover{text-decoration:none;color:#0d0b08}.btn:hover::before{background:var(--accent-hi)}.btn:active::before{transform:scale(0.97)}.btn:disabled{opacity:0.5;cursor:wait}.btn-ghost{color:var(--text);--brush:url("/static/ui/brush-5.png");--brush-color:rgba(232,226,207,0.3)}.btn-ghost:hover{color:var(--text)}.btn-ghost:hover::before{background:rgba(217,102,31,0.4)}.btn-danger{color:#140b08;--brush:url("/static/ui/brush-2.png");--brush-color:var(--danger)}.btn-danger:hover::before{background:#d8664a}.btn-ghost.btn-danger{color:var(--text);--brush-color:rgba(196,85,58,0.35)}.btn-ghost.btn-danger:hover::before{background:rgba(196,85,58,0.6)}.btn-sm{min-height:36px;padding:0 28px 0 16px;font-size:13px}.btn .ic{width:18px;height:18px}.plate,.panel,.transcript,.status-strip,.toc,.faction,.admin-box{padding:18px 22px;border:20px solid transparent;border-width:18px 22px;border-image:url("/static/ui/panel-cream.png") 12% 4% fill / 18px 22px stretch;background:var(--plate);background-clip:border-box;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.plate-orange{border-image-source:url("/static/ui/leftbar-orange.png");border-image-slice:30% 4% fill}label,.field{display:grid;gap:6px;margin-bottom:12px;font:500 11px/1.3 var(--font-mono);letter-spacing:0.1em;text-transform:uppercase;color:var(--text-dim);align-content:start}.field-label{display:block}input[type="text"],input[type="url"],input[type="search"],select,textarea{width:100%;padding:9px 12px;border:1px solid var(--line-strong);border-radius:0;background:rgba(4,5,3,0.75);color:var(--text);font:400 14px/1.45 var(--font-body);letter-spacing:0;text-transform:none}input.mono,textarea{font-family:var(--font-mono);font-size:13px}textarea{resize:vertical;min-height:60px}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:32px}select optgroup,select option{background:#121310;color:var(--text)}.check{display:flex;align-items:center;gap:10px;text-transform:none;letter-spacing:0.02em;font-size:13px;font-family:var(--font-body);color:var(--text-dim)}.check input{width:18px;height:18px;margin:0}input[type="checkbox"],input[type="radio"]{appearance:none;-webkit-appearance:none;width:18px;height:18px;margin:0;flex:none;cursor:pointer;background:var(--text-dim);-webkit-mask:url("/static/ui/check-off.png") center / contain no-repeat;mask:url("/static/ui/check-off.png") center / contain no-repeat}input[type="radio"]{-webkit-mask-image:url("/static/ui/radio-off.png");mask-image:url("/static/ui/radio-off.png")}input[type="checkbox"]:checked{background:var(--accent-hi);-webkit-mask-image:url("/static/ui/check-on.png");mask-image:url("/static/ui/check-on.png")}input[type="radio"]:checked{background:var(--accent-hi);-webkit-mask-image:url("/static/ui/radio-on.png");mask-image:url("/static/ui/radio-on.png")}.segmented input[type="radio"]{position:absolute;opacity:0;inset:0;width:100%;height:100%;mask:none;-webkit-mask:none}.paper{position:relative;color:var(--paper-ink);background:url("/static/ui/paper-kraft.webp") center / 100% 100% no-repeat;filter:drop-shadow(0 10px 18px rgba(0,0,0,0.55))}.paper-grid{background-image:url("/static/ui/paper-grid.webp")}.paper-lined{background-image:url("/static/ui/paper-lined.webp")}.paper-folded{background-image:url("/static/ui/paper-folded.webp")}.paper::after{content:"";position:absolute;top:-11px;left:16px;width:104px;height:38px;background:url("/static/ui/tape-yellow.webp") center / 100% 100% no-repeat;transform:rotate(-4deg);opacity:0.95;pointer-events:none}.paper.tape-blue::after{background-image:url("/static/ui/tape-blue.webp")}.paper.tape-gray::after{background-image:url("/static/ui/tape-gray.webp")}.paper h1,.paper h2,.paper h3{color:#1b1810}.paper p,.paper dd,.paper dt{color:#3b3222}.paper a{color:#8a3f10}.paper .ic{color:#3a2d1a}.corners{border:14px solid transparent;border-image:url("/static/ui/corners-bold.png") 30% / 14px}.prose ul{list-style:none;padding-left:20px}.prose ul li{position:relative}.prose ul li::before{content:"";position:absolute;left:-18px;top:0.5em;width:9px;height:9px;background:var(--accent);-webkit-mask:url("/static/ui/arrow-play.png") center / contain no-repeat;mask:url("/static/ui/arrow-play.png") center / contain no-repeat}.link-button .ic,.row-actions .ic,.bar-link .ic{width:11px;height:11px}@keyframes blink{50%{opacity:0.25}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}@media (max-height:820px),(max-width:1280px){:root{--frame-top:82px;--frame-side:54px;--frame-bottom:50px}.brand-icon{width:24px;height:24px}.nav-brand-compass{width:60px;height:60px}.nav-brand-logo{max-width:160px}.kpk-bar{font-size:11px;gap:16px;padding:0 20px}}@media (max-width:1100px){:root{--nav-width:190px}.kpk-nav a{font-size:14px;padding:0 10px 0 14px}.bar-title{display:none}}@media (max-width:760px){:root{--frame-top:0px;--frame-side:0px;--frame-bottom:0px}.kpk{padding:0;display:grid;grid-template-rows:auto 1fr}.kpk::before{display:none}.kpk-frame,.kpk-foot{display:none}.kpk-bar{position:static;height:auto;gap:12px;padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top));background:var(--chrome);border-bottom:1px solid var(--line)}.status-label,.clock{display:none}.kpk-body{grid-template-columns:1fr;grid-template-rows:1fr auto}.kpk-nav{order:2;flex-direction:row;gap:6px;padding:8px 10px;padding-bottom:max(8px,env(safe-area-inset-bottom));background:var(--chrome);border-top:1px solid var(--line);overflow-x:auto;scrollbar-width:none}.kpk-nav a{flex-direction:column;justify-content:center;gap:4px;min-height:54px;padding:0 12px;font-size:12px;white-space:nowrap}.kpk-nav .nav-arrow,.nav-brand{display:none}.brand{display:flex}.nav-spacer{display:none}.kpk-screen{padding:20px 16px 28px}}