:root{color-scheme:dark;--bg: #04090d;--bg2: #060d13;--panel: #0a1319;--panel2: #0e1a22;--line: rgba(62, 245, 194, .22);--line-strong: rgba(62, 245, 194, .55);--phos: #3ef5c2;--phos-dim: #1f9c80;--phos-faint: rgba(62, 245, 194, .1);--amber: #ffb454;--danger: #ff6b5e;--text: #c9f7ea;--muted: #4f6f74;--mono: "Cascadia Code", "JetBrains Mono", "SF Mono", Consolas, "Courier New", "PingFang SC", "Microsoft YaHei", monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--mono);-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9998;box-shadow:inset 0 0 120px #000000b8}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999;background:repeating-linear-gradient(0deg,rgba(0,0,0,.14) 0 1px,transparent 1px 3px);opacity:.5}body{background:radial-gradient(ellipse at 50% -12%,rgba(62,245,194,.07),transparent 62%),radial-gradient(ellipse at 50% 118%,rgba(31,156,128,.06),transparent 60%),var(--bg)}.app{max-width:560px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column}.content{flex:1;padding:16px 16px 92px;overflow-y:auto}.page{animation:fadeIn .22s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}h2{font-family:var(--mono);font-size:15px;letter-spacing:.2em;color:var(--phos);text-shadow:0 0 10px rgba(62,245,194,.4);border-bottom:1px solid var(--line);padding-bottom:8px;margin:0 0 14px}.sub{color:var(--muted);margin:4px 0 16px;font-size:13px;letter-spacing:.04em}.muted{color:var(--muted)}.readout{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--muted)}.hero{text-align:center;padding:10px 0 2px}.hero-top{display:flex;align-items:center;justify-content:center;gap:10px;font-size:10px;letter-spacing:.3em}.hero-id{color:var(--muted);letter-spacing:.28em}.hero-title{font-family:var(--mono);font-size:30px;letter-spacing:.18em;margin:12px 0 2px;color:var(--phos);text-shadow:0 0 14px rgba(62,245,194,.55),0 0 44px rgba(62,245,194,.2)}.hero-sub{font-size:11px;letter-spacing:.22em;color:var(--muted);margin:0 0 4px}.lamp{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--muted);flex:none}.lamp.ok{background:var(--phos);box-shadow:0 0 9px var(--phos);animation:lamp 2.4s ease-in-out infinite}.lamp.warn{background:var(--amber);box-shadow:0 0 9px var(--amber);animation:blink 1s steps(2) infinite}@keyframes lamp{0%,to{opacity:1}50%{opacity:.35}}.scope-wrap{display:flex;flex-direction:column;align-items:center;margin:14px 0 4px}.scope{position:relative;width:172px;height:172px;border-radius:50%;border:1px solid var(--line-strong);background:radial-gradient(circle at 50% 50%,rgba(62,245,194,.55) 0 2px,transparent 3px),radial-gradient(circle at 50% 50%,transparent 0 23%,rgba(62,245,194,.1) 23% 23.4%,transparent 23.6% 48%,rgba(62,245,194,.1) 48% 48.4%,transparent 48.6% 72%,rgba(62,245,194,.12) 72% 72.4%,transparent 72.6%),radial-gradient(circle at 50% 50%,transparent 66%,rgba(62,245,194,.1) 66% 66.3%,transparent 66.5%),linear-gradient(90deg,transparent 49.6%,rgba(62,245,194,.12) 49.6% 50.4%,transparent 50.4%),linear-gradient(0deg,transparent 49.6%,rgba(62,245,194,.12) 49.6% 50.4%,transparent 50.4%),var(--bg2);overflow:hidden}.scope:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(62,245,194,.4),rgba(62,245,194,.06) 70deg,transparent 130deg);animation:sweep 3.6s linear infinite}@keyframes sweep{to{transform:rotate(360deg)}}.blip{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--phos);box-shadow:0 0 8px var(--phos);animation:blip 2.6s ease-out infinite}@keyframes blip{0%,to{box-shadow:0 0 4px var(--phos)}70%{box-shadow:0 0 16px var(--phos)}}.scope-readout{display:flex;gap:22px;margin-top:8px;font-size:10px;letter-spacing:.22em;color:var(--phos-dim)}.caption{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.28em;color:var(--phos-dim);margin:18px 0 8px}.caption:before{content:"";width:18px;height:1px;background:var(--phos-dim)}.caption:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(62,245,194,.25),transparent)}.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 4px}.stat{position:relative;background:linear-gradient(180deg,rgba(62,245,194,.05),transparent 45%),var(--panel);border:1px solid var(--line);padding:12px 14px}.stat:before{content:"";position:absolute;top:8px;right:8px;width:5px;height:5px;border-radius:50%;background:var(--phos);box-shadow:0 0 6px var(--phos);opacity:.8}.stat .v{font-family:var(--mono);font-size:26px;font-weight:600;color:var(--phos);text-shadow:0 0 12px rgba(62,245,194,.45)}.stat .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--muted);margin-top:2px}.stat.warn:before{background:var(--amber);box-shadow:0 0 7px var(--amber);animation:blink 1s steps(2) infinite}.stat.warn .v{color:var(--amber);text-shadow:0 0 12px rgba(255,180,84,.5)}@keyframes blink{50%{opacity:.15}}.actions{display:flex;flex-direction:column;gap:12px;margin-top:20px}.btn{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--panel2);color:var(--text);padding:14px 16px;font-size:14px;font-family:var(--mono);letter-spacing:.1em;cursor:pointer;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));transition:filter .15s,transform .05s}.btn:active{filter:brightness(1.4);transform:translateY(1px)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.primary{color:var(--phos);background:linear-gradient(180deg,#3ef5c22e,#3ef5c20a),var(--panel2);border-color:var(--line-strong);text-shadow:0 0 10px rgba(62,245,194,.6);filter:drop-shadow(0 0 10px rgba(62,245,194,.25))}.btn.primary:active{filter:brightness(1.45) drop-shadow(0 0 10px rgba(62,245,194,.35))}.btn.ghost{background:transparent}.btn.small{padding:8px 12px;font-size:12px;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}.btn.full{width:100%}.btn-ic{font-size:12px;color:var(--phos-dim)}textarea,.input{width:100%;background:#04090d99;border:1px solid var(--line);border-left:3px solid var(--phos-dim);border-radius:0;color:var(--text);padding:12px;font-size:14px;font-family:var(--mono);line-height:1.7;resize:none}textarea:focus,.input:focus{outline:none;border-color:var(--line-strong);box-shadow:0 0 0 1px #3ef5c21f,0 0 18px #3ef5c214}.tape textarea{display:block}.tape-foot{display:flex;justify-content:space-between;align-items:center;padding:6px 2px 14px}.notice,.banner{border:1px solid rgba(62,245,194,.4);background:#3ef5c212;color:var(--phos);padding:10px 12px;margin:12px 0;font-size:13px;line-height:1.6}.notice:before{content:"SYS · ";color:var(--phos-dim)}.notice.ok:before{content:"ACK · ";color:var(--phos-dim)}.banner{color:#ff9d93;border-color:#ff6b5e80;background:#ff6b5e14}.banner:before{content:"ALERT · ";color:#ff6b5eb3}.card{position:relative;background:linear-gradient(180deg,rgba(62,245,194,.04),transparent 40%),var(--panel);border:1px solid var(--line);padding:14px;margin-bottom:12px}.card:before,.card:after{content:"";position:absolute;width:10px;height:10px;border:1px solid var(--line-strong);pointer-events:none}.card:before{top:-1px;left:-1px;border-right:none;border-bottom:none}.card:after{bottom:-1px;right:-1px;border-left:none;border-top:none}.card .head{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px;margin-bottom:8px}.card .msg{white-space:pre-wrap;word-break:break-word;margin:0;line-height:1.7;font-size:14px}.card.detect{overflow:hidden}.ping-ring{position:absolute;top:30%;left:8%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;border:2px solid var(--phos);opacity:0;animation:ping 1.7s ease-out 1}@keyframes ping{0%{opacity:.9;transform:scale(.5)}to{opacity:0;transform:scale(7)}}.tag{display:inline-block;font-size:11px;letter-spacing:.1em;padding:3px 8px;border:1px solid var(--line-strong);color:var(--phos);background:#3ef5c20f}.tag.m{color:var(--phos);border-color:#3ef5c266}.tag.f{color:#ff8fb3;border-color:#ff8fb366;background:#ff8fb30f}.thread-meta{color:var(--muted);font-size:11px;line-height:1.9;letter-spacing:.04em}.bubbles{display:flex;flex-direction:column;gap:8px;margin:12px 0}.bubble{max-width:82%;padding:10px 12px;font-size:13px;line-height:1.6;white-space:pre-wrap;word-break:break-word;border:1px solid var(--line);background:var(--panel2);position:relative}.bubble.me{align-self:flex-end;background:#3ef5c212;border-color:#3ef5c259}.bubble.me:after{content:"TX";position:absolute;top:3px;right:6px;font-size:8px;letter-spacing:.12em;color:var(--phos-dim)}.bubble.partner{align-self:flex-start}.bubble.partner:after{content:"RX";position:absolute;top:3px;right:6px;font-size:8px;letter-spacing:.12em;color:var(--muted)}.row{display:flex;gap:10px;align-items:stretch}.row>textarea{flex:1}.rules{margin:12px 0;display:flex;flex-direction:column;gap:10px}.rule{display:flex;align-items:center;justify-content:space-between;background:var(--panel);border:1px solid var(--line);padding:12px}.rule .label{font-size:14px;letter-spacing:.08em}.rule .sub{margin:2px 0 0;font-size:11px}.seg{display:flex;gap:8px}.seg .opt{flex:1;text-align:center;padding:12px;border:1px solid var(--line);background:var(--panel2);color:var(--muted);cursor:pointer;font-size:13px;letter-spacing:.1em;transition:all .15s}.seg .opt.selected{color:var(--phos);border-color:var(--line-strong);background:#3ef5c21a;text-shadow:0 0 8px rgba(62,245,194,.5)}.tabbar{position:fixed;bottom:0;left:0;right:0;margin:0 auto;max-width:560px;display:flex;background:#060d13f0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}.tabbar:before{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--phos),transparent);opacity:.55}.tab{flex:1;background:none;border:none;color:var(--muted);font-size:11px;letter-spacing:.14em;padding:8px 0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;font-family:var(--mono)}.tab .ic{font-size:15px}.tab.active{color:var(--phos);text-shadow:0 0 8px rgba(62,245,194,.5)}.tab.active:after{content:"";width:4px;height:4px;border-radius:50%;background:var(--phos);box-shadow:0 0 6px var(--phos)}::selection{background:#3ef5c240;color:var(--text)}
