:root{color-scheme:dark;--bg:#101218;--surface:#191c24;--surface-hover:#21252f;--line:#2c303a;--text:#f4f5f8;--muted:#9299ac;--accent:#dbff73;--danger:#ff9d9d;--radius:16px;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);line-height:1.5}button,input,textarea{font:inherit}button,a,input,textarea,summary{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}input:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:2px}[hidden]{display:none!important}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.site-header{max-width:1440px;margin:auto;padding:30px 48px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:13px;align-items:center;font-weight:750;font-size:23px;letter-spacing:-.7px;white-space:nowrap}.brand-light{color:var(--muted);font-weight:450}.brand-icon{height:38px;width:38px;display:flex;align-items:center;justify-content:center;gap:4px;background:var(--accent);border-radius:11px;flex-shrink:0}.brand-icon i{display:block;width:3px;border-radius:2px;background:var(--bg);height:13px}.brand-icon i:nth-child(2){height:22px}.brand-icon i:nth-child(3){height:28px}.brand-icon i:nth-child(4){height:18px}.account{display:flex;gap:22px;align-items:center;font-size:.9rem;color:var(--muted)}.text-button{background:none;border:none;padding:10px 0;color:var(--muted);font-size:.875rem;font-weight:600}.text-button:hover{color:var(--text)}.workspace{max-width:1440px;margin:auto;display:grid;grid-template-columns:330px minmax(0,1fr);gap:64px;padding:48px}.composer{align-self:start;position:sticky;top:30px}.eyebrow{font-size:.75rem;font-weight:700;letter-spacing:1.6px;color:var(--muted)}h1{font-size:2.8rem;font-weight:650;letter-spacing:-1.9px;line-height:1.13;margin:15px 0 32px}h1 .accent{color:var(--accent)}.field-label{display:block;font-size:.9rem;font-weight:600;margin-bottom:10px}textarea,input:not([type=radio]):not([type=checkbox]){width:100%;background:var(--surface);border:1px solid var(--line);border-radius:12px;color:var(--text);padding:15px;font-size:1rem}textarea{resize:vertical;min-height:154px;max-height:440px;line-height:1.65;overflow-wrap:anywhere}textarea::placeholder{color:#737a8d;font-size:.875rem}.input-hint{display:flex;justify-content:space-between;gap:8px;font-size:.75rem;color:var(--muted);margin-top:7px}.format-picker{margin:24px 0 0;padding:0;border:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}.format-picker legend{font-size:.875rem;font-weight:600;margin-bottom:10px}.format-option{position:relative;cursor:pointer;min-width:0}.format-option input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.format-option>span{display:grid;grid-template-columns:24px minmax(0,1fr);gap:2px 9px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 12px;min-height:84px}.format-option svg{grid-row:1 / 3;align-self:center;color:var(--muted)}.format-option b{font-size:.875rem;font-weight:650}.format-option small{font-size:.75rem;color:var(--muted);white-space:nowrap}.format-option input:checked+span{border-color:var(--accent);background:#252b1f}.format-option input:checked+span svg{color:var(--accent)}.format-option input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}.button{min-height:48px;border:0;border-radius:11px;padding:12px 20px;font-weight:700;font-size:.9rem;display:inline-flex;justify-content:center;align-items:center;gap:10px}.primary{background:var(--accent);color:#152006}.primary:hover:not(:disabled){background:#e6ff9e}.secondary{background:var(--surface-hover);color:var(--text)}.danger{background:#583137;color:#ffd3d3}#queue-submit{width:100%;margin-top:10px}.error-text{font-size:.875rem;color:var(--danger);margin:9px 0;overflow-wrap:anywhere}.error-text:empty{display:none}.iphone-note{margin-top:30px;border-top:1px solid var(--line);padding-top:24px;color:var(--muted);font-size:.875rem}.note-title{display:flex;gap:8px;align-items:center;color:var(--text);font-size:.875rem}.note-title svg{width:20px;height:20px}.iphone-note p{line-height:1.6;margin:12px 0}.iphone-note summary{cursor:pointer;color:var(--text);font-size:.875rem}.collection{min-width:0}.collection-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.collection-heading h2{font-size:1.9rem;letter-spacing:-.8px;line-height:1.3;margin:10px 0 22px;font-weight:600}.count{display:inline-flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:500;min-width:30px;height:28px;background:var(--surface);color:var(--muted);border-radius:7px;vertical-align:middle;margin-left:8px;letter-spacing:0;padding:0 6px}.storage{font-size:.75rem;color:var(--muted);text-align:right}.library-toolbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:16px;gap:12px}.filters{display:flex;gap:5px}.filter{border:0;background:transparent;border-radius:8px;padding:9px 16px;color:var(--muted);font-size:.875rem;font-weight:600}.filter.active{background:var(--surface-hover);color:var(--text)}.filter:hover{color:var(--text)}.items{display:flex;flex-direction:column}.item{display:grid;grid-template-columns:22px 82px minmax(0,1fr) auto;align-items:center;gap:16px;border-bottom:1px solid var(--line);padding:22px 0;min-height:124px}.item-checkbox{width:19px;height:19px;margin:0;accent-color:var(--accent);cursor:pointer}.item-checkbox:disabled{opacity:.3;cursor:default}.cover{display:block;width:82px;height:82px;object-fit:cover;border-radius:10px;background:var(--surface-hover)}.item-info{min-width:0}.item-title{margin:0 0 4px;font-size:1rem;font-weight:600;line-height:1.4;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.item-meta{font-size:.75rem;color:var(--muted);display:flex;align-items:center;flex-wrap:wrap;gap:7px}.format-tag{font-size:.6875rem;letter-spacing:.6px;padding:1px 5px;border:1px solid #454b59;border-radius:4px;font-weight:700;color:#bdc3d3}.status{font-size:.75rem;margin-top:8px;color:var(--muted)}.status.ready{color:var(--accent)}.status.error{color:var(--danger);max-width:100%;overflow-wrap:anywhere}.progress-track{height:3px;background:var(--line);border-radius:3px;margin-top:8px;overflow:hidden}.progress-fill{height:100%;background:var(--accent);width:0;transition:width .25s}.progress-track.indeterminate .progress-fill{width:35%;animation:indeterminate 1.5s infinite ease-in-out}.item-actions{display:flex;gap:5px;align-items:center}.icon-button{border:1px solid transparent;color:var(--muted);background:none;border-radius:9px;width:38px;height:42px;display:flex;align-items:center;justify-content:center}.icon-button:hover{background:var(--surface-hover);color:var(--text)}.icon-button.download{color:var(--accent);border-color:var(--line)}.icon-button svg{width:19px;height:19px}.empty-state{text-align:center;padding:85px 20px 80px}.empty-record{display:flex;width:76px;height:76px;border-radius:50%;margin:0 auto 24px;background:repeating-radial-gradient(circle,#292d39 0,#292d39 1px,#1b1e28 2px,#1b1e28 7px);border:1px solid #353b48;align-items:center;justify-content:center}.empty-record i{width:22px;height:22px;background:var(--accent);border-radius:50%;border:7px solid #343e23}.empty-state h3{font-size:1.125rem;letter-spacing:-.3px;font-weight:600;margin:0 0 9px}.empty-state p{font-size:.875rem;color:var(--muted);margin:0}.collection-footer{font-size:.75rem;color:var(--muted);text-align:center;margin:24px 0}.download-bar{position:sticky;bottom:max(20px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:12px;background:#262b35;border:1px solid #3a4251;box-shadow:0 10px 40px #0005;border-radius:14px;padding:16px;margin-top:22px;z-index:5}.download-bar strong{font-size:.9rem;display:block}.download-bar .muted{display:block;font-size:.75rem}.download-bar .button{white-space:nowrap}.muted{color:var(--muted)}.connection-error{padding:12px;border-radius:10px;background:#3a3020;color:#ffdb9d;font-size:.875rem}.toast{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);background:#e5ebd8;color:#192012;border-radius:12px;box-shadow:0 8px 40px #0006;padding:13px 22px;font-size:.875rem;z-index:20}.login-view{min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:32px 20px}.login-card{max-width:420px;width:100%}.login-card .brand{margin-bottom:55px}.login-card h1{font-size:3.4rem;margin:15px 0 18px}.login-card>p{font-size:1rem;margin-bottom:32px}.login-card label{display:block;font-size:.875rem;font-weight:600;margin:18px 0 8px}.login-card .button{width:100%;margin-top:22px}.login-foot{font-size:.75rem;color:var(--muted);margin:48px 0 0;text-align:center}dialog{background:#1d212b;color:var(--text);border:1px solid #434a58;border-radius:18px;padding:28px;width:min(440px,calc(100vw - 32px))}dialog::backdrop{background:#0009;backdrop-filter:blur(4px)}dialog h2{font-size:1.3rem;margin:0 0 12px}dialog p{font-size:.9rem;overflow-wrap:anywhere}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}@keyframes indeterminate{from{transform:translateX(-100%)}to{transform:translateX(400%)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(min-width:1440px){.workspace{gap:85px;grid-template-columns:360px minmax(0,1fr)}}@media(max-width:1050px){.workspace{gap:35px;padding:36px 28px;grid-template-columns:300px minmax(0,1fr)}.site-header{padding:24px 28px}.item{grid-template-columns:19px 62px minmax(0,1fr);gap:12px}.cover{width:62px;height:62px}.item-actions{grid-column:3;justify-content:flex-end;margin-top:-3px}.item-info{grid-column:3;grid-row:1}.item-checkbox{grid-column:1;grid-row:1}.cover{grid-column:2;grid-row:1}.storage{max-width:90px}}
@media(max-width:740px){.site-header{padding:20px}.brand{font-size:21px}.brand-icon{width:34px;height:34px}.account{gap:0}.account>span{display:none}.workspace{display:block;padding:28px 20px 36px}.composer{position:static}.composer h1{font-size:2.45rem;margin-top:12px;margin-bottom:26px}.composer h1 br{display:none}.eyebrow{font-size:.75rem}.format-option>span{padding:14px 16px;min-height:78px}.format-option small{font-size:.75rem}.iphone-note{margin-top:25px;padding-top:20px}.collection{margin-top:40px}.collection-heading h2{font-size:1.7rem;margin-bottom:18px}.storage{max-width:none}.item{grid-template-columns:20px 60px minmax(0,1fr);padding:18px 0;min-height:120px}.cover{width:60px;height:60px}.item-title{font-size:.95rem}.item-actions{margin-top:0;gap:8px}.icon-button{height:36px;width:40px}.download-bar{padding:12px;margin-top:16px;bottom:max(12px,env(safe-area-inset-bottom))}.download-bar .button{font-size:.875rem;padding:12px 14px}.download-bar .button svg{width:18px}.empty-state{padding:55px 10px}.collection-footer{line-height:1.6}.toast{bottom:max(85px,calc(env(safe-area-inset-bottom) + 70px))}.login-card .brand{margin-bottom:40px}.login-card h1{font-size:3rem}}@media(max-width:350px){.brand{font-size:18px;gap:8px}.workspace{padding:24px 16px}.site-header{padding:18px 16px}.format-option>span{padding:12px 8px}.format-option small{white-space:normal}.filter{padding:9px 12px}.download-bar .button{padding:10px;gap:5px}}@media(min-width:741px) and (max-height:780px){.composer{position:static}}

#batch-dialog{width:min(560px,calc(100vw - 32px));max-height:85svh;overflow-y:auto}.batch-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.batch-heading h2{margin:0}.batch-actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.batch-file{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 0;border-top:1px solid var(--line);font-size:.875rem}.batch-file span{min-width:0}.batch-file b{display:block;overflow-wrap:anywhere;font-weight:550}.batch-file small{display:block;color:var(--muted);margin-top:3px}.batch-file svg{color:var(--accent)}#batch-status{font-size:.875rem;color:var(--accent)}

.format-tag{font-size:.75rem}@media(max-width:740px){.workspace{display:flex;flex-direction:column;gap:0}.collection{order:0;margin-top:0}.composer{order:1;margin-top:40px}.item-title{font-size:1rem}}
