:root,:root[data-theme=light]{color-scheme:light;--t-bg: #f7f9fb;--t-surface: #ffffff;--t-surface-2: #eef1f5;--t-border: #e3e8ee;--t-text: #17202b;--t-muted: #66707d;--t-hint: #8a95a3;--t-accent: #2f6fe4;--t-accent-text: #2f6fe4;--t-accent-soft: rgba(47, 111, 228, .1);--t-accent-border: rgba(47, 111, 228, .35);--t-error: #a32d2d;--t-error-border: rgba(226, 75, 74, .5);--t-success: #0f6e56;--t-success-border: rgba(29, 158, 117, .5)}:root[data-theme=dark]{color-scheme:dark;--t-bg: #0d1117;--t-surface: #161b22;--t-surface-2: #1c2230;--t-border: #2a313c;--t-text: #e6edf3;--t-muted: #9aa7b4;--t-hint: #7c8896;--t-accent: #4c8dff;--t-accent-text: #7fb0ff;--t-accent-soft: rgba(76, 141, 255, .14);--t-accent-border: rgba(76, 141, 255, .4);--t-error: #f09595;--t-error-border: rgba(226, 75, 74, .5);--t-success: #5dcaa5;--t-success-border: rgba(29, 158, 117, .5)}body{margin:0;background:var(--t-bg);transition:background-color .2s ease}.demo-page{max-width:880px;margin:0 auto;padding:48px 20px 80px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--t-text)}.demo-hero{position:relative}.demo-theme{position:absolute;top:0;right:0;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--t-border);border-radius:999px;background:var(--t-surface);color:var(--t-muted);font-size:15px;line-height:1;cursor:pointer;transition:border-color .15s ease,color .15s ease}.demo-theme:hover{border-color:var(--t-accent);color:var(--t-accent)}.demo-hero h1{margin:14px 0 10px;font-size:2.2rem;letter-spacing:-.02em}.demo-hero p{margin:0 0 20px;max-width:640px;color:var(--t-muted);line-height:1.6}.demo-badge{display:inline-block;padding:4px 12px;border:1px solid var(--t-accent-border);border-radius:999px;background:var(--t-accent-soft);color:var(--t-accent-text);font-size:.8rem;font-weight:500}.demo-tabs{display:flex;gap:8px;margin:18px 0 26px}.demo-tab{padding:8px 16px;border:1px solid var(--t-border);border-radius:999px;background:var(--t-surface);color:var(--t-muted);font-size:.88rem;cursor:pointer}.demo-tab--active{background:var(--t-accent-soft);border-color:var(--t-accent);color:var(--t-accent-text)}.demo-notice{margin-bottom:16px;padding:10px 14px;border-radius:8px;font-size:.88rem;border:1px solid var(--t-border);background:var(--t-surface)}.demo-notice--error{border-color:var(--t-error-border);color:var(--t-error)}.demo-notice--success{border-color:var(--t-success-border);color:var(--t-success)}.demo-notice--info{border-color:var(--t-accent-border);color:var(--t-accent-text)}.demo-entry,.demo-qa{display:flex;flex-direction:column;gap:22px}.demo-label{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;margin-bottom:8px;font-weight:600;font-size:.95rem}.demo-hint{color:var(--t-hint);font-size:.78rem;font-weight:400}.demo-widget-tag{padding:1px 8px;border-radius:999px;background:var(--t-accent-soft);border:1px solid var(--t-accent-border);color:var(--t-accent-text);font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.demo-input{width:100%;padding:10px 12px;border:1px solid var(--t-border);border-radius:8px;background:var(--t-surface);color:var(--t-text);font-size:.95rem;font-family:inherit}.demo-input:focus{outline:none;border-color:var(--t-accent)}.demo-textarea{resize:vertical;line-height:1.55}.demo-switch{display:inline-flex;align-items:center;gap:10px;color:var(--t-muted);font-size:.9rem;cursor:pointer}.demo-switch input{width:18px;height:18px;accent-color:var(--t-accent)}.demo-chips{display:flex;gap:8px}.demo-chip{padding:3px 12px;border-radius:999px;background:var(--t-surface);border:1px solid var(--t-border);color:var(--t-muted);font-size:.82rem}.demo-widget{padding:14px;border-radius:10px;background:#fff;border:1px solid var(--t-border)}.demo-widget--page{padding:20px}.demo-qa-note{margin:0;color:var(--t-muted);line-height:1.6;max-width:640px}.demo-footer{display:flex;gap:10px;margin-top:40px;color:var(--t-hint);font-size:.85rem}.demo-footer a{color:var(--t-accent-text);text-decoration:none}.demo-footer a:hover{text-decoration:underline}