:root{--bg:#131418;--surface:#1e2027;--surface-2:#2a2c34;--line:#2c2f38;--line-strong:#3a3e49;--text:#f1efe9;--muted:#a3a8b4;--accent:#f4c542;--accent-ink:#1a1a1a;--danger:#f09a84;--radius:10px;--font:Inter, system-ui, -apple-system, "Segoe UI", sans-serif;--font-display:"Space Grotesk", var(--font);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;line-height:1.45}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}h1,h2{font-family:var(--font-display);margin:0;line-height:1.1}img{max-width:100%;display:block}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.muted{color:var(--muted)}.small{font-size:14px}.page{flex-direction:column;min-height:100dvh;display:flex}.container{width:100%;max-width:1280px;margin:0 auto;padding:40px 5% 64px}.center-screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:100dvh;display:flex}.topbar{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:14px 4%;display:flex}.topbar-left,.topbar-actions{flex-wrap:wrap;align-items:center;gap:12px;min-width:0;display:flex}.topbar-title{overflow-wrap:anywhere;font-size:24px}.brand{font-family:var(--font-display);align-items:center;gap:10px;min-height:44px;font-size:20px;font-weight:700;display:inline-flex}.brand-icon{color:var(--accent);display:inline-flex}.btn{border-radius:var(--radius);background:var(--accent);min-height:44px;color:var(--accent-ink);cursor:pointer;border:0;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-weight:600;display:inline-flex}.btn--ghost{color:var(--text);border:1px solid var(--line);background:0 0;font-weight:500}.btn--ghost:hover{border-color:var(--line-strong)}.icon-btn{border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);cursor:pointer;justify-content:center;align-items:center;width:44px;height:44px;display:inline-flex}.icon-btn:hover{border-color:var(--line-strong)}.icon-btn.is-on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}@media (hover:none){.only-pointer{display:none}}.message{text-align:center;color:var(--muted);margin:48px auto;padding:0 5%}.message--error{color:var(--danger)}.home-head{margin-bottom:32px}.home-head h1{margin-bottom:8px;font-size:clamp(32px,6vw,44px)}.binder-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:32px 28px;margin:0;padding:0;list-style:none;display:grid}.binder-card{flex-direction:column;gap:6px;display:flex}.binder-cover{aspect-ratio:3/4;background:var(--surface);border:1px solid var(--line);border-radius:6px 14px 14px 6px;margin-bottom:8px;transition:transform .15s,border-color .15s;overflow:hidden}.binder-cover img{object-fit:cover;width:100%;height:100%}.binder-cover-empty{width:100%;height:100%;font-family:var(--font-display);color:var(--line-strong);justify-content:center;align-items:center;font-size:64px;display:flex}.binder-card:hover .binder-cover,.binder-card:focus-visible .binder-cover{border-color:var(--accent);transform:translateY(-3px)}.binder-title{font-family:var(--font-display);font-size:20px;font-weight:700}@media (width<=480px){.binder-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.binder-title{font-size:17px}}.reader{flex-direction:column;flex:1;align-items:center;gap:18px;padding:28px 3% 24px;display:flex;overflow:clip}.stage{justify-content:center;align-items:center;gap:18px;width:100%;display:flex}.stage--fullscreen{background:var(--bg);height:100dvh;padding:16px}.nav-btn{background:var(--surface);border:1px solid var(--line);cursor:pointer;border-radius:50%;flex:none;justify-content:center;align-items:center;width:52px;height:52px;display:inline-flex}.nav-btn:hover{border-color:var(--accent)}.fb{width:min(100%,150dvh - 420px);min-width:0;position:relative}.stage--fullscreen .fb{width:min(100%,150dvh - 60px)}.fb-host{width:100%}.fb-page{background:#0b0c0f;overflow:hidden}.fb-page img{object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%}.fb--magnifier{cursor:crosshair}.fb-lens{z-index:50;pointer-events:none;border:3px solid var(--accent);background-color:var(--bg);background-repeat:no-repeat;border-radius:50%;position:absolute;box-shadow:0 10px 30px #0000008c}.reader-status{text-align:center;margin:0;font-size:15px}.thumbs{scrollbar-color:var(--line-strong) transparent;gap:8px;width:100%;max-width:1180px;padding:4px 2px 10px;display:flex;overflow-x:auto}.thumb{cursor:pointer;background:var(--surface);border:2px solid var(--line);border-radius:6px;flex:none;width:56px;padding:3px}.thumb img{aspect-ratio:3/4;object-fit:cover;border-radius:3px;width:100%}.thumb[aria-current=true]{border-color:var(--accent)}@media (width<=640px){.topbar-title{font-size:19px}.reader{gap:14px;padding:16px 12px 20px}.stage{flex-wrap:wrap;justify-content:space-between;gap:12px}.fb{order:-1;width:min(100%,75dvh - 225px);margin:0 auto}.stage--fullscreen .fb{width:min(100%,75dvh - 75px)}}.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;flex-direction:column;gap:16px;padding:20px;display:flex}.card h2{font-size:18px}.field,.field-label{color:var(--muted);flex-direction:column;gap:6px;font-size:13px;display:flex}.field input{border-radius:var(--radius);min-height:44px;font:inherit;border:1px solid var(--line-strong);background:var(--bg);color:var(--text);padding:0 12px;font-size:15px}.field input:focus{border-color:var(--accent);outline:none}.form-error{color:var(--danger);margin:0;font-size:14px}.link-muted{color:var(--muted);align-items:center;gap:6px;min-height:44px;font-size:14px;display:inline-flex}.link-muted:hover{color:var(--text)}.link-btn{color:var(--accent);cursor:pointer;font-size:inherit;background:0 0;border:0;padding:0 0 0 6px;text-decoration:underline}.row-end{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--outline{color:var(--accent);border:1px solid var(--accent);background:0 0}.btn--danger{color:var(--danger);border-color:#c2593f}.btn--danger-text{color:var(--danger)}.icon-btn--sm{background:var(--bg);border-radius:8px;width:36px;height:36px}.icon-btn--danger{color:var(--danger)}.grip{cursor:grab;touch-action:none;color:var(--muted)}.grip:active{cursor:grabbing}.login-card{text-align:left;width:min(100%,380px)}.login-card h1{font-size:28px}.footer{border-top:1px solid var(--line);justify-content:center;padding:24px 5%;display:flex}.dialog{color:var(--text);background:0 0;border:0;width:min(92vw,440px);padding:0}.dialog::backdrop{background:#0009}.message-box{border-radius:var(--radius);color:var(--danger);border:1px solid #c2593f;padding:12px 16px;font-size:14px}.message-box ul{margin:6px 0 0;padding-left:18px}.home-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.binder-card--sorting .binder-cover{pointer-events:none}.sort-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.is-dragging{opacity:.85}.is-dragging .binder-cover,.is-dragging .page-thumb{box-shadow:0 12px 30px #00000080}.topbar--sticky{z-index:20;background:var(--bg);position:sticky;top:0}.editor{flex-wrap:wrap;align-items:flex-start;gap:28px;width:100%;max-width:1360px;margin:0 auto;padding:28px 4% 64px;display:flex}.editor-side{flex-direction:column;flex:280px;gap:20px;max-width:360px;display:flex}.editor-main{outline-offset:8px;border-radius:14px;outline:2px dashed #0000;flex-direction:column;flex:999 520px;gap:18px;min-width:0;transition:outline-color .15s;display:flex}.editor-main.is-dragover{outline-color:var(--accent)}.editor-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.editor-head h2{margin-bottom:4px;font-size:24px}.cover-field{flex-direction:column;gap:8px;display:flex}.cover-row{align-items:flex-start;gap:14px;display:flex}.cover-row .slot-preview{flex:none;width:84px}.cover-actions{flex-direction:column;align-items:flex-start;gap:8px;min-width:0;display:flex}.cover-actions .btn{white-space:nowrap;padding:0 12px;font-size:14px}.slot-preview{aspect-ratio:3/4;background:var(--bg);border:1px solid var(--line);border-radius:6px;width:100%;position:relative;overflow:hidden}.slot-preview img{object-fit:cover;width:100%;height:100%}.slot-empty{text-align:center;color:var(--muted);justify-content:center;align-items:center;padding:6px;font-size:12px;display:flex;position:absolute;inset:0}.progress{background:#131418d9;border-radius:4px;height:8px;position:absolute;bottom:8%;left:8%;right:8%;overflow:hidden}.progress span{background:var(--accent);height:100%;transition:width .2s;display:block}.dropzone{border:2px dashed var(--line-strong);text-align:center;color:var(--muted);border-radius:14px;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;padding:24px;font-size:15px;display:flex}.page-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;display:grid}.page-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;flex-direction:column;gap:8px;padding:8px;display:flex}.page-card.is-dragging{border-color:var(--accent)}.page-thumb{position:relative}.page-number{background:var(--bg);border-radius:13px;justify-content:center;align-items:center;min-width:26px;height:26px;padding:0 7px;font-size:13px;font-weight:600;display:inline-flex;position:absolute;top:6px;left:6px}.page-actions{justify-content:space-between;align-items:center;gap:4px;display:flex}.page-actions-right{gap:4px;display:flex}@media (width<=640px){.editor{padding:20px 12px 48px}.editor-side{max-width:none}.page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.topbar--sticky{flex-wrap:nowrap;padding:10px 12px}.topbar--sticky .topbar-title,.topbar--sticky .status-text,.topbar--sticky .label-wide{display:none}.topbar--sticky .topbar-actions{flex-wrap:nowrap;gap:8px}}@media (prefers-reduced-motion:reduce){.binder-cover,.progress span,.editor-main{transition:none}}