:root { color-scheme:dark; --ink:#10072c; --white:#fff7ff; --muted:#c4b2e9; --cyan:#0afbfc; --lime:#93f041; }
* { box-sizing:border-box; } body { margin:0; color:var(--white); background:radial-gradient(ellipse at top right,#4e1ed6 0,#23105b 45%,#10072c 100%); font:14px/1.6 ui-monospace,"Cascadia Code",Consolas,monospace; }
main { max-width:1280px; margin:auto; padding:clamp(20px,4vw,48px); padding-bottom:calc(32px + env(safe-area-inset-bottom)); }
header { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-bottom:20px; border-bottom:1px solid #754bd4; }
h1 { font-size:clamp(25px,4vw,40px); margin:4px 0; letter-spacing:2px; } h2 { margin:0 0 16px; font-size:16px; letter-spacing:1px; } h2 span { font-weight:400; font-size:11px; color:var(--muted); } h3 { margin:0; font-size:18px; }
.eyebrow { color:var(--lime); font-size:11px; letter-spacing:3px; margin:0; } .subtitle { color:var(--muted); margin:6px 0 18px; } nav { display:flex; gap:10px; flex-wrap:wrap; } a { color:var(--cyan); text-underline-offset:3px; } nav a,button,.build a { border:1px solid #a780ff; background:#1c0a45; color:var(--white); padding:10px 14px; font:inherit; font-size:12px; min-height:44px; text-decoration:none; border-radius:3px; display:inline-flex; align-items:center; } button { cursor:pointer; } button:hover,nav a:hover,.build a:hover { border-color:var(--lime); } a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid var(--lime); outline-offset:4px; }
#status { color:var(--cyan); font-size:12px; min-height:20px; } .error { color:#ffadc6!important; } section { margin-top:30px; }
.summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; } .metric { background:#17093ec4; border:1px solid #6c46ae; padding:16px; } .metric strong { display:block; font-size:30px; color:var(--lime); } .metric span { font-size:11px; color:var(--muted); }
.stages { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } .stage { background:#1a0b45ce; border:1px solid #633ca2; padding:16px; } .stage.done { border-color:#77bc38; } .stage .number { color:var(--cyan); font-size:11px; } .stage h3 { font-size:14px; margin:7px 0; } .stage p { font-size:12px; color:var(--muted); margin:6px 0 0; } progress { width:100%; height:6px; border:0; appearance:none; display:block; margin:10px 0; } progress::-webkit-progress-bar { background:#10072c; } progress::-webkit-progress-value { background:var(--lime); } progress::-moz-progress-bar { background:var(--lime); }
.lane-counts { display:flex; flex-wrap:wrap; gap:5px; font-size:10px; } .pill { border:1px solid #7852b3; padding:1px 5px; color:#ded0fc; }
.builds { display:flex; flex-wrap:wrap; gap:12px; } .build { flex:1 1 220px; padding:16px; border:1px solid #7246b4; background:#180a3c; } .build h3 { color:var(--lime); margin-bottom:5px; } .build p { font-size:11px; color:var(--muted); } .build a { color:var(--cyan); }
.source { margin-top:20px; padding:20px; background:#120731dc; border:1px solid #784ac4; } .source-header { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px; } .source-header small { color:var(--cyan); } .source-header a { font-size:12px; } .lane { border-top:1px solid #483074; padding:10px 0; } summary { cursor:pointer; min-height:44px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; } summary strong { color:var(--white); } summary span { color:var(--muted); font-size:12px; } .task-list { list-style:none; padding:0; margin:0 0 12px; } .task-list li { display:flex; gap:9px; padding:8px 10px; margin:4px 0; font-size:12px; background:#29105a; overflow-wrap:anywhere; } .task-list .done { background:#203818; } .mark { flex:none; color:var(--lime); } .task-list li:not(.done) .mark { color:#9c81bf; } .bug-log { border-top:1px solid #483074; margin-top:8px; padding-top:10px; } pre { white-space:pre-wrap; overflow-wrap:anywhere; font:12px/1.7 ui-monospace,Consolas,monospace; background:#10072c; padding:14px; max-height:420px; overflow:auto; } .empty { color:var(--muted); } footer { margin-top:32px; font-size:11px; color:var(--muted); border-top:1px solid #49316c; padding-top:16px; }
@media(max-width:800px) { .stages { grid-template-columns:repeat(2,minmax(0,1fr)); } .summary { grid-template-columns:repeat(2,1fr); } header { flex-direction:column; align-items:flex-start; } }
@media(max-width:480px) { .stages { grid-template-columns:1fr; } main { padding:20px 16px; } .source { padding:14px; } }
.run-table { width:100%; border-collapse:collapse; font-size:12px; background:#180a3c; } .run-table th,.run-table td { padding:12px; text-align:left; border-bottom:1px solid #483074; font-variant-numeric:tabular-nums; } .run-table th { color:var(--cyan); font-size:11px; } @media(max-width:480px) { .run-table th,.run-table td { padding:8px 5px; font-size:10px; } }