Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
28 lines
2.7 KiB
CSS
28 lines
2.7 KiB
CSS
:root{--bg:#000;--panel:#0a0a0a;--raise:#121212;--line:#1e1e1e;--ink:#f2f2f2;--ink2:#bdbdbd;--mut:#7d7d7d;--acc:#3ddc84;--wave:#3a3a3a;--waveOn:#3ddc84}
|
|
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
|
|
main{max-width:760px;margin:0 auto;padding:28px 16px 120px}
|
|
.kicker{font:600 11px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin:0 0 10px}
|
|
h1{font-size:24px;line-height:1.2;margin:0;font-weight:650;letter-spacing:-.01em}
|
|
.meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:10px 0 22px;color:var(--ink2);font-size:13.5px}
|
|
.badge{border:1px solid;border-radius:4px;padding:1px 7px;font-size:12px}
|
|
.g-avia{color:#7fb7ff}.g-marine{color:#3ddc84}.g-pmr{color:#ffb454}.g-lpd{color:#ff8a65}.g-ham{color:#c792ea}.g-rail{color:#ddd}.g-other{color:#aaa}
|
|
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
|
|
.bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
|
|
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--acc);color:#04120a;border:0;border-radius:8px;padding:10px 16px;font:650 14px system-ui;cursor:pointer}
|
|
.btn.ghost{background:none;color:var(--ink2);border:1px solid var(--line)}
|
|
.sum{color:var(--mut);font-size:13px}
|
|
.conv{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}
|
|
.row{display:grid;grid-template-columns:40px 74px minmax(0,1fr) 56px 32px;gap:12px;align-items:center;padding:10px 12px;cursor:pointer;border-left:3px solid transparent}
|
|
.row:hover{background:var(--raise)}.row.me{border-left-color:var(--acc);background:#06140c}
|
|
.row.playing .pp{background:var(--acc);color:#04120a;border-color:var(--acc)}
|
|
.pp{width:34px;height:34px;border-radius:50%;border:1px solid #2a2a2a;background:none;color:var(--ink);display:grid;place-items:center;font-size:12px;cursor:pointer}
|
|
.t{font:500 13.5px/1.2 ui-monospace,monospace}.t small{display:block;color:var(--acc);font:600 10.5px/1.6 system-ui;letter-spacing:.04em;text-transform:uppercase}
|
|
.wave{height:36px;width:100%;display:block}
|
|
.d{text-align:right;color:var(--ink2);font:13px ui-monospace,monospace}
|
|
.dl{color:var(--mut);text-decoration:none;text-align:center;font-size:16px}.dl:hover{color:var(--ink)}
|
|
.gap{padding:3px 12px 3px 138px;color:var(--mut);font-size:12px;border-top:1px dashed #161616;border-bottom:1px dashed #161616;background:#050505}
|
|
.gap.miss{color:#ffb454}
|
|
.foot{margin-top:18px;color:var(--mut);font-size:12.5px}
|
|
.err{color:#ff8a8a}
|
|
@media (max-width:560px){.row{grid-template-columns:36px 64px minmax(0,1fr) 44px;gap:8px}.row .dl{display:none}.gap{padding-left:116px}}
|