:root{color-scheme:dark;--bg: #0f1115;--panel: #151922;--control-bg: #10141d;--panel-border: #2a3140;--text: #d8e1ef;--muted: #9dacbf;--error: #ff7a7a;--ok: #7ce38b;--accent: #6aa2ff}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;background:var(--bg);color:var(--text)}.container{max-width:640px;margin:80px auto;padding:0 16px}.title{font-size:1.5rem;font-weight:600;margin-bottom:24px}.input-row{display:flex;gap:8px}.url-input{flex:1;padding:10px 14px;font-size:.95rem;background:var(--control-bg);color:var(--text);border:1px solid var(--panel-border);border-radius:6px;outline:none;transition:border-color .15s}.url-input::placeholder{color:var(--muted)}.url-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #6aa2ff26}.btn{padding:10px 18px;font-size:.9rem;font-weight:500;border:none;border-radius:6px;cursor:pointer;transition:background .15s,opacity .15s;white-space:nowrap}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:#4f86e8}.btn-copy{background:var(--panel);color:var(--text);border:1px solid var(--panel-border)}.btn-copy:hover{background:var(--panel-border)}.error{margin-top:12px;font-size:.875rem;color:var(--error)}.result-row{display:flex;align-items:center;gap:10px;margin-top:20px;padding:12px 14px;background:var(--panel);border:1px solid var(--panel-border);border-radius:6px}.result-text{flex:1;font-size:.95rem;word-break:break-all;color:var(--ok)}