:root{font-family:system-ui,'Noto Sans TC',sans-serif;color:#eaf5ef;background:#0d2525}*{box-sizing:border-box}body{margin:0}main{max-width:880px;margin:auto;padding:18px}header h1{margin:4px 0;font-size:1.55rem}small{font-size:.72rem;color:#b5e7ca}header p,.note{color:#bdd0c8;font-size:.9rem}nav,.actions{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}button{border:1px solid #5a9180;border-radius:10px;background:#1c4a43;color:#fff;padding:11px 14px;font-weight:650;cursor:pointer}button.selected,#start{background:#60b98e;color:#09241e}button:disabled{opacity:.4}.viewer{position:relative;background:#162d2e;aspect-ratio:4/3;border-radius:15px;overflow:hidden}.viewer video,.viewer canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:scaleX(-1)}.viewer canvas{pointer-events:none}#message{position:absolute;bottom:0;width:100%;padding:12px;background:#061b1bc9;text-align:center;font-size:.9rem}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stats>div,.panel{background:#173a38;border-radius:10px;padding:13px}.stats b{display:block;font-size:1.1rem;margin-top:5px}.panel{margin-top:14px}.panel h2{margin:0 0 8px}.seals{display:flex;gap:15px;font-size:1.8rem}.seals span{padding:8px 16px;border:1px solid #52766e;border-radius:50%;opacity:.35}.seals .done{opacity:1;background:#3a846a}.note{line-height:1.7}@media(max-width:460px){main{padding:10px}.stats{grid-template-columns:repeat(2,1fr)}button{padding:10px}}