@import url("https://fonts.googleapis.com/css2?family=Literata:ital,opsz,wght@0,7..72,300;0,7..72,400;0,7..72,600;1,7..72,300;1,7..72,400&family=IBM+Plex+Sans:wght@300;400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap");:root{--bg-base:#0b0b0f;--bg-raised:#111118;--bg-card:#17171f;--bg-card-hover:#1d1d27;--bg-input:#0e0e15;--bg-overlay:rgba(11,11,15,.92);--text-primary:#e9e5de;--text-secondary:#9a958f;--text-muted:#5a5650;--text-inverse:#0b0b0f;--accent:#c97b8a;--accent-soft:rgba(201,123,138,.15);--accent-border:rgba(201,123,138,.3);--color-synced:#7aab8a;--color-synced-bg:rgba(122,171,138,.12);--color-pending:#c9a96e;--color-pending-bg:hsla(39,46%,61%,.12);--color-syncing:#7a9ec9;--color-syncing-bg:rgba(122,158,201,.12);--color-failed:#c97070;--color-failed-bg:hsla(0,45%,61%,.12);--color-conflict:#c9a040;--color-conflict-bg:rgba(201,160,64,.12);--border-subtle:hsla(0,0%,100%,.06);--border-default:hsla(0,0%,100%,.1);--border-strong:hsla(0,0%,100%,.18);--shadow-sm:0 1px 3px rgba(0,0,0,.4),0 1px 2px rgba(0,0,0,.3);--shadow-md:0 4px 16px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.3);--shadow-lg:0 12px 40px rgba(0,0,0,.6),0 4px 12px rgba(0,0,0,.4);--font-display:"Literata","Georgia",serif;--font-ui:"IBM Plex Sans",system-ui,sans-serif;--font-mono:"IBM Plex Mono","Courier New",monospace;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--ease-out:cubic-bezier(0.22,1,0.36,1);--ease-spring:cubic-bezier(0.34,1.56,0.64,1);--nav-h:60px;--sidebar-w:220px;--content-max:960px}[data-theme=light]{--bg-base:#f8f5f2;--bg-raised:#f2ede8;--bg-card:#fff;--bg-card-hover:#faf7f4;--bg-input:#fdfcfb;--bg-overlay:hsla(30,30%,96%,.95);--text-primary:#1e1c19;--text-secondary:#6b6560;--text-muted:#a09890;--text-inverse:#f8f5f2;--accent:#5a7a58;--accent-soft:rgba(90,122,88,.1);--accent-border:rgba(90,122,88,.25);--color-synced:#3d7a52;--color-synced-bg:rgba(61,122,82,.08);--color-pending:#8a6a2a;--color-pending-bg:rgba(138,106,42,.08);--color-syncing:#2a5a8a;--color-syncing-bg:rgba(42,90,138,.08);--color-failed:#8a3535;--color-failed-bg:rgba(138,53,53,.08);--color-conflict:#7a6010;--color-conflict-bg:rgba(122,96,16,.08);--border-subtle:rgba(0,0,0,.05);--border-default:rgba(0,0,0,.09);--border-strong:rgba(0,0,0,.16);--shadow-sm:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);--shadow-md:0 4px 16px rgba(0,0,0,.08),0 2px 6px rgba(0,0,0,.05);--shadow-lg:0 12px 40px rgba(0,0,0,.1),0 4px 12px rgba(0,0,0,.06)}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:var(--font-ui);background-color:var(--bg-base);color:var(--text-primary);line-height:1.6;transition:background-color .3s var(--ease-out),color .3s var(--ease-out);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E")}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:600;line-height:1.25;letter-spacing:-.02em;color:var(--text-primary)}h1{font-size:clamp(1.75rem,4vw,2.5rem)}h2{font-size:clamp(1.25rem,3vw,1.75rem)}h3{font-size:1.2rem}h4{font-size:1rem;font-weight:500}p{color:var(--text-secondary)}a{color:var(--accent);text-decoration:none;transition:opacity .15s}a:hover{opacity:.8}code,pre{font-family:var(--font-mono);font-size:.875em}.app-shell{display:flex;flex-direction:column;min-height:100vh}.page-content{flex:1 1;max-width:var(--content-max);margin:0 auto;padding:32px 20px 80px;width:100%}.navbar{position:-webkit-sticky;position:sticky;top:0;z-index:100;height:var(--nav-h);background:var(--bg-raised);border-bottom:1px solid var(--border-subtle);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:background .3s,border-color .3s}.navbar-inner{max-width:var(--content-max);margin:0 auto;padding:0 20px;height:100%;display:flex;align-items:center;gap:8px}.navbar-brand{gap:10px;text-decoration:none;margin-right:4px}.navbar-brand,.navbar-brand-icon{display:flex;align-items:center;flex-shrink:0}.navbar-brand-icon{width:32px;height:32px;background:var(--accent-soft);border:1px solid var(--accent-border);border-radius:var(--radius-sm);justify-content:center;font-size:16px}.navbar-brand-text{font-family:var(--font-display);font-size:.95rem;font-weight:600;color:var(--text-primary);line-height:1.2;letter-spacing:-.02em}.navbar-brand-sub{font-family:var(--font-ui);font-size:.65rem;font-weight:400;color:var(--text-muted);letter-spacing:.04em;display:block}.navbar-nav{gap:2px;flex:1 1;list-style:none}.nav-link,.navbar-nav{display:flex;align-items:center}.nav-link{gap:6px;padding:6px 12px;border-radius:var(--radius-sm);font-size:.82rem;font-weight:500;color:var(--text-secondary);text-decoration:none;cursor:pointer;background:none;border:none;transition:all .15s;white-space:nowrap}.nav-link:hover{color:var(--text-primary);background:var(--bg-card)}.nav-link.active{color:var(--accent);background:var(--accent-soft)}.nav-icon{font-size:14px;flex-shrink:0}.navbar-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0}.card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);transition:background .3s,border-color .3s,box-shadow .2s}.card:hover{border-color:var(--border-default);box-shadow:var(--shadow-md)}.card-sm{padding:16px;border-radius:var(--radius-md)}.card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}.card-title{font-family:var(--font-display);font-size:1.1rem;font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:8px}.card-subtitle{font-size:.8rem;color:var(--text-muted);margin-top:2px;font-weight:400}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:var(--radius-md);font-family:var(--font-ui);font-size:.875rem;font-weight:500;cursor:pointer;border:1px solid transparent;transition:all .18s var(--ease-out);text-decoration:none;white-space:nowrap;min-height:40px;-webkit-tap-highlight-color:transparent}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none!important}.btn-primary{background:var(--accent);color:#fff;border-color:transparent;box-shadow:0 2px 8px rgba(0,0,0,.2)}.btn-primary:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,0,0,.25)}.btn-secondary{background:var(--bg-raised);color:var(--text-secondary);border-color:var(--border-default)}.btn-secondary:hover:not(:disabled){color:var(--text-primary);border-color:var(--border-strong);background:var(--bg-card-hover)}.btn-ghost{background:transparent;color:var(--text-secondary);border-color:transparent}.btn-ghost:hover:not(:disabled){background:var(--bg-card);color:var(--text-primary)}.btn-danger{background:var(--color-failed-bg);color:var(--color-failed);border-color:hsla(0,45%,61%,.25)}.btn-danger:hover:not(:disabled){background:var(--color-failed);color:#fff}.btn-sm{padding:7px 12px;font-size:.8rem;min-height:34px;border-radius:var(--radius-sm)}.btn-lg{padding:14px 28px;font-size:1rem;min-height:52px;border-radius:var(--radius-lg)}.btn-icon{width:40px;height:40px;padding:0;border-radius:50%;flex-shrink:0}.form-group{display:flex;flex-direction:column;gap:6px}.form-label{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.form-label-required:after{content:" *";color:var(--accent)}.form-input,.form-select,.form-textarea{width:100%;background:var(--bg-input);border:1px solid var(--border-default);border-radius:var(--radius-md);padding:11px 14px;font-family:var(--font-ui);font-size:.9rem;color:var(--text-primary);outline:none;transition:border-color .15s,box-shadow .15s,background .3s;min-height:44px}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-muted)}.form-textarea{resize:vertical;min-height:88px;line-height:1.5}.form-hint{font-size:.75rem;color:var(--text-muted);margin-top:2px}.form-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:16px;gap:16px}@media (max-width:480px){.form-grid{grid-template-columns:1fr}}.toggle-wrapper{display:flex;align-items:center;gap:12px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.toggle-switch{position:relative;width:44px;height:24px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0;position:absolute}.toggle-track{position:absolute;inset:0;background:var(--border-default);border-radius:12px;border:1px solid var(--border-default);transition:background .2s,border-color .2s}.toggle-thumb{position:absolute;top:2px;left:2px;width:18px;height:18px;background:var(--text-muted);border-radius:50%;transition:transform .22s var(--ease-spring),background .2s}.toggle-switch input:checked~.toggle-track{background:var(--accent);border-color:var(--accent)}.toggle-switch input:checked~.toggle-thumb{transform:translateX(20px);background:#fff}.toggle-label-text{font-size:.875rem;font-weight:500;color:var(--text-primary)}.toggle-label-sub{font-size:.75rem;color:var(--text-muted);margin-top:1px}.range-wrapper{display:flex;flex-direction:column;gap:8px}.range-header{display:flex;justify-content:space-between;align-items:baseline}.range-value{font-family:var(--font-mono);font-size:.875rem;font-weight:500;color:var(--accent)}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;background:var(--border-default);border-radius:2px;outline:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent);cursor:pointer;border:2px solid var(--bg-card);box-shadow:0 2px 6px rgba(0,0,0,.3);-webkit-transition:transform .15s var(--ease-spring);transition:transform .15s var(--ease-spring)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);cursor:pointer;border:2px solid var(--bg-card)}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:100px;font-size:.72rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}.badge-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.badge-pending{background:var(--color-pending-bg);color:var(--color-pending)}.badge-pending .badge-dot{background:var(--color-pending)}.badge-syncing{background:var(--color-syncing-bg);color:var(--color-syncing);animation:badge-pulse 1.4s ease-in-out infinite}.badge-syncing .badge-dot{background:var(--color-syncing)}.badge-synced{background:var(--color-synced-bg);color:var(--color-synced)}.badge-synced .badge-dot{background:var(--color-synced)}.badge-failed{background:var(--color-failed-bg);color:var(--color-failed)}.badge-failed .badge-dot{background:var(--color-failed)}.badge-conflict{background:var(--color-conflict-bg);color:var(--color-conflict)}@keyframes badge-pulse{0%,to{opacity:1}50%{opacity:.55}}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:12px;gap:12px}@media (max-width:600px){.stat-grid{grid-template-columns:repeat(2,1fr)}}.stat-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:16px;display:flex;flex-direction:column;gap:4px;transition:all .2s}.stat-number{font-family:var(--font-display);font-size:2rem;font-weight:300;line-height:1;letter-spacing:-.04em}.stat-label{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.record-list{display:flex;flex-direction:column;gap:8px}.record-item{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:14px 16px;display:grid;grid-template-columns:1fr auto;grid-gap:12px;gap:12px;align-items:center;transition:all .2s}.record-item:hover{border-color:var(--border-default);background:var(--bg-card-hover)}.record-item.has-conflict{border-color:var(--color-conflict);background:var(--color-conflict-bg)}.record-name{font-family:var(--font-display);font-size:1rem;font-weight:600;color:var(--text-primary)}.record-meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}.record-meta-item{font-size:.78rem;color:var(--text-muted);display:flex;align-items:center;gap:4px}.progress-bar-wrapper{background:var(--border-subtle);border-radius:100px;height:4px;overflow:hidden}.progress-bar-fill{height:100%;border-radius:100px;background:var(--accent);transition:width .4s var(--ease-out)}.sync-log{background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:12px;max-height:200px;overflow-y:auto;font-family:var(--font-mono);font-size:.78rem;line-height:1.7;display:flex;flex-direction:column;gap:1px}.sync-log-entry{display:flex;gap:8px;color:var(--text-muted)}.sync-log-entry .log-time{color:var(--text-muted);flex-shrink:0;opacity:.6}.sync-log-entry.log-success{color:var(--color-synced)}.sync-log-entry.log-warn{color:var(--color-pending)}.sync-log-entry.log-error{color:var(--color-failed)}.sync-log-entry.log-info{color:var(--text-secondary)}.alert{display:flex;gap:10px;padding:12px 16px;border-radius:var(--radius-md);font-size:.875rem;align-items:flex-start;border:1px solid transparent}.alert-icon{font-size:1rem;flex-shrink:0;margin-top:1px}.alert-offline{background:var(--color-failed-bg);border-color:hsla(0,45%,61%,.2);color:var(--color-failed)}.alert-warning{background:var(--color-conflict-bg);border-color:rgba(201,160,64,.2);color:var(--color-conflict)}.alert-info{background:var(--color-syncing-bg);border-color:rgba(122,158,201,.2);color:var(--color-syncing)}.divider{border:none;border-top:1px solid var(--border-subtle);margin:20px 0}.empty-state{text-align:center;padding:48px 24px;color:var(--text-muted)}.empty-state-icon{font-size:2.5rem;margin-bottom:12px;opacity:.5}.empty-state-title{font-family:var(--font-display);font-size:1rem;font-weight:600;color:var(--text-secondary);margin-bottom:6px}.section-header{justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}.section-header,.section-title{display:flex;align-items:center}.section-title{font-family:var(--font-display);font-size:1.35rem;font-weight:600;letter-spacing:-.02em;gap:10px}.section-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--accent-soft);border:1px solid var(--accent-border);border-radius:var(--radius-sm);font-size:1.1rem;flex-shrink:0}.two-col{grid-template-columns:1fr 1fr;grid-gap:20px;align-items:start}.three-col,.two-col{display:grid;gap:20px}.three-col{grid-template-columns:1fr 1fr 1fr;grid-gap:20px}@media (max-width:768px){.three-col,.two-col{grid-template-columns:1fr}}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-4{gap:4px}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.gap-20{gap:20px}.gap-24{gap:24px}.flex-1{flex:1 1}.w-full{width:100%}.mt-4{margin-top:4px}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-20{margin-top:20px}.mt-24{margin-top:24px}.mb-4{margin-bottom:4px}.mb-8{margin-bottom:8px}.mb-12{margin-bottom:12px}.mb-16{margin-bottom:16px}.mb-20{margin-bottom:20px}.mb-24{margin-bottom:24px}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.text-accent{color:var(--accent)}.font-mono{font-family:var(--font-mono)}.font-display{font-family:var(--font-display)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flex-wrap{flex-wrap:wrap}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(1turn)}}.animate-fade-in{animation:fadeInUp .35s var(--ease-out) both}.animate-spin{animation:spin 1s linear infinite}.stagger>:first-child{animation-delay:0ms}.stagger>:nth-child(2){animation-delay:60ms}.stagger>:nth-child(3){animation-delay:.12s}.stagger>:nth-child(4){animation-delay:.18s}.stagger>:nth-child(5){animation-delay:.24s}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}.mobile-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:60px;background:var(--bg-raised);border-top:1px solid var(--border-subtle);z-index:200;padding:0 8px;align-items:center;justify-content:space-around;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.mobile-nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 12px;border-radius:var(--radius-sm);cursor:pointer;background:none;border:none;color:var(--text-muted);font-family:var(--font-ui);font-size:.65rem;font-weight:500;transition:all .15s;-webkit-tap-highlight-color:transparent;text-transform:uppercase;letter-spacing:.05em}.mobile-nav-item.active{color:var(--accent)}.mobile-nav-icon{font-size:1.1rem}@media (max-width:640px){.navbar-nav{display:none}.mobile-nav{display:flex}.page-content{padding-bottom:76px}}.theme-toggle{width:36px;height:36px;border-radius:50%;background:var(--bg-card);border:1px solid var(--border-default);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1rem;transition:all .2s;flex-shrink:0}.theme-toggle:hover{border-color:var(--accent);background:var(--accent-soft)}.conflict-banner{background:var(--color-conflict-bg);border:1px solid var(--color-conflict);border-radius:var(--radius-md);padding:12px 16px;margin-top:8px;font-size:.8rem;color:var(--color-conflict);display:flex;gap:8px;align-items:flex-start}.phase-list{display:flex;flex-direction:column;gap:0}.phase-item{display:flex;gap:16px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--border-subtle)}.phase-item:last-child{border-bottom:none}.phase-num{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;flex-shrink:0;margin-top:2px}.phase-num.active{background:var(--accent);color:#fff}.phase-num.future{background:var(--border-default);color:var(--text-muted)}.phase-name{font-weight:600;font-size:.9rem;color:var(--text-primary)}.phase-desc{font-size:.8rem;color:var(--text-muted);margin-top:3px;line-height:1.5}.about-hero{text-align:center;padding:48px 0 32px}.about-hero h1{margin-bottom:12px}.about-hero p{max-width:580px;margin:0 auto;font-size:1rem;line-height:1.7}.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:12px;gap:12px;margin:28px 0}@media (max-width:600px){.fact-grid{grid-template-columns:1fr}}.fact-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:20px;text-align:center}.fact-number{font-family:var(--font-display);font-size:2rem;font-weight:300;color:var(--accent);letter-spacing:-.04em;line-height:1;margin-bottom:4px}.fact-desc{font-size:.8rem;color:var(--text-muted);line-height:1.4}