/* devin-bundle // atlas — phosphor CRT terminal */
:root{
  --bg:#050807; --panel:#0a140d; --panel2:#0d1a10; --line:#16351e;
  --fg:#d8ffd8; --dim:#4a8f5a; --green:#33ff66; --amber:#ffb000;
  --cyan:#45d8d0; --red:#ff5555; --mono:ui-monospace,"Cascadia Code","JetBrains Mono",Consolas,"Liberation Mono",monospace;
}
html[data-theme="amber"]{
  --bg:#0a0600; --panel:#140d02; --panel2:#1a1105; --line:#3a2908;
  --fg:#ffe9c8; --dim:#93783f; --green:#ffb000; --amber:#ffdd66;
  --cyan:#e8b84a; --red:#ff6644;
}
html[data-theme="mono"]{
  --bg:#0a0a0a; --panel:#111111; --panel2:#161616; --line:#2e2e2e;
  --fg:#e8e8e8; --dim:#888888; --green:#e8e8e8; --amber:#c8c8c8;
  --cyan:#aaaaaa; --red:#cccccc;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font-family:var(--mono); font-size:15px; line-height:1.6;
  min-height:100vh; display:flex; flex-direction:column;
}
::selection{background:var(--green);color:var(--bg)}
:focus-visible{outline:1px solid var(--green);outline-offset:2px}
mark{background:var(--green);color:var(--bg);padding:0 .1em}
a{color:var(--cyan)}
code{color:var(--amber);background:none;font-family:inherit}
kbd{border:1px solid var(--line);padding:0 .35em;border-radius:3px;background:var(--panel);font-family:inherit;font-size:.85em}
hr{border:0;border-top:1px dashed var(--line);margin:1.2em 0}

/* CRT overlay — static, cheap */
.crt{position:fixed;inset:0;pointer-events:none;z-index:60;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.07) 0 1px,transparent 1px 3px)}

#palette[hidden],#modal[hidden]{display:none}
#matrix-rain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.85}

.skip{position:fixed;top:-4em;left:8px;z-index:100;background:var(--green);
  color:var(--bg);padding:4px 12px;font-weight:700;transition:top .12s}
.skip:focus{top:8px}

/* title bar + tabs */
.titlebar{display:flex;align-items:center;gap:14px;padding:9px 16px;
  background:var(--panel);border-bottom:1px solid var(--line)}
.dots i{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:6px}
.dots i:nth-child(1){background:var(--red)}
.dots i:nth-child(2){background:var(--amber)}
.dots i:nth-child(3){background:var(--green)}
.tb-title{color:var(--dim)}
.tb-meta{margin-left:auto;color:var(--dim);font-size:.85em}
.tb-btn{margin-left:auto;background:none;border:1px solid var(--line);color:var(--dim);
  font:inherit;font-size:.85em;padding:1px 10px;border-radius:3px;cursor:pointer}
.tb-btn:hover{color:var(--green);border-color:var(--green)}
.tb-btn + .tb-meta{margin-left:12px}
.tb-meta b{color:var(--amber)}

.statusline{display:flex;gap:0;flex-wrap:wrap;background:var(--panel);
  border-bottom:1px solid var(--line);padding:0 8px}
.statusline button{
  font:inherit;color:var(--dim);background:none;border:0;cursor:pointer;
  padding:9px 14px;border-right:1px solid var(--line)}
.statusline button::before{content:"› "}
.statusline .tn{color:var(--cyan);font-size:.72em;margin-left:.5em;vertical-align:.15em}
.statusline button[aria-selected="true"] .tn{color:var(--bg)}
.statusline button[aria-selected="true"]{color:var(--bg);background:var(--green)}
.statusline button:hover:not([aria-selected="true"]){color:var(--fg)}
.statusline button:focus-visible{outline:2px solid var(--amber);outline-offset:-2px}

/* layout */
main{flex:1;max-width:1200px;width:100%;margin:0 auto;padding:28px 20px 60px}
.view{animation:vin .18s ease-out}
@keyframes vin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.view{animation:none}}

/* hero */
.logo{color:var(--green);font-size:clamp(7px,1.55vw,15px);line-height:1.15;
  text-shadow:0 0 12px color-mix(in srgb,var(--green) 35%,transparent);margin:0 0 18px;overflow-x:auto}
.bootlog{color:var(--fg);white-space:pre-wrap;min-height:15em;margin:0}
.bootlog .ok{color:var(--green)}
.bootlog .warn{color:var(--amber)}
.bootlog .dim{color:var(--dim)}
.bootlog .amber{color:var(--amber)}
.bootlog .cursor{display:inline-block;width:.6em;height:1.05em;background:var(--green);
  vertical-align:-.15em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hint{color:var(--dim);font-size:.85em;margin-top:22px}
.lnk{font:inherit;background:none;border:0;color:var(--dim);cursor:pointer;padding:0}
.lnk:hover{color:var(--green)}

/* hero find on boot */
.hero-find{display:flex;align-items:baseline;gap:10px;margin-top:26px;
  border-bottom:1px dashed var(--line);padding-bottom:10px}
.hero-find input{flex:0 1 40em;background:var(--panel);border:1px solid var(--line);
  color:var(--green);font:inherit;padding:8px 12px;caret-color:var(--green);font-size:1.05em}
.hero-find input:focus{outline:2px solid var(--green)}
#hero-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:8px;margin-top:12px}
#hero-results .hcard{border:1px solid var(--line);background:var(--panel);
  padding:9px 13px;cursor:pointer;text-align:left;font:inherit;color:var(--fg);
  display:block;width:100%}
#hero-results .hcard:hover,#hero-results .hcard:focus-visible{border-color:var(--green);outline:none}
#hero-results .hk{display:inline-block;color:var(--amber);font-size:.72em;
  border:1px solid var(--amber);padding:0 .4em;margin-right:.6em;vertical-align:.15em}
#hero-results .hn{color:var(--green);font-weight:700}
#hero-results .hd{display:block;color:var(--dim);font-size:.8em;margin-top:3px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#hero-results .hnone{grid-column:1/-1;color:var(--dim)}

/* conversion CTA on boot */
.cta{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
  border:1px solid var(--green);background:var(--panel);
  box-shadow:0 0 24px color-mix(in srgb,var(--green) 12%,transparent);
  padding:12px 16px;margin-top:24px;font-size:.92em}
.cta .cta-lead{color:var(--amber);font-weight:700}
.cta code{color:var(--fg);word-break:break-all}
.cta #cta-copy{font:inherit;background:none;border:1px solid var(--line);
  color:var(--dim);cursor:pointer;padding:1px 8px}
.cta #cta-copy:hover{color:var(--green);border-color:var(--green)}
.cta #cta-copy.copied{color:var(--green);border-color:var(--green)}
.cta .cta-repo{color:var(--cyan);margin-left:auto;text-decoration:none;white-space:nowrap}
.cta .cta-repo:hover{text-decoration:underline}

/* grep row + cards */
.grep{display:flex;align-items:baseline;gap:10px;color:var(--fg);
  border-bottom:1px dashed var(--line);padding-bottom:12px;margin-bottom:20px}
.prompt{color:var(--green)}
.grep input{flex:0 1 34em;background:var(--panel);border:1px solid var(--line);
  color:var(--green);font:inherit;padding:6px 10px;caret-color:var(--green)}
.grep input:focus{outline:2px solid var(--green)}
.grep .count{margin-left:auto;color:var(--dim);font-size:.85em;white-space:nowrap}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:-8px 0 16px}
.chips button{font:inherit;font-size:.78em;background:none;border:1px dashed var(--line);
  color:var(--dim);cursor:pointer;padding:1px 10px}
.chips button:hover{color:var(--green);border-color:var(--green)}
.chips button.on{color:var(--green);border-style:solid;border-color:var(--green)}
.sort{margin-left:10px}
.sort button{font:inherit;font-size:.78em;background:none;border:1px solid var(--line);
  color:var(--dim);cursor:pointer;padding:1px 8px}
.sort button:hover{color:var(--green);border-color:var(--green)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.card{border:1px solid var(--line);background:var(--panel);padding:14px 16px;
  cursor:pointer;transition:border-color .12s;text-align:left;font:inherit;color:var(--fg)}
.card:hover,.card:focus-visible{border-color:var(--green);outline:none}
.card .cname{color:var(--green);font-weight:700;display:block;margin-bottom:6px}
.card .cname::before{content:"./"}
.card .cdesc{color:var(--fg);opacity:.82;font-size:.88em;display:-webkit-box;
  -webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .cmeta{color:var(--dim);font-size:.78em;margin-top:8px}
.card .tag{display:inline-block;border:1px solid var(--line);color:var(--dim);
  padding:0 .4em;margin-right:.4em;font-size:.72em}
.card .tag.am{color:var(--amber);border-color:var(--amber)}
.card .tag.cy{color:var(--cyan);border-color:var(--cyan)}

/* hooks pipeline */
.evt{margin-bottom:26px}
.evt h3{color:var(--amber);margin:0 0 10px;font-size:1em}
.evt h3::before{content:":: ";color:var(--dim)}
.lane{display:grid;grid-template-columns:1fr;gap:0}
.hkrow{display:grid;grid-template-columns:minmax(140px,240px) 30px 1fr;
  align-items:center;padding:7px 0;border-bottom:1px dotted var(--line)}
.hkrow .match{color:var(--cyan);font-size:.88em;word-break:break-all}
.hkrow .arrow{color:var(--dim);text-align:center}
.hkrow .cmd{color:var(--fg);font-size:.88em;word-break:break-all}
.badge{display:inline-block;font-size:.72em;border:1px solid var(--line);
  color:var(--dim);padding:0 .4em;margin-left:.6em;vertical-align:.1em}
.badge.fc{color:var(--red);border-color:var(--red)}
.badge.to{color:var(--dim)}

/* scripts */
#script-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:10px}
.srow{border:1px solid var(--line);padding:10px 14px;background:var(--panel)}
.srow .sf{color:var(--green);font-size:.9em}
.srow .sd{color:var(--fg);opacity:.8;font-size:.84em;margin-top:4px}
.srow .sl{color:var(--dim);font-size:.75em;margin-top:4px}

/* reader */
.reader{display:grid;grid-template-columns:minmax(200px,260px) 1fr;gap:0;
  border:1px solid var(--line);min-height:60vh}
.reader aside{border-right:1px solid var(--line);background:var(--panel);
  max-height:80vh;overflow-y:auto;padding:10px 0}
.reader aside button{display:block;width:100%;text-align:left;font:inherit;
  background:none;border:0;color:var(--dim);padding:6px 14px;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reader aside button:hover{color:var(--fg)}
.reader aside button[aria-current="true"]{color:var(--green);background:var(--panel2)}
.reader aside button[aria-current="true"]::before{content:"› "}
.doc{padding:22px 26px;max-height:80vh;overflow-y:auto}
.doc h1{color:var(--green);font-size:1.3em;margin:.4em 0 .6em}
.doc h2{color:var(--amber);font-size:1.05em;margin:1.4em 0 .5em}
.doc h3,.doc h4{color:var(--cyan);font-size:.98em;margin:1.2em 0 .4em}
.doc p,.doc li{opacity:.92}
.doc code{font-size:.92em}
.doc pre.codeblock{background:var(--panel2);border:1px solid var(--line);
  padding:12px 14px;overflow-x:auto;font-size:.85em}
.doc pre.mermaid{background:#f5fff8;color:#111;padding:14px;overflow-x:auto;
  border:1px solid var(--line)}
.doc table{border-collapse:collapse;font-size:.86em;width:100%}
.doc th,.doc td{border:1px solid var(--line);padding:5px 10px;text-align:left}
.doc th{color:var(--amber);background:var(--panel)}
.doc img{max-width:100%}

/* changelog */
#changelog-log .rel{border-left:2px solid var(--line);padding:0 0 26px 20px;position:relative}
#changelog-log .rel::before{content:"◆";color:var(--green);position:absolute;left:-8px;top:0;background:var(--bg)}
#changelog-log .rv{color:var(--green);font-weight:700}
#changelog-log .rd{color:var(--dim);font-size:.85em;margin-left:10px}
#changelog-log .rentries{color:var(--dim);font-size:.8em;margin-left:10px}
#changelog-log .doc{padding:8px 0 0;max-height:none;overflow:visible}

/* footer prompt + repl */
.promptline{display:flex;gap:6px;align-items:baseline;padding:10px 16px;border-top:1px solid var(--line);
  position:sticky;bottom:0;z-index:41;background:var(--panel);color:var(--fg);font-size:.9em}
.promptline .path{color:var(--cyan)}
#repl{flex:1;background:none;border:0;color:var(--fg);font:inherit;outline:none;caret-color:var(--green)}
#repl::placeholder{color:var(--dim)}
#repl-out{max-height:34vh;overflow-y:auto;padding:8px 16px;border-top:1px solid var(--line);
  position:sticky;bottom:45px;z-index:40;
  background:var(--panel);font-size:.85em;white-space:pre-wrap;line-height:1.5}
#repl-out .r-cmd{color:var(--green)}
#repl-out .r-dim{color:var(--dim)}
#repl-out .r-err{color:var(--red)}
#repl-out .r-cyan{color:var(--cyan)}
#repl-out .r-amber{color:var(--amber)}

/* palette + modal */
#palette,#modal{position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:80;
  display:flex;align-items:flex-start;justify-content:center;padding-top:14vh}
.pal-box{width:min(640px,92vw);background:var(--panel);border:1px solid var(--green);
  box-shadow:0 0 40px color-mix(in srgb,var(--green) 18%,transparent)}
.pal-line{display:flex;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line)}
.pal-line input{flex:1;background:none;border:0;color:var(--fg);font:inherit}
.pal-line input:focus{outline:none}
#pal-results{max-height:46vh;overflow-y:auto}
#pal-results button{display:block;width:100%;text-align:left;font:inherit;
  background:none;border:0;color:var(--fg);padding:8px 16px;cursor:pointer}
#pal-results button:hover,#pal-results button.sel{background:var(--panel2);color:var(--green)}
#pal-results .sub{color:var(--dim);font-size:.8em;margin-left:1em}
.modal-box{width:min(900px,94vw);max-height:78vh;background:var(--panel);
  border:1px solid var(--green);display:flex;flex-direction:column;
  box-shadow:0 0 40px color-mix(in srgb,var(--green) 18%,transparent)}
.modal-bar{display:flex;align-items:center;justify-content:space-between;
  padding:10px 16px;border-bottom:1px solid var(--line);color:var(--amber)}
#modal-close,#modal-link{font:inherit;background:none;border:0;color:var(--dim);cursor:pointer}
#modal-close:hover,#modal-link:hover{color:var(--green)}
.modal-actions{display:flex;gap:14px}
#modal-body{overflow-y:auto}

@media (max-width:560px){
  main{padding:18px 12px 60px}
  .grid{grid-template-columns:1fr}
  #script-list{grid-template-columns:1fr}
  #hero-results{grid-template-columns:1fr}
  .hero-find input{flex:1;min-width:0}
  .cta{gap:8px;padding:10px 12px}
  .cta .cta-repo{margin-left:0}
  .tb-meta{display:none}
  .statusline button{padding:8px 9px}
  .tbl{font-size:.75em}
  .modal-box{max-height:86vh}
  .bootlog{min-height:11em;font-size:.85em}
}
@media (max-width:820px){
  .reader{grid-template-columns:1fr}
  .reader aside{max-height:200px;border-right:0;border-bottom:1px solid var(--line)}
  .hkrow{grid-template-columns:1fr}
  .hkrow .arrow{display:none}
}
@media (prefers-reduced-motion:reduce){
  .bootlog .cursor{animation:none}
  *{scroll-behavior:auto;transition:none!important}
}

/* issues board */
#issues-board .rel{border-left:2px solid var(--line);padding:0 0 26px 20px;position:relative}
#issues-board .rel::before{content:"◆";color:var(--green);position:absolute;left:-8px;top:0;background:var(--bg)}
#issues-board .tbl{border-collapse:collapse;font-size:.85em;width:100%;margin-top:8px}
#issues-board .tbl td{padding:2px 10px 2px 0;border-bottom:1px dashed var(--line);vertical-align:top}
#issues-board .mono{color:var(--dim);white-space:nowrap}
#issues-board .st.ok{color:var(--green)}
#issues-board .st.op{color:var(--amber,#ffb454)}
#issues-board .pri{border:1px solid var(--line);padding:0 4px;font-size:.8em}
#issues-board .pri.pP1{color:var(--red,#ff5555)}
#issues-board .pri.pP2{color:var(--amber,#ffb454)}
#issues-board .pri.pP3{color:var(--dim)}