:root{--bg:#14110f;--card:#1f1a17;--line:#3a312b;--fg:#ece3d6;--mut:#9a8f82;--red:#c8372d;--A:#3f9b5a;--B:#d3a032;--C:#c8372d}
*{box-sizing:border-box}[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.4 system-ui,sans-serif}
button,input,select,textarea{font:inherit;color:inherit}
button{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 14px;cursor:pointer}
button:hover{border-color:var(--mut)} button.on{border-color:var(--red);background:#2b1b18}
input,select,textarea{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 10px}
header{position:sticky;top:0;z-index:5;background:#0f0d0cee;border-bottom:1px solid var(--line);padding:10px 14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
header h1{font-size:16px;margin:0 10px 0 0;letter-spacing:.08em}header .sp{flex:1}
.counter{color:var(--mut)} .counter b{color:var(--fg)}
.bar{height:6px;background:var(--line);border-radius:3px;overflow:hidden;width:140px}.bar i{display:block;height:100%;background:var(--A)}
#grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;padding:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;cursor:pointer;position:relative}
.card:hover{border-color:var(--mut)}.card img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#000}
.card .meta{padding:8px 10px;font-size:13px}.card .meta small{color:var(--mut);display:block}
.card .dots{position:absolute;top:8px;right:8px;display:flex;gap:4px}
.dot{min-width:24px;height:24px;border-radius:12px;display:grid;place-items:center;font-weight:700;font-size:12px;color:#111;padding:0 5px}
.dot.A{background:var(--A)}.dot.B{background:var(--B)}.dot.C{background:var(--C);color:#fff}.dot.me{outline:2px solid #fff}
.dis{position:absolute;left:8px;top:8px;background:var(--red);color:#fff;border-radius:10px;font-size:11px;padding:2px 8px}
#review{position:fixed;inset:0;background:#0b0908;z-index:10;display:flex;flex-direction:column}
#review .top{display:flex;align-items:center;gap:8px;padding:8px 14px;border-bottom:1px solid var(--line)}
#panes{flex:1;min-height:0;display:flex}
.pane{flex:1;min-width:0;display:flex;flex-direction:column;border-right:1px solid var(--line)}.pane:last-child{border:0}
.pane .img{flex:1;min-height:120px;position:relative}.pane .img img{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);object-fit:contain}
.pane .ctl{padding:10px 14px;border-top:1px solid var(--line);display:grid;gap:8px}
.pane h3{margin:0;font-size:15px}.pane h3 small{color:var(--mut);font-weight:400}
.gbtn{display:flex;gap:8px}.gbtn button{flex:1;font-weight:700;font-size:17px;padding:10px}
.gbtn button[data-g=A].on{background:var(--A);color:#111}.gbtn button[data-g=B].on{background:var(--B);color:#111}.gbtn button[data-g=C].on{background:var(--C);color:#fff}
.gbtn small{font-weight:400;font-size:11px;opacity:.7;display:block}
.checks{display:flex;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--mut)}.checks label{display:flex;gap:5px;align-items:center}
.revs{font-size:12px;color:var(--mut);max-height:70px;overflow:auto}.revs b{color:var(--fg)}
textarea{width:100%;height:54px;resize:vertical}
#msg{color:var(--mut);font-size:13px}
.login{max-width:340px;margin:12vh auto;padding:20px;display:grid;gap:10px}.login h1{margin:0 0 6px;font-size:20px}
.err{color:#ff8a80;min-height:1.2em}
@media(max-width:700px){#panes{flex-direction:column}.pane{border-right:0;border-bottom:1px solid var(--line)}header h1{display:none}}

a.nav{color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:8px 14px;text-decoration:none}a.nav:hover{border-color:var(--mut)}
.card.audio{min-height:150px}.aface{display:grid;grid-template-columns:44px 1fr;gap:6px 10px;padding:12px;aspect-ratio:16/10;align-content:start;background:#17130f}
.play{width:44px;height:44px;border-radius:22px;padding:0;font-size:16px;background:var(--red);border:0;color:#fff}.ainfo{display:grid;align-content:center}.ainfo small{color:var(--mut)}
.atx{grid-column:1/3;font-size:12px;color:var(--mut);overflow:hidden;max-height:3.9em}
.abig{display:grid;gap:10px;place-content:center;justify-items:center;text-align:center;max-width:560px;margin:auto;padding:12px}.abig b{font-size:22px}.abig small{color:var(--mut)}.abig audio{width:min(480px,90vw)}
.abig .tx{font-size:14px;color:var(--fg);margin:0;max-height:140px;overflow:auto}.abig .rev{color:var(--B);margin:0;font-weight:600}
.pane .img.audio{display:grid;place-items:center}
.abig .tx{white-space:pre-wrap;text-align:left;max-height:260px;overflow:auto;width:min(560px,92vw);line-height:1.5}
