:root{color-scheme:dark;--bg: #0f1720;--panel: rgba(18, 26, 38, .9);--line: rgba(255, 255, 255, .12);--text: #e8eef8;--muted: #9aa8bc;--accent: #3b82f6;--red: #ef4444;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px);--topbar-h: 56px;--dock-gap: 10px;--touch: 48px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;color:var(--text)}#view{display:block;width:100%;height:100%;touch-action:none}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2;transition:opacity .4s ease}#app.is-booting .hud{opacity:0;pointer-events:none}#boot-splash{user-select:none;-webkit-user-select:none}#boot-splash.is-done{opacity:0;visibility:hidden;pointer-events:none}.topbar{position:absolute;top:0;left:0;right:0;min-height:calc(var(--topbar-h) + var(--safe-t));padding:calc(10px + var(--safe-t)) max(12px,var(--safe-r)) 10px max(12px,var(--safe-l));display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:auto;background:linear-gradient(180deg,rgba(10,16,26,.72) 0%,rgba(10,16,26,.35) 70%,transparent 100%)}.tabs{display:flex;gap:0;padding:3px;border-radius:14px;background:#ffffff0f;border:1px solid var(--line)}.tab,button{border:1px solid var(--line);background:#ffffff0f;color:var(--text);border-radius:10px;padding:8px 14px;cursor:pointer;font:inherit;min-height:var(--touch)}.tabs .tab{border:none;background:transparent;min-height:42px;padding:8px 16px;border-radius:11px;font-size:.9rem;font-weight:600;color:var(--muted)}.tab.active{background:#3b82f647;color:var(--text);box-shadow:0 1px #ffffff0f}.tab[data-machine=red].active{background:#ef444447}.topbar-right{display:flex;align-items:center;gap:8px}.status-pill{display:inline-flex;align-items:center;gap:6px;max-width:min(42vw,180px);padding:8px 12px;border-radius:999px;background:#0c121cb8;border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:.78rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-pill #state{color:var(--text);font-weight:600;overflow:hidden;text-overflow:ellipsis}.status-dot{width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 8px #34d399b3;flex-shrink:0}.icon-btn{min-width:var(--touch);padding-inline:12px}button:hover{filter:brightness(1.08)}button:active{transform:scale(.98)}.ghost{background:transparent}.panel{position:absolute;top:calc(var(--topbar-h) + var(--safe-t) + 8px);right:max(12px,var(--safe-r));width:min(320px,calc(100vw - 24px));padding:16px;border-radius:16px;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);pointer-events:auto;display:grid;gap:10px;box-shadow:0 12px 40px #00000059}.panel.collapsed{display:none}.panel h1{margin:0;font-size:1.05rem;letter-spacing:.02em}.sub,.hint,.meta{margin:0;color:var(--muted);font-size:.86rem;line-height:1.45}.meta{display:grid;gap:4px}.dock{position:absolute;left:0;right:0;bottom:0;padding:var(--dock-gap) max(12px,var(--safe-r)) calc(12px + var(--safe-b)) max(12px,var(--safe-l));display:flex;flex-direction:column;align-items:stretch;gap:var(--dock-gap);pointer-events:none;background:linear-gradient(0deg,rgba(8,12,20,.88) 0%,rgba(8,12,20,.45) 55%,transparent 100%)}.result-bar{display:flex;align-items:center;justify-content:center;gap:16px;padding:10px 14px;border-radius:16px;background:#0c121cd1;border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);pointer-events:none;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.result-bar::-webkit-scrollbar{display:none}.result-group{display:flex;align-items:center;gap:8px;flex-shrink:0}.result-label{font-size:.72rem;color:#fca5a5;letter-spacing:.08em;white-space:nowrap}.result-label.blue{color:#93c5fd}.result-balls{display:flex;gap:6px;min-height:36px;align-items:center}.result-ball{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.82rem;color:#111;box-shadow:inset 0 -4px 8px #00000040,0 4px 10px #00000059;animation:pop-in .35s ease-out}.result-ball.red{background:radial-gradient(circle at 30% 28%,#ff6b5a,#de1f05 55%,#9a0f02)}.result-ball.blue{background:radial-gradient(circle at 30% 28%,#5b9fff,#1565c0 55%,#0d47a1);color:#fff}.result-ball.empty{background:#ffffff0f;border:1px dashed rgba(255,255,255,.18);box-shadow:none;color:transparent}.dock-actions{display:flex;gap:10px;pointer-events:auto}.dock-actions button{flex:1;min-height:var(--touch);border-radius:14px;font-weight:700;font-size:.95rem}#btn-start{background:linear-gradient(180deg,#3b82f6,#2563eb);border-color:transparent;box-shadow:0 8px 20px #2563eb59}#btn-reset,#btn-copy,#btn-history{flex:.5;background:#ffffff0f;font-size:.88rem}.toast{position:fixed;left:50%;bottom:calc(96px + var(--safe-b));transform:translate(-50%) translateY(12px);z-index:200;padding:10px 16px;border-radius:12px;background:#121a26f0;border:1px solid var(--line);color:var(--text);font-size:.9rem;font-weight:600;letter-spacing:.02em;box-shadow:0 10px 28px #0006;opacity:0;pointer-events:none;transition:opacity .22s ease,transform .22s ease}.toast.is-show{opacity:1;transform:translate(-50%) translateY(0)}.copy-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:180;display:flex;align-items:center;justify-content:center;padding:max(16px,var(--safe-t)) max(16px,var(--safe-r)) max(16px,var(--safe-b)) max(16px,var(--safe-l))}#history-modal{z-index:180}#copy-modal{z-index:190}.copy-modal[hidden]{display:none!important}.copy-modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#060a109e}.copy-modal-card{position:relative;width:min(420px,100%);padding:16px;border-radius:16px;background:#121a26f5;border:1px solid var(--line);box-shadow:0 18px 48px #00000073;display:flex;flex-direction:column;gap:12px}.copy-modal-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.copy-modal-head h2{margin:0;font-size:1rem;font-weight:700}.copy-modal-head .icon-btn{width:36px;min-height:36px;padding:0;font-size:1.35rem;line-height:1}.copy-format-row{display:flex;align-items:center;gap:10px;padding:12px;border-radius:12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08)}.copy-format-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.copy-format-label{font-size:.75rem;color:var(--muted);letter-spacing:.04em}.copy-format-text{display:block;margin:0;font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:.86rem;font-weight:600;color:var(--text);word-break:break-all;line-height:1.4}.copy-format-btn{flex-shrink:0;min-width:72px;min-height:var(--touch);border-radius:12px;font-weight:700;background:linear-gradient(180deg,#3b82f6,#2563eb);border:none;color:#fff;box-shadow:0 6px 16px #2563eb4d}.history-modal-card{max-height:min(72vh,560px)}.history-list{display:flex;flex-direction:column;gap:8px;overflow-y:auto;max-height:min(52vh,400px);-webkit-overflow-scrolling:touch}.history-empty{margin:12px 0;text-align:center;color:var(--muted);font-size:.9rem}.history-item{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08)}.history-item-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.history-item-time{font-size:.75rem;color:var(--muted)}.history-copy-btn{flex-shrink:0;min-height:36px;padding:0 14px;border-radius:10px;font-size:.82rem;font-weight:700;background:#ffffff14}.history-item-nums{font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:.84rem;font-weight:600;line-height:1.45;word-break:break-all}.history-item-nums .blue{color:#93c5fd}.history-clear-btn{width:100%;min-height:42px;border-radius:12px;background:#ffffff0d}@media(max-width:640px){.toast{bottom:calc(118px + var(--safe-b))}.dock-actions{flex-wrap:wrap}.dock-actions button{flex:1 1 calc(50% - 5px);font-size:.88rem}#btn-start{flex:1 1 100%}}@keyframes pop-in{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}@media(max-width:640px){:root{--topbar-h: 52px;--touch: 48px}.tabs .tab{padding:8px 14px;font-size:.85rem}.status-pill{max-width:34vw;padding:7px 10px;font-size:.72rem}.panel{left:max(12px,var(--safe-l));right:max(12px,var(--safe-r));width:auto;top:calc(var(--topbar-h) + var(--safe-t) + 6px)}.result-bar{gap:12px;padding:8px 12px;justify-content:flex-start}.result-ball{width:32px;height:32px;font-size:.75rem}.result-balls{gap:5px;min-height:32px}.dock-actions button{font-size:.92rem}}@media(max-width:380px){.result-label{font-size:.65rem}.result-ball{width:28px;height:28px;font-size:.7rem}.tabs .tab{padding:8px 10px}}@media(min-width:641px){.dock{align-items:center;padding-bottom:calc(16px + var(--safe-b))}.result-bar{min-width:min(560px,calc(100vw - 48px));gap:20px;padding:12px 20px}.result-ball{width:42px;height:42px;font-size:.95rem}.result-balls{gap:8px;min-height:44px}.dock-actions{width:min(420px,calc(100vw - 48px))}.panel{width:min(300px,calc(100vw - 32px))}}@media(hover:none){button:hover{filter:none}}