*{box-sizing:border-box}
body{margin:0;background:#FDFAF4;color:#163223;font-family:'DM Sans',system-ui,sans-serif}
a{color:#163223}a:hover{color:#2D6A4F}
.wrap{width:100%;max-width:520px;margin:0 auto;padding:24px 16px 40px;display:flex;flex-direction:column;gap:28px}
.wrap.center{min-height:100vh;justify-content:center;align-items:center}
header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:-0.01em}
.brand.big{font-size:24px}
.logo{width:28px;height:28px;border-radius:8px;background:#163223;display:grid;place-items:center}
form{margin:0}
.allbtn{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;cursor:pointer;font:600 14px 'DM Sans',system-ui,sans-serif;background:#FFFFFF;color:#163223;border:1px solid #EAE6DE}
.allbtn.on{background:#163223;color:#FFFFFF;border-color:#163223}
.alldot{width:8px;height:8px;border-radius:50%;background:#3DA155}
.allbtn.on .alldot{background:#E8A817}
.pausedline{margin-top:-16px;font-size:13px;color:#8C877D}
.block{display:flex;flex-direction:column;gap:10px}
.label{font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:#8C877D}
.labelrow{display:flex;justify-content:space-between;align-items:baseline}
.count{font-family:'DM Mono',ui-monospace,monospace;font-size:12px;color:#8C877D}
.now{border-radius:20px;padding:20px;background:linear-gradient(135deg,#163223,#1A4A33);color:#FFFFFF;display:flex;flex-direction:column;gap:16px;position:relative;overflow:hidden}
.nowtop{display:flex;align-items:center;justify-content:space-between;gap:12px}
.nowid{font-family:'DM Mono',ui-monospace,monospace;font-size:13px;color:#C5C0B6;text-decoration:none}
.live{display:flex;align-items:center;gap:8px;font-family:'DM Mono',ui-monospace,monospace;font-size:13px;color:#8FD694}
.livedot{width:8px;height:8px;border-radius:50%;background:#8FD694;animation:hbpulse 2s infinite}
.now.paused .livedot{animation:none}
.nowtitle{font-size:20px;font-weight:600;line-height:1.25;text-wrap:balance}
.stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.step{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#C5C0B6}
.step.current{color:#FFFFFF;font-weight:600}
.bar{height:4px;border-radius:2px;background:rgba(255,255,255,.12);position:relative;overflow:hidden}
.step.done .bar{background:#8FD694}
.step.current .bar{background:rgba(143,214,148,.25)}
.sweep{position:absolute;top:0;left:0;height:100%;width:40%;border-radius:2px;background:#8FD694;animation:hbsweep 1.8s ease-in-out infinite}
.now.paused .sweep{animation:none}
.stagename{font-size:12px;color:#C5C0B6}
.nowlinks{display:flex;gap:16px;font-size:13px}
.nowlinks a{color:#FFFFFF;min-height:44px;display:inline-flex;align-items:center}
.idle,.empty{font-size:14px;color:#8C877D}
.idle{border:1px solid #EAE6DE;border-radius:20px;padding:20px;background:#FFFFFF}
.queue{background:#FFFFFF;border:1px solid #EAE6DE;border-radius:16px;display:flex;flex-direction:column}
.queue .empty{padding:16px}
.row{display:flex;align-items:center;gap:12px;padding:12px 10px 12px 16px}
.row+.row{border-top:1px solid #F0EFE9}
.row.dim{opacity:.45}
.dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:transparent;border:1px solid #C5C0B6}
.dot.urgent{background:#C74040;border-color:#C74040}
.dot.high{background:#E8A817;border-color:#E8A817}
.dot.medium{background:#4B685A;border-color:#4B685A}
.dot.low{background:#C5C0B6}
.rowtext{flex-grow:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rowhead{display:flex;gap:8px;align-items:baseline;min-width:0}
.rowid{font-family:'DM Mono',ui-monospace,monospace;font-size:12px;color:#8C877D;flex-shrink:0;text-decoration:none}
.rowtitle{font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meta{font-size:12px;color:#8C877D}
.meta.waiting{color:#B45309;font-weight:600}
.rowbtn{width:44px;height:44px;flex-shrink:0;border-radius:12px;border:0;cursor:pointer;display:grid;place-items:center;background:#F3EBDA}
.rowbtn.on{background:#D9F2C4}
.done{display:flex;flex-direction:column;gap:2px}
.donerow{display:flex;align-items:center;gap:10px;padding:8px 2px;text-decoration:none;color:#163223;min-height:44px}
.mark{width:6px;height:6px;border-radius:50%;flex-shrink:0;background:#3DA155}
.mark.review{background:#E8A817}
.donetitle{font-size:14px;flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.outcome{font-size:12px;color:#8C877D;flex-shrink:0}
.error{border:1px solid #E8C4C4;background:#FBEFEF;color:#7A2323;border-radius:16px;padding:16px;font-size:14px;overflow-wrap:anywhere}
.stale-note{display:none;text-align:center;font-size:13px;color:#B45309;margin:0 0 24px}
body.stale .stale-note{display:block}
.login{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:#163223;color:#FFFFFF;text-decoration:none;font-weight:600}
.message h1{font-size:20px;margin:0 0 8px}.message p{margin:0 0 16px;color:#4B685A}
@keyframes hbpulse{0%{box-shadow:0 0 0 0 rgba(143,214,148,.7)}70%{box-shadow:0 0 0 8px rgba(143,214,148,0)}100%{box-shadow:0 0 0 0 rgba(143,214,148,0)}}
@keyframes hbsweep{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
