:root{--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--touch-target:44px;--fs-display:1.75rem;--fs-heading:1.25rem;--fs-body:1rem;--fs-small:0.875rem;--fw-regular:400;--fw-semibold:600;--lh-body:1.5;--lh-heading:1.3;--lh-display:1.2;--font-ui:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--font-reader:Georgia,"Palatino Linotype",Palatino,serif;--font-mono:"SF Mono","Fira Code","Fira Mono","Roboto Mono",Consolas,"DejaVu Sans Mono",monospace;--color-page-bg:#faf8f5;--color-surface:#fff;--color-surface-hover:#f5f0ea;--color-accent:#c89562;--color-accent-hover:#b07d4a;--color-accent-subtle:#f5ede3;--color-destructive:#c44536;--color-destructive-hover:#a3382b;--color-text:#2c2825;--color-text-secondary:#6b6560;--color-text-muted:#9e9790;--color-border:#e0d9d2;--color-border-light:#ede8e2;--color-input-bg:#fff;--color-input-border:#c8bfb5;--color-input-focus:#c89562;--color-input-placeholder:#9e9790;--color-success-bg:#edf7f0;--color-success-text:#1b6b43;--color-success-border:#a3d9b5;--color-error-bg:#fceeea;--color-error-text:#a3382b;--color-error-border:#e8b5a8;--color-warning-bg:#fff6e8;--color-warning-text:#8b6914;--color-warning-border:#e8d4a0;--color-info-bg:#e8eff8;--color-info-text:#1e4d8c;--color-info-border:#a8c8e8;--shadow-sm:0 1px 2px rgba(44,40,37,.06);--shadow-md:0 2px 8px rgba(44,40,37,.08);--shadow-lg:0 4px 16px rgba(44,40,37,.12);--shadow-xl:0 8px 24px rgba(44,40,37,.15);--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-full:9999px;--transition-fast:150ms ease;--transition-normal:200ms ease}.skip-link{background:var(--color-accent);border-radius:var(--radius-md);color:var(--color-page-bg);font-size:var(--fs-small);font-weight:var(--fw-semibold);left:var(--space-4);padding:var(--space-2) var(--space-4);position:absolute;text-decoration:none;top:-100%;z-index:10000}.skip-link:focus{top:var(--space-2)}:focus-visible{outline:2px solid var(--color-accent)!important;outline-offset:2px!important}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;line-height:var(--lh-body);-webkit-text-size-adjust:100%}body{background-color:var(--color-page-bg);color:var(--color-text);font-family:var(--font-ui)}#app,body{min-height:100vh}#app{align-items:center;display:flex;flex-direction:column;justify-content:center;margin:0 auto;max-width:1200px;padding:var(--space-6) var(--space-4)}#app.auth-page{max-width:480px}.auth-card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);max-width:420px;padding:var(--space-6);width:100%}.auth-card h1{color:var(--color-text);font-size:var(--fs-heading);font-weight:var(--fw-semibold);margin-bottom:var(--space-2);text-align:center}.auth-card p{color:var(--color-text-secondary);font-size:var(--fs-small);margin-bottom:var(--space-5);text-align:center}.form-group{margin-bottom:var(--space-4);position:relative}.form-input{background-color:var(--color-input-bg);border:1px solid var(--color-input-border);border-radius:var(--radius-md);color:var(--color-text);font-size:var(--fs-body);line-height:var(--lh-body);padding:var(--space-3) var(--space-3) var(--space-1);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);width:100%}.form-input:focus{border-color:var(--color-input-focus);box-shadow:0 0 0 3px var(--color-accent-subtle)}.form-input::placeholder{color:var(--color-input-placeholder)}.form-label{color:var(--color-text-muted);font-size:var(--fs-small);left:var(--space-3);pointer-events:none;position:absolute;top:var(--space-1);transition:all var(--transition-fast)}.form-input:focus+.form-label,.form-input:not(:placeholder-shown)+.form-label{color:var(--color-accent);font-size:.6875rem;top:0}.form-group:has(input[type=time].form-input) .form-label,.form-group:has(select.form-input) .form-label{color:var(--color-accent);font-size:.6875rem;top:0}.form-group--static .form-label{color:var(--color-text-secondary);display:block;font-size:.6875rem;margin-bottom:var(--space-1);position:static}.form-error{color:var(--color-error-text);display:none;font-size:var(--fs-small);margin-top:var(--space-1)}.form-error.visible{display:block}.form-field-error{border-color:var(--color-destructive)!important}.form-field-error:focus{box-shadow:0 0 0 3px rgba(196,69,54,.25)!important}.form-button{align-items:center;background-color:var(--color-accent);border:none;border-radius:var(--radius-md);color:var(--color-page-bg);cursor:pointer;display:inline-flex;font-size:var(--fs-body);font-weight:var(--fw-semibold);justify-content:center;min-height:var(--touch-target);padding:var(--space-2) var(--space-4);transition:background-color var(--transition-fast);width:100%}.form-button:hover{background-color:var(--color-accent-hover)}.form-button:focus{box-shadow:0 0 0 3px var(--color-accent-subtle)}.form-button:disabled{background-color:var(--color-text-muted);cursor:not-allowed;opacity:.7}.form-button-secondary{background-color:transparent;border:1px solid var(--color-accent);color:var(--color-accent)}.form-button-secondary:hover{background-color:var(--color-accent-subtle)}.message{border-radius:var(--radius-md);font-size:var(--fs-small);margin-bottom:var(--space-4);padding:var(--space-2) var(--space-3)}.message-success{background-color:var(--color-success-bg);border:1px solid var(--color-success-border);color:var(--color-success-text)}.message-error{background-color:var(--color-error-bg);border:1px solid var(--color-error-border);color:var(--color-error-text)}.message-warning{background-color:var(--color-warning-bg);border:1px solid var(--color-warning-border);color:var(--color-warning-text)}.message-info{background-color:var(--color-info-bg);border:1px solid var(--color-info-border);color:var(--color-info-text)}.qr-code{margin:var(--space-5) 0;text-align:center}.qr-code img{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-sm);height:auto;max-width:200px;padding:var(--space-2)}.backup-codes{background:var(--color-surface-hover);border:1px solid var(--color-border-light);border-radius:var(--radius-md);font-family:var(--font-mono);font-size:var(--fs-small);line-height:1.8;margin:var(--space-4) 0;padding:var(--space-4);user-select:all}.backup-codes li{list-style:none;padding:.125rem 0}.backup-codes-hint{color:var(--color-text-muted);font-size:var(--fs-small);font-style:italic;margin-top:var(--space-2)}.auth-links{font-size:var(--fs-small);margin-top:var(--space-5);text-align:center}.auth-links a{color:var(--color-accent);text-decoration:none}.auth-links a:hover{text-decoration:underline}.auth-links a:focus{border-radius:var(--radius-sm);outline:2px solid var(--color-accent);outline-offset:2px}.spinner{animation:spin .6s linear infinite;border:2px solid hsla(0,0%,100%,.3);border-radius:50%;border-top-color:#fff;display:inline-block;height:1rem;margin-right:var(--space-2);width:1rem}@keyframes spin{to{transform:rotate(1turn)}}.twofa-warning{background:var(--color-warning-bg);border:1px solid var(--color-warning-border);border-radius:var(--radius-md);color:var(--color-warning-text);font-size:var(--fs-small);margin:var(--space-4) 0;padding:var(--space-2) var(--space-3)}.twofa-warning strong{display:block;margin-bottom:var(--space-1)}.nav-hamburger{align-items:center;background:none;border:none;color:var(--color-text);cursor:pointer;display:none;justify-content:center;min-height:var(--touch-target);min-width:var(--touch-target);padding:0;position:absolute;right:var(--space-2);top:50%;transform:translateY(-50%);z-index:200}.nav-hamburger svg{fill:none;height:24px;stroke:var(--color-text);stroke-width:2;width:24px}.nav-hamburger:focus{border-radius:var(--radius-sm);outline:2px solid var(--color-accent);outline-offset:2px}.nav-close{align-items:center;background:none;border:none;color:var(--color-text);cursor:pointer;display:none;justify-content:center;min-height:var(--touch-target);min-width:var(--touch-target);padding:0;position:absolute;right:var(--space-3);top:var(--space-3);z-index:201}.nav-close svg{fill:none;height:24px;stroke:var(--color-text);stroke-width:2;width:24px}.nav-close:focus{border-radius:var(--radius-sm);outline:2px solid var(--color-accent);outline-offset:2px}.nav-mobile-overlay.nav-open .nav-close{display:flex}.nav-mobile-overlay{background:var(--color-surface);display:none;flex-direction:column;inset:0;overflow-y:auto;padding:calc(48px + var(--space-4)) var(--space-4) var(--space-4);position:fixed;z-index:150}.nav-mobile-overlay.nav-open{display:flex}.nav-mobile-overlay .site-nav-link{border-radius:var(--radius-sm);color:var(--color-text);display:block;font-size:var(--fs-body);min-height:var(--touch-target);padding:var(--space-3) var(--space-2);text-decoration:none}.nav-mobile-overlay .site-nav-link-active,.nav-mobile-overlay .site-nav-link:hover{background:var(--color-surface-hover);color:var(--color-accent)}@media (hover:none) and (pointer:coarse){.admin-btn,.btn,.btn-pagination,.form-button,.reader-nav-btn,.reader-toolbar-btn,.site-nav-link,.tag-filter-chip,[role=button],a,button,input[type=checkbox]{min-height:var(--touch-target);min-width:var(--touch-target)}a:not(.site-nav-link):not(.btn):not(.btn-pagination):not(.tag-filter-chip){display:inline-block;min-height:var(--touch-target);padding:var(--space-1) 0}}@media (max-width:768px){#app{padding:var(--space-4) var(--space-2)}#app:not(.auth-page){max-width:100%}.auth-card{padding:var(--space-5)}.auth-card h1{font-size:var(--fs-heading)}.nav-hamburger{display:flex}.site-header-inner{padding:var(--space-2) var(--space-2);position:relative}.site-nav{display:none}.site-header-actions{gap:var(--space-1)}}@media (min-width:769px){#app{padding:var(--space-7) var(--space-4)}}@media (min-width:1024px){.site-header-inner{padding:var(--space-2) var(--space-4)}}@media (min-width:1200px){#app{padding:var(--space-7) var(--space-6)}}.dashboard-header{margin-bottom:var(--space-6);text-align:center}.dashboard-header h1{font-size:var(--fs-display);font-weight:var(--fw-semibold);margin-bottom:var(--space-2)}.dashboard-header p{color:var(--color-text-secondary);font-size:var(--fs-body)}.site-layout{display:flex;flex-direction:column;min-height:100vh;width:100%}.site-header{background:var(--color-surface);border-bottom:1px solid var(--color-border-light);box-shadow:var(--shadow-sm);position:sticky;top:0;transition:background-color var(--transition-normal),border-color var(--transition-normal);z-index:100}.site-header-inner{align-items:center;display:flex;gap:var(--space-5);margin:0 auto;max-width:1200px;padding:var(--space-2) var(--space-4)}.site-logo{color:var(--color-text);font-size:var(--fs-heading);font-weight:var(--fw-semibold);text-decoration:none;transition:color var(--transition-normal);white-space:nowrap}.site-logo:hover{color:var(--color-accent)}.site-nav{align-items:center;display:flex;flex:1;gap:var(--space-1)}.site-nav-link{border-radius:var(--radius-sm);color:var(--color-text-secondary);display:inline-block;font-size:var(--fs-small);padding:var(--space-1) var(--space-2);text-decoration:none;transition:color var(--transition-fast),background-color var(--transition-fast)}.site-nav-link:hover{background-color:var(--color-surface-hover);color:var(--color-text)}.site-nav-link-active{color:var(--color-accent)!important;font-weight:var(--fw-semibold)}.site-nav-link-auth{color:var(--color-accent);font-weight:var(--fw-semibold)}.site-header-actions{align-items:center;display:flex;flex-shrink:0;gap:var(--space-2)}.site-content{align-items:center;display:flex;flex:1;flex-direction:column;justify-content:center;margin:0 auto;padding:var(--space-6) var(--space-4)}.site-content,.site-footer{max-width:1200px;width:100%}.site-footer{background:var(--color-surface);border-top:1px solid var(--color-border-light)}.text-center{text-align:center}.mt-1{margin-top:var(--space-2)}.mt-2{margin-top:var(--space-4)}.mt-3{margin-top:var(--space-5)}.mb-1{margin-bottom:var(--space-2)}.mb-2{margin-bottom:var(--space-4)}.sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border:0;white-space:nowrap}body,body *,body :after,body :before{transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease}@import url("dark-theme.css");