:root{--bg: #0f1115;--card: #171a21;--line: #262b36;--text: #e8eaed;--muted: #9aa3b2;--accent: #e5484d;--accent2: #3b82f6}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}.app{max-width:820px;margin:0 auto;padding:32px 20px 64px}header h1{margin:0 0 4px;font-size:26px}.sub{margin:0 0 24px;color:var(--muted)}.error{background:#3a1416;border:1px solid #7f1d1d;color:#fecaca;padding:12px 14px;border-radius:10px;margin-bottom:16px}.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:14px}.row{display:flex;align-items:center;gap:10px;cursor:pointer}.row input{width:18px;height:18px;accent-color:var(--accent2)}.row em{color:var(--muted);font-style:normal;font-size:13px}.field{display:flex;align-items:center;justify-content:space-between;gap:12px}.field-label{color:var(--muted)}.seg{display:inline-flex;gap:6px}.seg button{background:#10131a;border:1px solid var(--line);color:var(--text);padding:8px 14px;border-radius:8px;cursor:pointer;font-size:14px}.seg button.on{border-color:var(--accent2);background:#16233d}.seg.small button{padding:6px 10px}.rec-btn{margin-top:18px;width:100%;background:var(--accent);color:#fff;border:0;padding:16px;border-radius:12px;font-size:17px;font-weight:600;cursor:pointer}.rec-btn:disabled{opacity:.6;cursor:default}.hint{color:var(--muted);font-size:13px;margin-top:12px}.live{display:flex;flex-direction:column;gap:14px;align-items:center}.timer{font-size:22px;font-weight:700;color:var(--accent);font-variant-numeric:tabular-nums}.timer.paused{color:var(--muted)}.canvas-host{width:100%;background:#000;border-radius:10px;min-height:120px}.live-stage{position:relative;width:100%}.live-video{width:100%;background:#000;border-radius:10px;display:block;min-height:120px}.countdown{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:110px;font-weight:800;color:#fff;background:#00000073;border-radius:10px;text-shadow:0 4px 24px rgba(0,0,0,.6)}select{background:#10131a;border:1px solid var(--line);color:var(--text);padding:8px 10px;border-radius:8px;max-width:320px;font-size:14px}.linkbtn{background:none;border:none;color:var(--accent2);cursor:pointer;padding:0;font-size:13px;text-align:left}.quick{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}.controls{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:8px}.controls button,.controls a{border:1px solid var(--line);background:#10131a;color:var(--text);padding:12px 18px;border-radius:10px;cursor:pointer;font-size:15px;text-decoration:none;display:inline-block}.controls .stop{background:var(--accent);border-color:var(--accent);color:#fff}.controls .download{background:var(--accent2);border-color:var(--accent2);color:#fff;font-weight:600}.controls .ghost{background:transparent;color:var(--muted)}.warn{background:#3a2e12;border:1px solid #7c5e1a;color:#fde68a;padding:8px 12px;border-radius:8px;font-size:13px;max-width:520px;text-align:center}.processing{display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center;padding:24px 0}.bar{width:100%;height:14px;background:#10131a;border:1px solid var(--line);border-radius:999px;overflow:hidden}.bar-fill{height:100%;background:var(--accent2);transition:width .2s ease}.result{display:flex;flex-direction:column;gap:14px}.duration{margin:0;color:var(--muted);font-variant-numeric:tabular-nums}.trim{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:10px}.trim-head{display:flex;justify-content:space-between;align-items:center}.trim-range{color:var(--muted);font-variant-numeric:tabular-nums}.trim-row{display:flex;align-items:center;gap:12px}.trim-row span{width:52px;color:var(--muted);font-size:14px}.trim-row input[type=range]{flex:1;accent-color:var(--accent2)}.trim-actions{display:flex;gap:10px;margin-top:4px}.trim-actions button{border:1px solid var(--line);background:#10131a;color:var(--text);padding:10px 16px;border-radius:10px;cursor:pointer;font-size:14px}.trim-actions button:disabled{opacity:.5;cursor:default}.trim-actions .ghost{background:transparent;color:var(--muted)}.publish{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:10px}.publish h3{margin:0;font-size:16px}.title-input{background:#10131a;border:1px solid var(--line);color:var(--text);padding:10px 12px;border-radius:8px;font-size:15px}.linkbox{display:flex;gap:8px;flex-wrap:wrap}.linkbox input{flex:1;min-width:200px;background:#10131a;border:1px solid var(--line);color:var(--text);padding:10px 12px;border-radius:8px;font-size:14px}.linkbox button,.linkbox .open{border:1px solid var(--line);background:#10131a;color:var(--text);padding:10px 16px;border-radius:8px;cursor:pointer;text-decoration:none;display:inline-block}.linkbox .open{background:var(--accent2);border-color:var(--accent2);color:#fff}.err-text{color:#fca5a5;font-size:14px;margin:0}.viewer{max-width:900px}.viewer h1{margin:0 0 4px}.preview{width:100%;border-radius:12px;background:#000;max-height:60vh}.transcript{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:10px}.transcript h2{margin:0;font-size:18px}.transcript-list{display:flex;flex-direction:column;gap:8px}.transcript-seg{display:grid;grid-template-columns:64px 1fr;gap:12px;text-align:left;background:#10131a;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer}.transcript-seg:hover{border-color:var(--accent2)}.transcript-seg span{color:var(--accent2);font-variant-numeric:tabular-nums;font-size:13px}.transcript-seg p{margin:0}.quota{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:10px;margin-bottom:18px}.quota-head{display:flex;justify-content:space-between;align-items:baseline;font-size:14px}.quota-ok{color:var(--muted);font-variant-numeric:tabular-nums}.quota-warn{color:#fca5a5;font-weight:600;font-variant-numeric:tabular-nums}.bar-fill.full{background:var(--accent)}.lib-list{display:flex;flex-direction:column;gap:10px}.lib-item{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px}.lib-info{min-width:0}.lib-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lib-meta{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;margin-top:2px}.lib-actions{display:flex;gap:8px;flex-shrink:0}.lib-actions .open{border:1px solid var(--line);background:#10131a;color:var(--text);padding:9px 14px;border-radius:8px;text-decoration:none;font-size:14px}.lib-actions .del{border:1px solid #7f1d1d;background:transparent;color:#fca5a5;padding:9px 14px;border-radius:8px;cursor:pointer;font-size:14px}.lib-actions .del:hover{background:#3a1416}.lib-actions .del:disabled{opacity:.5;cursor:default}@media (max-width: 560px){.lib-item{flex-direction:column;align-items:stretch}.lib-actions{justify-content:flex-end}}html{scroll-behavior:smooth}body{min-height:100vh;background:radial-gradient(1100px 560px at 50% -12%,rgba(59,130,246,.08),transparent 60%),radial-gradient(820px 460px at 100% 0%,rgba(229,72,77,.06),transparent 55%),var(--bg);background-attachment:fixed;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}::selection{background:#3b82f659;color:#fff}*{scrollbar-width:thin;scrollbar-color:#2a3140 transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:#2a3140;border-radius:999px;border:2px solid var(--bg)}*::-webkit-scrollbar-thumb:hover{background:#39424f}button,a,input,select,.lib-item,.transcript-seg{transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .08s ease,filter .15s ease,opacity .15s ease}:focus-visible{outline:2px solid var(--accent2);outline-offset:2px;border-radius:6px}input:focus-visible,select:focus-visible,.title-input:focus-visible{outline:none;border-color:var(--accent2);box-shadow:0 0 0 3px #3b82f640}header h1{letter-spacing:-.02em}.panel,.trim,.publish,.transcript,.quota,.lib-item{box-shadow:0 1px #ffffff05 inset,0 8px 24px #00000040}.seg button:hover{border-color:#3a4453}.controls button:hover,.controls a:hover,.trim-actions button:hover:not(:disabled),.linkbox button:hover,.linkbox .open:hover{border-color:var(--accent2);transform:translateY(-1px)}.controls button:active,.controls a:active{transform:translateY(0)}.rec-btn{background:linear-gradient(180deg,#f0595e,var(--accent));box-shadow:0 8px 24px #e5484d59}.rec-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 28px #e5484d73}.rec-btn:active:not(:disabled){transform:translateY(0);box-shadow:0 6px 18px #e5484d59}.controls .download:hover{filter:brightness(1.08);transform:translateY(-1px)}.bar-fill{background:linear-gradient(90deg,var(--accent2),#60a5fa)}.bar-fill.full{background:linear-gradient(90deg,#ef4444,var(--accent))}.lib-item:hover{border-color:#2f3947;transform:translateY(-1px)}.result,.live,.processing,.quota,.lib-list,.panel{animation:fadeInUp .28s ease both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}