:root{--bg: #f7f8fb;--surface: #ffffff;--text: #0f172a;--muted: #64748b;--border: #e2e8f0;--primary: #2563eb;--primary-700: #1d4ed8;--info: #0ea5e9;--success: #16a34a;--danger: #dc2626;--warning: #d97706;--radius: 12px;--shadow: 0 8px 24px rgba(15, 23, 42, .06);--surface-muted: #f1f5f9;--surface-hover: #f8fafc;--stroke-soft: #dbeafe;--badge-default-bg: #f1f5f9;--badge-success-bg: #ecfdf5;--badge-warning-bg: #fffbeb;--badge-danger-bg: #fef2f2;--badge-info-bg: #eff6ff}*{box-sizing:border-box}html{height:100%;overflow-y:scroll}body{min-height:100vh;display:flex;flex-direction:column}:root[data-theme=dark]{--bg: #0b1220;--surface: #0f172a;--text: #e5e7eb;--muted: #94a3b8;--border: #334155;--primary: #3b82f6;--primary-700: #1d4ed8;--shadow: 0 8px 24px rgba(0, 0, 0, .4);--info: #38bdf8;--surface-muted: #13203a;--surface-hover: rgba(148, 163, 184, .18);--stroke-soft: rgba(100, 116, 139, .35);--badge-default-bg: rgba(148, 163, 184, .2);--badge-success-bg: rgba(22, 163, 74, .22);--badge-warning-bg: rgba(217, 119, 6, .22);--badge-danger-bg: rgba(220, 38, 38, .22);--badge-info-bg: rgba(56, 189, 248, .22)}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica Neue,Arial,"Apple Color Emoji","Segoe UI Emoji";color:var(--text);background:var(--bg);direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root,[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark}@media (prefers-reduced-motion: no-preference){html,body,.card,.btn,.input,.select,.textarea,.nav-link,.badge,.list-item{transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease}}img,svg,video{display:block;max-width:100%}h1,h2,h3,h4,h5,h6{margin:0 0 .5rem;line-height:1.2}p{margin:.5rem 0 1rem;color:var(--muted)}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}.container{max-width:1200px;margin:0 auto;padding:1rem}.navbar{position:sticky;top:0;z-index:40;-webkit-backdrop-filter:saturate(180%) blur(8px);backdrop-filter:saturate(180%) blur(8px);background:color-mix(in srgb,var(--surface) 92%,transparent);border-bottom:1px solid var(--border);direction:ltr;unicode-bidi:isolate}.navbar.scrolled{background:color-mix(in srgb,var(--surface) 98%,transparent);box-shadow:var(--shadow)}.navbar-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem}.brand{font-weight:700;letter-spacing:.2px}.brand .logo{width:28px;height:28px;border-radius:6px}.nav-links{display:flex;gap:.5rem;flex-wrap:wrap}.nav-link{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .7rem;font-weight:500;color:var(--text);border-radius:8px}.nav-link:hover{background:color-mix(in srgb,var(--surface) 88%,transparent);text-decoration:none}.nav-link.active{color:var(--primary);background:color-mix(in srgb,var(--primary) 15%,var(--surface));border:1px solid color-mix(in srgb,var(--primary) 30%,var(--border))}.tabs{display:flex;flex-wrap:wrap;gap:.25rem;border-bottom:1px solid var(--border)}.tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid transparent;background:transparent;color:var(--text);padding:.45rem .75rem;border-top-left-radius:10px;border-top-right-radius:10px;font-weight:600;cursor:pointer}.tab:hover{background:color-mix(in srgb,var(--surface) 88%,transparent)}.tab.active{color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--surface));border-color:color-mix(in srgb,var(--primary) 30%,var(--border));border-bottom-color:transparent}.tab-panel{padding-top:.75rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem .9rem;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;text-decoration:none;font-weight:600;line-height:1;box-shadow:var(--shadow);will-change:transform}.btn:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 40%,transparent);outline-offset:2px}.btn svg{pointer-events:none}.btn .spinner{width:1rem;height:1rem}.btn:hover{filter:brightness(.98)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-sm{padding:.45rem .65rem;border-radius:8px;font-size:.92rem}.btn-primary{background:var(--primary);color:#fff;border-color:color-mix(in srgb,var(--primary) 70%,black)}.btn-primary:hover{background:var(--primary-700)}.btn-outline{background:transparent;color:var(--primary);border-color:var(--primary)}.btn-ghost{border-color:transparent;background:transparent}.btn-ghost:hover{background:color-mix(in srgb,var(--surface) 88%,transparent)}button.secondary,button.link{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:.5rem .75rem;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-weight:600;line-height:1;cursor:pointer}button.secondary:focus-visible,button.link:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 40%,transparent);outline-offset:2px}button.secondary:disabled,button.link:disabled{opacity:.6;cursor:not-allowed}button.secondary{background:transparent;color:var(--primary);border-color:var(--primary)}button.secondary:hover{background:color-mix(in srgb,var(--primary) 12%,var(--surface))}button.link{background:transparent;border-color:transparent;color:var(--muted);text-decoration:underline}button.link:hover{color:var(--text);background:color-mix(in srgb,var(--surface) 88%,transparent)}.toolbar button,.header-actions button{padding:.45rem .65rem;border-radius:8px}form{display:grid;gap:1rem}.label{font-weight:600;color:var(--text);margin-bottom:.25rem}.field{display:grid;gap:.5rem}.input,.select,.textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;padding:.65rem .8rem;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text)}.input:focus,.select:focus,.textarea:focus{outline:none;border-color:color-mix(in srgb,var(--primary) 70%,white);box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 20%,transparent)}.input:disabled,.select:disabled,.textarea:disabled{opacity:.7;cursor:not-allowed}.help{color:var(--muted);font-size:.9rem}.error{color:var(--danger)}.success{color:var(--success)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow)}.form-grid{display:grid;gap:.75rem;grid-template-columns:1fr;align-items:start;grid-auto-flow:row dense}@media (min-width: 640px){.form-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.form-grid{grid-template-columns:repeat(3,1fr)}}.span-full{grid-column:1 / -1}.list{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}.list-item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 1rem;border:1px solid var(--border);border-radius:10px;background:var(--surface)}.item-title{font-weight:600;color:var(--text)}.item-meta{color:var(--muted);font-size:.95rem}table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}thead th{text-align:left;font-weight:700;color:var(--muted);background:color-mix(in srgb,var(--surface) 92%,var(--primary) 8%)}th,td{padding:.75rem .9rem;border-bottom:1px solid var(--border)}tbody tr:hover{background:color-mix(in srgb,var(--surface) 92%,transparent)}tbody tr:last-child td{border-bottom:0}.badge{display:inline-flex;align-items:center;gap:.4rem;padding:.2rem .5rem;border-radius:999px;font-size:.8rem;border:1px solid var(--stroke-soft);background:var(--badge-default-bg);color:var(--muted)}.badge-success{background:var(--badge-success-bg);color:color-mix(in srgb,var(--success) 75%,var(--text) 25%);border-color:color-mix(in srgb,var(--success) 32%,var(--stroke-soft) 68%)}.badge-warning{background:var(--badge-warning-bg);color:color-mix(in srgb,var(--warning) 72%,var(--text) 28%);border-color:color-mix(in srgb,var(--warning) 32%,var(--stroke-soft) 68%)}.badge-danger{background:var(--badge-danger-bg);color:color-mix(in srgb,var(--danger) 72%,var(--text) 28%);border-color:color-mix(in srgb,var(--danger) 32%,var(--stroke-soft) 68%)}.badge-info{background:var(--badge-info-bg);color:color-mix(in srgb,var(--primary) 70%,var(--text) 30%);border-color:color-mix(in srgb,var(--primary) 30%,var(--stroke-soft) 70%)}.prose{line-height:1.7;unicode-bidi:plaintext}.prose h1,.prose h2,.prose h3{margin-top:1.2rem}.prose p{margin:.75rem 0;color:var(--text)}.prose ul,.prose ol{padding-left:1.2rem;margin:.75rem 0}.prose pre,.prose code{background:#0f172a0d;padding:.1rem .3rem;border-radius:6px}details{border:1px solid var(--border);border-radius:10px;padding:.5rem .75rem;background:var(--surface)}summary{cursor:pointer;font-weight:600;color:var(--text)}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:1rem}.mt-4{margin-top:1.5rem}.mr-1{margin-right:.25rem}.flex{display:flex}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.justify-between{justify-content:space-between}.align-center{align-items:center}.text-muted{color:var(--muted)}.text-right{text-align:right}.center{display:grid;place-items:center}.inline{display:inline;margin:0}.icon{width:1.1rem;height:1.1rem;display:inline-block;vertical-align:-2px;color:currentColor}.icon-lg{width:2.5rem;height:2.5rem}.illustration{width:160px;max-width:60%;opacity:.95;filter:drop-shadow(0 2px 6px rgba(0,0,0,.08))}@keyframes spin{to{transform:rotate(360deg)}}.spinner{display:inline-block;width:1rem;height:1rem;border-radius:999px;box-sizing:border-box;border:2px solid currentColor;border-right-color:transparent;animation:spin .8s linear infinite}.btn-secondary{background:#eef2ff;color:var(--primary);border-color:#c7d2fe}.btn-secondary:hover{background:#e0e7ff}.btn-danger{background:var(--danger);color:#fff;border-color:#b91c1c}.btn-danger:hover{background:#b91c1c}.card.hoverable{transition:transform .18s ease,box-shadow .18s ease}.card.hoverable:hover{transform:translateY(-2px);box-shadow:0 12px 28px #0f172a17}.list-item.interactive{transition:background .15s ease,transform .15s ease,box-shadow .15s ease;cursor:pointer}.list-item.interactive:hover{background:var(--surface-hover);box-shadow:var(--shadow);transform:translateY(-1px)}.progress{height:10px;background:#f1f5f9;border-radius:999px;overflow:hidden;border:1px solid var(--border)}.progress-bar{height:100%;background:var(--primary);border-radius:999px;transition:width .3s ease}.hero{position:relative;overflow:hidden}.hero-bg{position:absolute;top:-20%;right:-20%;bottom:-20%;left:-20%;background:radial-gradient(600px 300px at 10% -10%,#60a5fa22,transparent),radial-gradient(600px 300px at 90% -10%,#34d39922,transparent);filter:blur(10px);pointer-events:none}main{padding:1rem;unicode-bidi:isolate;flex:1 0 auto}@media (min-width: 640px){main{padding:1.5rem}}@media (min-width: 1024px){main{padding:2rem}}.footer{border-top:1px solid var(--border);background:color-mix(in srgb,var(--surface) 94%,transparent)}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;color:var(--muted)}@keyframes routeFade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.route-enter{animation:routeFade .24s ease}.reveal{opacity:0;transform:translateY(8px)}.reveal.revealed{opacity:1;transform:none;transition:opacity .42s ease,transform .42s ease}.reveal-left{transform:translate(-12px)}.reveal-right{transform:translate(12px)}.reveal-up{transform:translateY(12px)}.reveal-down{transform:translateY(-12px)}.reveal-zoom{transform:scale(.98)}.skeleton{position:relative;overflow:hidden;background:#e5e7eb;border-radius:10px}:root[data-theme=dark] .skeleton{background:#1f2937}.skeleton.shimmer:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,#ffffff55,transparent);transform:translate(-100%);animation:shimmer 1.2s ease-in-out infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes blobShift{0%{transform:translateY(0) scale(1)}50%{transform:translateY(6px) scale(1.01)}to{transform:translateY(0) scale(1)}}.hero .hero-bg{animation:blobShift 10s ease-in-out infinite}@media (prefers-reduced-motion: reduce){.route-enter,.reveal.revealed,.hero .hero-bg{animation:none!important}.reveal.revealed{transition:none!important}}.textarea.code-editor{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;white-space:pre;overflow:auto;line-height:1.45;-moz-tab-size:2;tab-size:2;resize:vertical}.textarea.code-editor:focus{outline:none}textarea[wrap=off]{white-space:pre;overflow-x:auto}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.small{font-size:.875rem}kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:.85em;background:color-mix(in srgb,var(--surface) 80%,black);border:1px solid var(--border);border-bottom-color:color-mix(in srgb,var(--border) 80%,black);border-radius:6px;box-shadow:inset 0 -1px color-mix(in srgb,var(--border) 60%,black);padding:.05rem .35rem}.stretched-link{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;border-radius:inherit;color:inherit}.list-item .btn,.list-item .item-title,.list-item select,.list-item input{position:relative;z-index:2}