.custom-select{position:relative}.custom-select-trigger{justify-content:center;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xxs) var(--spacing-sm);border-radius:var(--radius-md);min-width:44px;min-height:44px;color:var(--color-text-secondary);font-size:var(--font-size-sm);cursor:pointer;transition:background-color .15s;display:flex}.custom-select-trigger:hover{background-color:var(--color-bg-secondary)}.custom-select-icon{align-items:center;display:flex}.custom-select-value{color:var(--color-text-primary)}.custom-select-chevron{color:var(--color-text-tertiary);transition:transform .15s}.custom-select-chevron.open{transform:rotate(180deg)}.custom-select-menu{top:calc(100% + var(--spacing-xxs));z-index:50;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-popover);min-width:120px;position:absolute;inset-inline-end:0;overflow:hidden}.custom-select-option{width:100%;padding:var(--spacing-sm) var(--spacing-md);text-align:start;font-size:var(--font-size-sm);color:var(--color-text-primary);white-space:nowrap;transition:background-color .15s;display:block}.custom-select-option:hover{background-color:var(--color-bg-secondary)}.custom-select-option.active{color:var(--color-accent);font-weight:600}@media (width<=767px){.custom-select-value{font-size:var(--font-size-xs);text-overflow:ellipsis;white-space:nowrap;max-width:64px;overflow:hidden}}.header{align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-xl);background-color:var(--color-surface);border-bottom:1px solid var(--color-border);z-index:10;min-height:56px;display:flex;position:sticky;top:0}.header-left,.header-nav{align-items:center;display:flex}.header-right{align-items:center;gap:var(--spacing-md);margin-inline-start:auto;display:flex}.logo{font-size:var(--font-size-lg);color:var(--color-text-primary);font-weight:700}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.tab-bar{background-color:var(--color-bg-secondary);border-radius:var(--radius-pill);padding:3px;display:flex}.tab-btn{padding:var(--spacing-xs) var(--spacing-lg);border-radius:var(--radius-pill);min-height:44px;color:var(--color-text-primary);align-items:center;font-weight:600;transition:all .15s;display:flex}.tab-btn:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}.tab-btn:active{background-color:var(--color-bg-tertiary);transform:none}.tab-btn.active{background-color:var(--color-text-primary);color:var(--color-text-inverse)}.offline-indicator{font-size:var(--font-size-xs);color:var(--color-text-secondary);background-color:var(--color-bg-tertiary);padding:var(--spacing-xxs) var(--spacing-xs);border-radius:var(--radius-pill);align-items:center;gap:4px;display:flex}.install-btn{background-color:var(--color-accent);color:var(--color-on-accent);padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-pill);min-height:44px;font-size:var(--font-size-sm);align-items:center;gap:6px;font-weight:700;display:flex}.install-btn:hover{background-color:var(--color-accent-hover)}.header-icon-btn{border-radius:var(--radius-pill);background-color:var(--color-bg-secondary);width:44px;height:44px;color:var(--color-text-primary);justify-content:center;align-items:center;text-decoration:none;transition:all .15s;display:flex}.header-icon-btn:hover{background-color:var(--color-bg-tertiary)}.header-icon-btn:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}@media (width<=1023px){.header{gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm)}.header-right{gap:var(--spacing-xs)}}@media (width<=767px){.header{gap:var(--spacing-xxs) var(--spacing-xs);padding:var(--spacing-xxs) var(--spacing-sm);grid-template-rows:auto auto;grid-template-columns:auto 1fr;display:grid}.header-left{grid-area:1/1}.header-nav{grid-area:2/1/auto/-1;justify-content:center}.header-right{justify-self:end;gap:var(--spacing-xs);grid-area:1/2}.logo{font-size:var(--font-size-md)}.tab-bar{width:100%}.tab-btn{text-align:center;font-size:var(--font-size-sm);padding:var(--spacing-xxs) var(--spacing-xs);flex:1;justify-content:center}.install-label{display:none}}.footer{padding:var(--spacing-lg) var(--spacing-xl);background-color:var(--color-bg-primary);border-top:1px solid var(--color-border);font-size:var(--font-size-xs);color:var(--color-text-secondary)}.footer-content{justify-content:space-between;align-items:center;display:flex}.footer-right{align-items:center;gap:var(--spacing-md);display:flex}.github-link{color:var(--color-text-secondary);transition:color .15s}.github-link:hover{color:var(--color-text-primary)}@media (width<=768px){.footer-content{gap:var(--spacing-xs);text-align:center;flex-direction:column}}@media (width<=480px){.footer{padding:var(--spacing-sm) var(--spacing-sm)}}.layout-container{flex-direction:column;min-height:100vh;display:flex}.layout-main{flex-direction:column;flex:1;display:flex;position:relative}.global-toast{bottom:var(--spacing-xl);z-index:9999;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-pill);box-shadow:var(--shadow-xl);color:#fff;min-width:280px;max-width:90vw;animation:.3s cubic-bezier(.16,1,.3,1) toast-slide-up;display:flex;position:fixed;left:50%;transform:translate(-50%)}.global-toast.toast-error{background-color:var(--color-error)}.global-toast.toast-success{background-color:var(--color-success)}.global-toast.toast-info{background-color:var(--color-accent)}.toast-message{font-size:var(--font-size-sm);flex:1;font-weight:500}.toast-close{color:#fffc;cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;margin-right:-8px;padding:4px;transition:background-color .15s,color .15s;display:flex}.toast-close:hover{color:#fff;background-color:#fff3}@keyframes toast-slide-up{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}:root{--spacing-xxs:2px;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:12px;--spacing-lg:16px;--spacing-xl:24px;--spacing-xxl:32px;--spacing-section:80px;--radius-none:0px;--radius-xs:2px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-pill:9999px;--radius-full:9999px;--font-sans:"IBM Plex Sans", "IBM Plex Sans Arabic", -apple-system, system-ui, sans-serif;--font-mono:ui-monospace, "Source Code Pro", "SFMono-Regular", monospace;--font-size-micro:12px;--font-size-xs:12px;--font-size-sm:14px;--font-size-md:16px;--font-size-btn-lg:18px;--font-size-lg:21px;--font-size-xl:24px;--font-size-lead:24px;--font-size-display-md:36px;--font-size-display-lg:36px;--font-size-hero:36px;--transition-colors:color .15s ease, background-color .15s ease, border-color .15s ease;--transition-transform:transform .15s ease}html[data-theme=light]{--color-bg-primary:#eeefe9;--color-bg-secondary:#e5e7e0;--color-bg-tertiary:#dcdfd2;--color-surface:#fff;--color-surface-raised:#fcfcfa;--color-border:#bfc1b7;--color-border-focus:#2c84e0;--color-border-soft:#dcdfd2;--color-text-primary:#23251d;--color-text-secondary:#3d3e36;--color-text-tertiary:#4a4b42;--color-text-muted:#4a4b42;--color-text-inverse:#fff;--color-accent:#23251d;--color-accent-hover:#4d4f46;--color-accent-active:#1a1c16;--color-on-accent:#fff;--color-success:#2c8c66;--color-warning:#f7a501;--color-error:#cd4239;--color-success-soft:#d9eddf;--color-error-soft:#f7d6d3;--color-info-soft:#dceaf6;--color-link:#1d4ed8;--color-surface-chip:#e5e7e0;--color-preview-bg:#eeefe9;--color-surface-dark:#23251d;--shadow-product:none;--shadow-hairline:0 0 0 1px #bfc1b7;--shadow-popover:0 4px 16px #23251d1f;--shadow-inner:inset 6px 0 12px -6px #0000000f}html[data-theme=dark]{--color-bg-primary:#1a1c16;--color-bg-secondary:#23251d;--color-bg-tertiary:#2d2f27;--color-surface:#33342d;--color-surface-raised:#3a3c34;--color-border:#4d4f46;--color-border-focus:#f7a501;--color-border-soft:#3a3c34;--color-text-primary:#eeefe9;--color-text-secondary:#cdd0c6;--color-text-tertiary:#a4a79c;--color-text-muted:#a4a79c;--color-text-inverse:#1a1c16;--color-accent:#eeefe9;--color-accent-hover:#dcdfd2;--color-accent-active:#fff;--color-on-accent:#23251d;--color-success:#4aba88;--color-warning:#ffb733;--color-error:#e06058;--color-success-soft:#1e3a2a;--color-error-soft:#3d2220;--color-info-soft:#1c2d40;--color-link:#6b8df0;--color-surface-chip:#3a3c34;--color-preview-bg:#23251d;--color-surface-dark:#1a1c16;--shadow-product:none;--shadow-hairline:0 0 0 1px #4d4f46;--shadow-popover:0 4px 16px #0006;--shadow-inner:inset 6px 0 12px -6px #0003}*,:before,:after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}html{font-family:var(--font-sans);font-size:var(--font-size-md);color:var(--color-text-primary);background-color:var(--color-bg-primary);transition:var(--transition-colors);letter-spacing:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{text-rendering:optimizelegibility;min-height:100vh;line-height:1.5}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}input[type=checkbox]{accent-color:var(--color-accent)}button{cursor:pointer;transition:var(--transition-transform);background:0 0;border:none;padding:0}button:active{transform:scale(.97)}a{color:var(--color-link);text-decoration:none}a:hover{text-decoration:underline}ul,ol{margin:0;padding:0;list-style:none}img{max-width:100%;display:block}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}:focus-visible,button:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}html[dir=rtl] .rtl-flip{transform:scaleX(-1)}.hidden{display:none!important}.flex-row-center-gap-8{align-items:center;gap:8px;display:flex}.flex-row-center-gap-4{align-items:center;gap:4px;display:flex}.flex-col-gap-4{flex-direction:column;gap:4px;display:flex}.m-0{margin:0}.mb-sm{margin-bottom:var(--spacing-sm)}.mt-xs{margin-top:var(--spacing-xs)}.text-xs{font-size:var(--font-size-xs)}.text-tertiary{color:var(--color-text-tertiary)}.link-inline{color:var(--color-link);margin-inline-start:var(--spacing-xs);text-decoration:underline}.hint-text{margin:0;font-size:12px}