@import"https://fonts.googleapis.com/css2?family=Fraunces:wght@300;400;500;600;700&family=Atkinson+Hyperlegible:wght@300;400;500;600;700&family=DM+Mono:wght@300;400;500;600;700&display=swap";:root{--color-primary: #c4653a;--color-primary-hover: #a8532e;--color-secondary: #a07830;--color-secondary-hover: #906820;--color-tertiary: #5a7a8a;--color-tertiary-hover: #4a6a7a;--color-accent: #7a5c3a;--color-surface-page: #f8f3ed;--color-surface-card: #fffdf9;--color-surface-raised: #ffffff;--color-surface-sunken: #f0e8de;--color-text-heading: #3a2418;--color-text-body: #5a4030;--color-text-muted: #9a8470;--color-text-inverse: #faf5ef;--color-status-success: #6a8a4a;--color-status-warning: #d4a054;--color-status-error: #c44a3a;--color-status-info: #5a7a9a;--color-border-subtle: #ecdcc8;--color-border-default: #dcc8ae;--color-border-strong: #c4a88a;--font-heading: "Fraunces", serif;--font-body: "Atkinson Hyperlegible", sans-serif;--font-mono: "DM Mono", monospace;--font-size-xs: 12px;--font-size-sm: 12.8px;--font-size-base: 16px;--font-size-lg: 20px;--font-size-xl: 25px;--font-size-2xl: 31.3px;--font-size-3xl: 39.1px;--font-size-4xl: 48.8px;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--leading-tight: 1.15;--leading-normal: 1.65;--leading-relaxed: 1.85;--tracking-tight: -.01em;--tracking-normal: .005em;--tracking-wide: .06em;--space-unit: 8px;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--radius-none: 0;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--radius-full: 9999px;--border-thin: 1px;--border-default: 1.5px;--border-thick: 2px;--border-style: solid;--shadow-sm: 0 1px 3px rgba(58,36,24,.05);--shadow-md: 0 4px 12px rgba(58,36,24,.07);--shadow-lg: 0 8px 28px rgba(58,36,24,.09);--shadow-inner: inset 0 1px 3px rgba(58,36,24,.04);--duration-fast: .18s;--duration-normal: .36s;--duration-slow: .54s;--ease-default: cubic-bezier(.25,.1,.25,1);--ease-enter: cubic-bezier(0,0,.2,1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{overflow-x:hidden;width:100%}[data-theme]{font-family:var(--font-body);font-size:var(--font-size-base);font-weight:var(--font-weight-regular);line-height:var(--leading-normal);letter-spacing:var(--tracking-normal);color:var(--color-text-body);background:var(--color-surface-page);-webkit-font-smoothing:antialiased}.datepicker-dropdown,.search-select-dropdown,.color-dropdown-panel,.font-dropdown-panel,.icon-picker-panel,.split-btn-menu,.dropdown-menu-list,.combobox-list,.popover-content{max-width:calc(100vw - 24px)}.search-select-trigger-chevron svg,.multi-select-chevron svg,.color-dropdown-chevron svg,.font-dropdown-chevron svg,.accordion-chevron svg,.sidebar-toggle svg,.sort-icon svg{width:14px;height:14px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:var(--tracking-wide);line-height:1;padding:10px 20px;border-radius:var(--radius-md);border:var(--border-default) var(--border-style) transparent;cursor:pointer;white-space:nowrap;transition:all var(--duration-fast) var(--ease-default);outline:none}.btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn-primary{background:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);box-shadow:var(--shadow-sm)}.btn-secondary{background:var(--color-surface-card);color:var(--color-text-body);border-color:var(--color-border-default)}.btn-secondary:hover:not(:disabled){background:var(--color-surface-sunken)}.btn-ghost{background:transparent;color:var(--color-text-body);border-color:transparent}.btn-ghost:hover:not(:disabled){background:var(--color-surface-sunken)}.btn-danger{background:var(--color-status-error);color:#fff;border-color:var(--color-status-error)}.btn-danger:hover:not(:disabled){filter:brightness(1.1)}.btn-color-secondary{background:var(--color-secondary);color:#fff;border-color:var(--color-secondary)}.btn-color-secondary:hover:not(:disabled){background:var(--color-secondary-hover)}.btn-color-tertiary{background:var(--color-tertiary);color:#fff;border-color:var(--color-tertiary)}.btn-color-tertiary:hover:not(:disabled){background:var(--color-tertiary-hover)}.btn-success{background:var(--color-status-success);color:#fff;border-color:var(--color-status-success)}.btn-success:hover:not(:disabled){filter:brightness(1.1)}.btn-warning{background:var(--color-status-warning);color:#fff;border-color:var(--color-status-warning)}.btn-warning:hover:not(:disabled){filter:brightness(1.1)}.btn-error{background:var(--color-status-error);color:#fff;border-color:var(--color-status-error)}.btn-error:hover:not(:disabled){filter:brightness(1.1)}.btn-info{background:var(--color-status-info);color:#fff;border-color:var(--color-status-info)}.btn-info:hover:not(:disabled){filter:brightness(1.1)}.btn-icon{display:inline-flex;align-items:center}.btn-icon svg{width:16px;height:16px;flex-shrink:0}.btn-sm .btn-icon svg{width:14px;height:14px}.btn-lg .btn-icon svg{width:18px;height:18px}.btn-icon-left{margin-right:var(--space-xs)}.btn-icon-right{margin-left:var(--space-xs)}.btn-icon-only{padding:0;width:auto;aspect-ratio:1}.split-btn{display:inline-flex;position:relative}.split-btn-main{padding:10px 16px;font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-inverse);background:var(--color-primary);border:none;cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-xs);transition:background var(--duration-fast) var(--ease-default);border-radius:var(--radius-md) 0 0 var(--radius-md)}.split-btn-main:hover{background:var(--color-primary-hover)}.split-btn-main svg{width:16px;height:16px}.split-btn-divider{width:1px;background:#ffffff40}.split-btn-toggle{padding:10px 8px;background:var(--color-primary);border:none;cursor:pointer;color:var(--color-text-inverse);display:flex;align-items:center;transition:background var(--duration-fast) var(--ease-default);border-radius:0 var(--radius-md) var(--radius-md) 0}.split-btn-toggle:hover{background:var(--color-primary-hover)}.split-btn-toggle svg{width:16px;height:16px}.split-btn-menu{position:absolute;top:calc(100% + 4px);right:0;z-index:800;min-width:180px;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-xs) 0;animation:dropIn var(--duration-fast) var(--ease-enter)}.split-btn-item{display:flex;align-items:center;gap:var(--space-sm);padding:8px 14px;font-size:var(--font-size-sm);color:var(--color-text-body);background:none;border:none;cursor:pointer;width:100%;text-align:left;font-family:var(--font-body);transition:background var(--duration-fast) var(--ease-default)}.split-btn-item:hover{background:var(--color-surface-sunken)}.split-btn-item svg{width:16px;height:16px;color:var(--color-text-muted)}.btn-sm{padding:6px 14px;font-size:var(--font-size-xs)}.btn-lg{padding:14px 28px;font-size:var(--font-size-base)}.card{background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-lg);padding:var(--space-xl);transition:box-shadow var(--duration-fast) var(--ease-default),transform var(--duration-fast) var(--ease-default)}.card-elevated{box-shadow:var(--shadow-md)}.card-elevated:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px)}.card-outlined{box-shadow:none;border-color:var(--color-border-default)}.card-standard{box-shadow:none;border-color:var(--color-border-subtle)}.card-sunken{box-shadow:var(--shadow-inner);background:var(--color-surface-sunken);border-color:var(--color-border-subtle)}.card-highlight-primary{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}.card-highlight-primary .card-title{color:var(--color-text-inverse)}.card-highlight-primary .card-description{color:#ffffffb3}.card-highlight-secondary{background:var(--color-secondary);border-color:var(--color-secondary);color:#fff}.card-highlight-secondary .card-title{color:#fff}.card-highlight-secondary .card-description{color:#ffffffb3}.card-highlight-tertiary{background:var(--color-tertiary);border-color:var(--color-tertiary);color:#fff}.card-highlight-tertiary .card-title{color:#fff}.card-highlight-tertiary .card-description{color:#ffffffb3}.card-no-border{border-color:transparent}.card-with-border{border-color:var(--color-border-default)}.card-header{margin-bottom:var(--space-md)}.card-title{font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-heading);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight)}.card-description{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-top:var(--space-xs)}.card-footer{margin-top:var(--space-lg);display:flex;gap:var(--space-sm);align-items:center}.input-wrapper{display:flex;flex-direction:column;gap:var(--space-xs)}.input-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-body);letter-spacing:var(--tracking-wide)}.input-field{font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text-body);background:var(--color-surface-card);padding:10px 14px;border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);outline:none;width:100%;transition:border-color var(--duration-fast) var(--ease-default),box-shadow var(--duration-fast) var(--ease-default)}.input-field::placeholder{color:var(--color-text-muted)}.input-field:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #7c6cf01a}.input-field:disabled{opacity:.5;cursor:not-allowed;background:var(--color-surface-sunken)}.input-field-error{border-color:var(--color-status-error)}.input-hint{font-size:var(--font-size-xs);color:var(--color-text-muted)}.input-error-text{font-size:var(--font-size-xs);color:var(--color-status-error)}.select-field{font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text-body);background:var(--color-surface-card);padding:10px 36px 10px 14px;border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);outline:none;cursor:pointer;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b6b6b' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;transition:border-color var(--duration-fast) var(--ease-default)}.select-field:focus{border-color:var(--color-primary)}.select-field:disabled{opacity:.5;cursor:not-allowed}.switch{display:inline-flex;align-items:center;gap:var(--space-sm);cursor:pointer;-webkit-user-select:none;user-select:none}.switch-track{width:44px;height:24px;border-radius:var(--radius-full);background:var(--color-border-default);position:relative;transition:background var(--duration-fast) var(--ease-default);border:var(--border-thin) var(--border-style) var(--color-border-subtle);flex-shrink:0}.switch-track[data-checked=true]{background:var(--color-primary);border-color:var(--color-primary)}.switch-thumb{width:18px;height:18px;border-radius:var(--radius-full);background:var(--color-surface-card);position:absolute;top:2px;left:2px;box-shadow:var(--shadow-sm);transition:transform var(--duration-fast) var(--ease-default)}.switch-track[data-checked=true] .switch-thumb{transform:translate(20px)}.switch-disabled{opacity:.45;cursor:not-allowed}.switch-label{font-size:var(--font-size-sm);color:var(--color-text-body)}.switch input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.badge{display:inline-flex;align-items:center;gap:var(--space-xs);font-family:var(--font-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:var(--tracking-wide);line-height:1;padding:4px 10px;border-radius:var(--radius-full);white-space:nowrap;border:var(--border-thin) var(--border-style) transparent}.badge-default{background:var(--color-surface-sunken);color:var(--color-text-body);border-color:var(--color-border-subtle)}.badge-primary{background:var(--color-primary);color:var(--color-text-inverse)}.badge-secondary{background:var(--color-secondary);color:#fff}.badge-tertiary{background:var(--color-tertiary);color:#fff}.badge-success{background:var(--color-status-success);color:#fff}.badge-warning{background:var(--color-status-warning);color:#fff}.badge-error{background:var(--color-status-error);color:#fff}.badge-info{background:var(--color-status-info);color:#fff}.badge-outlined{background:transparent;border-color:var(--color-border-default);color:var(--color-text-body)}.avatar{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:var(--radius-full);overflow:hidden;background:var(--color-surface-sunken);color:var(--color-text-muted);font-family:var(--font-heading);font-weight:var(--font-weight-semibold);border:2px solid var(--color-surface-card)}.avatar-sm{width:32px;height:32px;font-size:var(--font-size-xs)}.avatar-md{width:40px;height:40px;font-size:var(--font-size-sm)}.avatar-lg{width:52px;height:52px;font-size:var(--font-size-base)}.avatar img{width:100%;height:100%;object-fit:cover}.avatar-group{display:flex}.avatar-group .avatar{margin-left:-8px}.avatar-group .avatar:first-child{margin-left:0}.table-wrapper{overflow-x:auto;border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-lg);max-width:100%}.table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}.table th{text-align:left;padding:12px 16px;font-family:var(--font-body);font-weight:var(--font-weight-semibold);font-size:var(--font-size-xs);letter-spacing:var(--tracking-wide);color:var(--color-text-muted);text-transform:uppercase;background:var(--color-surface-sunken);border-bottom:var(--border-default) var(--border-style) var(--color-border-default)}.table td{padding:12px 16px;color:var(--color-text-body);border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle)}.table tr:last-child td{border-bottom:none}.table tr:hover td{background:var(--color-surface-sunken)}.checkbox{display:inline-flex;align-items:center;gap:var(--space-sm);cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-box{width:20px;height:20px;border-radius:var(--radius-sm);flex-shrink:0;border:var(--border-default) var(--border-style) var(--color-border-default);background:var(--color-surface-card);display:flex;align-items:center;justify-content:center;transition:all var(--duration-fast) var(--ease-default)}.checkbox-box[data-checked=true]{background:var(--color-primary);border-color:var(--color-primary)}.checkbox-box svg{opacity:0;transition:opacity var(--duration-fast) var(--ease-default)}.checkbox-box[data-checked=true] svg{opacity:1}.checkbox-label{font-size:var(--font-size-sm);color:var(--color-text-body)}.checkbox-disabled{opacity:.45;cursor:not-allowed}.checkbox input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.radio-group{display:flex;flex-direction:column;gap:var(--space-sm)}.radio-group-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-body);letter-spacing:var(--tracking-wide);margin-bottom:var(--space-xs)}.radio{display:inline-flex;align-items:center;gap:var(--space-sm);cursor:pointer;-webkit-user-select:none;user-select:none}.radio-circle{width:20px;height:20px;border-radius:var(--radius-full);flex-shrink:0;border:var(--border-default) var(--border-style) var(--color-border-default);background:var(--color-surface-card);display:flex;align-items:center;justify-content:center;transition:all var(--duration-fast) var(--ease-default)}.radio-circle[data-checked=true]{border-color:var(--color-primary)}.radio-dot{width:10px;height:10px;border-radius:var(--radius-full);background:var(--color-primary);transform:scale(0);transition:transform var(--duration-fast) var(--ease-default)}.radio-circle[data-checked=true] .radio-dot{transform:scale(1)}.radio-label{font-size:var(--font-size-sm);color:var(--color-text-body)}.radio input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.textarea-field{font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text-body);background:var(--color-surface-card);padding:10px 14px;border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);outline:none;width:100%;resize:vertical;min-height:80px;transition:border-color var(--duration-fast) var(--ease-default)}.textarea-field::placeholder{color:var(--color-text-muted)}.textarea-field:focus{border-color:var(--color-primary)}.textarea-field:disabled{opacity:.5;cursor:not-allowed;background:var(--color-surface-sunken)}.tabs-list{display:flex;gap:0;border-bottom:var(--border-default) var(--border-style) var(--color-border-subtle);margin-bottom:var(--space-lg);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.tabs-list::-webkit-scrollbar{display:none}.tab-trigger{padding:10px 20px;font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);background:none;border:none;border-bottom:6px solid transparent;cursor:pointer;transition:all var(--duration-fast) var(--ease-default);margin-bottom:-3px;white-space:nowrap;flex-shrink:0}.tab-trigger:hover{color:var(--color-text-body)}.tab-trigger[data-active=true]{color:var(--color-primary);border-bottom-color:var(--color-primary);font-weight:var(--font-weight-semibold)}.tab-panel{animation:tabFadeIn var(--duration-normal) var(--ease-enter)}@keyframes tabFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:1000;display:flex;align-items:center;justify-content:center;padding:var(--space-xl);animation:backdropIn var(--duration-normal) var(--ease-enter)}@keyframes backdropIn{0%{opacity:0}to{opacity:1}}.dialog-content{background:var(--color-surface-card);border-radius:var(--radius-xl);padding:var(--space-xl);border:var(--border-thin) var(--border-style) var(--color-border-subtle);box-shadow:var(--shadow-lg);max-width:480px;width:100%;position:relative;animation:dialogIn var(--duration-normal) var(--ease-enter)}@keyframes dialogIn{0%{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.dialog-close{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--color-text-muted);cursor:pointer;padding:4px;font-size:18px;line-height:1}.dialog-close:hover{color:var(--color-text-body)}.dialog-title{font-family:var(--font-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-heading);margin-bottom:var(--space-xs)}.dialog-description{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-lg)}.dialog-footer{margin-top:var(--space-lg);display:flex;gap:var(--space-sm);justify-content:flex-end}.toast-container{position:fixed;top:var(--space-lg);right:var(--space-lg);z-index:2000;display:flex;flex-direction:column;gap:var(--space-sm);pointer-events:none}.toast{pointer-events:auto;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-md);padding:12px 16px;min-width:280px;max-width:380px;box-shadow:var(--shadow-lg);display:flex;align-items:flex-start;gap:var(--space-sm);animation:toastIn var(--duration-normal) var(--ease-enter)}@keyframes toastIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.toast-icon{font-size:16px;flex-shrink:0;margin-top:2px}.toast-success .toast-icon{color:var(--color-status-success)}.toast-error .toast-icon{color:var(--color-status-error)}.toast-warning .toast-icon{color:var(--color-status-warning)}.toast-info .toast-icon{color:var(--color-status-info)}.toast-body{flex:1}.toast-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-heading)}.toast-message{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:2px}.toast-dismiss{background:none;border:none;color:var(--color-text-muted);cursor:pointer;font-size:14px;padding:2px;flex-shrink:0}.toast-dismiss:hover{color:var(--color-text-body)}.dropdown{position:relative;display:inline-block}.dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;z-index:800;min-width:180px;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-xs) 0;animation:dropIn var(--duration-fast) var(--ease-enter)}@keyframes dropIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{display:flex;align-items:center;gap:var(--space-sm);width:100%;padding:8px 14px;font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body);background:none;border:none;cursor:pointer;text-align:left;transition:background var(--duration-fast) var(--ease-default)}.dropdown-item:hover{background:var(--color-surface-sunken)}.dropdown-item-danger{color:var(--color-status-error)}.dropdown-separator{height:1px;background:var(--color-border-subtle);margin:var(--space-xs) 0}.tooltip-wrapper{position:relative;display:inline-flex}.tooltip-bubble{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);background:var(--color-text-heading);color:var(--color-surface-page);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);padding:6px 10px;border-radius:var(--radius-sm);white-space:nowrap;pointer-events:none;z-index:800;animation:tooltipIn var(--duration-fast) var(--ease-enter)}@keyframes tooltipIn{0%{opacity:0;transform:translate(-50%) translateY(4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.progress-wrapper{display:flex;flex-direction:column;gap:var(--space-xs)}.progress-header{display:flex;justify-content:space-between;align-items:baseline}.progress-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-body)}.progress-value{font-size:var(--font-size-xs);color:var(--color-text-muted);font-family:var(--font-mono)}.progress-track{width:100%;height:8px;background:var(--color-surface-sunken);border-radius:var(--radius-full);overflow:hidden;border:var(--border-thin) var(--border-style) var(--color-border-subtle)}.progress-fill{height:100%;border-radius:var(--radius-full);transition:width var(--duration-normal) var(--ease-default)}.progress-fill-primary{background:var(--color-primary)}.progress-fill-secondary{background:var(--color-secondary)}.progress-fill-tertiary{background:var(--color-tertiary)}.progress-fill-success{background:var(--color-status-success)}.progress-fill-warning{background:var(--color-status-warning)}.progress-fill-error{background:var(--color-status-error)}.skeleton{background:var(--color-surface-sunken);border-radius:var(--radius-md);animation:skeletonPulse 1.8s ease-in-out infinite}@keyframes skeletonPulse{0%,to{opacity:1}50%{opacity:.4}}.skeleton-text{height:14px;margin-bottom:8px}.skeleton-heading{height:24px;width:60%;margin-bottom:12px}.skeleton-avatar{border-radius:var(--radius-full)}.skeleton-button{height:40px;width:120px}.accordion{border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-lg);overflow:hidden}.accordion-item{border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle)}.accordion-item:last-child{border-bottom:none}.accordion-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:none;border:none;cursor:pointer;font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-heading);text-align:left;transition:background var(--duration-fast) var(--ease-default)}.accordion-trigger:hover{background:var(--color-surface-sunken)}.accordion-chevron{font-size:12px;color:var(--color-text-muted);transition:transform var(--duration-fast) var(--ease-default)}.accordion-chevron[data-open=true]{transform:rotate(180deg)}.accordion-panel{overflow:hidden;transition:max-height var(--duration-normal) var(--ease-default)}.accordion-panel-inner{padding:0 18px 14px;font-size:var(--font-size-sm);color:var(--color-text-body);line-height:var(--leading-relaxed)}.showcase-app{min-height:100vh;transition:background var(--duration-normal) var(--ease-default);overflow-x:hidden}.showcase-header{position:sticky;top:0;z-index:100;background:var(--color-surface-card);border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle);padding:var(--space-md) var(--space-xl);display:flex;align-items:center;justify-content:space-between;gap:var(--space-md)}.showcase-title{font-family:var(--font-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-heading);letter-spacing:var(--tracking-tight);line-height:1}.showcase-subtitle{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:2px;font-style:italic}.direction-switcher{display:flex;flex-wrap:wrap;gap:0;border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);overflow:hidden;max-width:100%}.direction-btn{padding:6px 12px;font-family:var(--font-body);font-size:11px;font-weight:var(--font-weight-medium);letter-spacing:var(--tracking-wide);background:var(--color-surface-card);color:var(--color-text-muted);border:none;cursor:pointer;transition:all var(--duration-fast) var(--ease-default)}.direction-btn:not(:last-child){border-right:var(--border-thin) var(--border-style) var(--color-border-subtle)}.direction-btn:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.direction-btn[data-active=true]{background:var(--color-primary);color:var(--color-text-inverse)}.download-btn{display:inline-flex;align-items:center;gap:var(--space-xs);padding:6px 14px;background:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);transition:all var(--duration-fast) var(--ease-default);white-space:nowrap}.download-btn:hover{filter:brightness(1.1)}.download-btn svg{width:14px;height:14px}.showcase-body{max-width:960px;margin:0 auto;padding:var(--space-2xl) var(--space-xl);overflow-x:hidden}.section{margin-bottom:var(--space-3xl);max-width:100%;position:relative}.section-heading{font-family:var(--font-heading);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text-heading);letter-spacing:var(--tracking-tight);margin-bottom:var(--space-xs);line-height:var(--leading-tight)}.section-desc{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-lg)}.component-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md)}.component-row-label{font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:var(--font-weight-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase;width:100%;margin-bottom:var(--space-xs)}.demo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-lg)}.form-demo{display:flex;flex-direction:column;gap:var(--space-md);max-width:400px}.tier-divider{margin:var(--space-3xl) 0 var(--space-2xl);padding:var(--space-md) 0;border-top:var(--border-thick) var(--border-style) var(--color-border-default);font-family:var(--font-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text-heading);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight)}.tier-divider span{font-size:var(--font-size-sm);color:var(--color-text-muted);font-family:var(--font-body);font-weight:var(--font-weight-regular);letter-spacing:var(--tracking-wide);display:block;margin-top:var(--space-xs)}[data-theme=brutalist] .showcase-app:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");pointer-events:none;z-index:9999;opacity:.5}[data-theme=retro-terminal] .showcase-app:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999;background:repeating-linear-gradient(0deg,rgba(0,0,0,.12) 0px,rgba(0,0,0,.12) 1px,transparent 1px,transparent 3px)}[data-theme=retro-terminal] .showcase-app:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9998;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.4) 100%)}.slider-wrapper{display:flex;flex-direction:column;gap:var(--space-xs)}.slider-header{display:flex;justify-content:space-between;align-items:baseline}.slider-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-body)}.slider-value{font-size:var(--font-size-xs);color:var(--color-text-muted);font-family:var(--font-mono)}.slider-track{position:relative;width:100%;height:6px;background:var(--color-surface-sunken);border-radius:var(--radius-full);cursor:pointer;border:var(--border-thin) var(--border-style) var(--color-border-subtle);touch-action:none}.slider-fill{position:absolute;top:0;left:0;height:100%;background:var(--color-primary);border-radius:var(--radius-full);pointer-events:none}.slider-thumb{position:absolute;top:50%;width:20px;height:20px;border-radius:var(--radius-full);background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-primary);box-shadow:var(--shadow-sm);transform:translate(-50%,-50%);cursor:grab;transition:box-shadow var(--duration-fast) var(--ease-default)}.slider-thumb:hover{box-shadow:var(--shadow-md)}.slider-steps{display:flex;justify-content:space-between;margin-top:var(--space-xs);position:relative;padding:0 9px}.slider-step-dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--color-border-default);cursor:pointer;transition:all var(--duration-fast) var(--ease-default)}.slider-step-dot[data-filled=true]{background:var(--color-primary)}.slider-step-dot:hover{transform:scale(1.5)}.slider-step-labels{display:flex;justify-content:space-between;margin-top:2px}.slider-step-label{font-size:11px;color:var(--color-text-muted);font-family:var(--font-mono);text-align:center;cursor:pointer;min-width:0}.slider-step-label[data-active=true]{color:var(--color-primary);font-weight:var(--font-weight-semibold)}.tag-input-wrapper{display:flex;flex-direction:column;gap:var(--space-xs)}.tag-input-box{display:flex;flex-wrap:wrap;gap:var(--space-xs);padding:6px 10px;min-height:42px;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:text;align-items:center;transition:border-color var(--duration-fast) var(--ease-default)}.tag-input-box:focus-within{border-color:var(--color-primary)}.tag-input-field{flex:1;min-width:80px;border:none;outline:none;background:none;font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body)}.tag-input-field::placeholder{color:var(--color-text-muted)}.tag{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;background:var(--color-secondary);color:var(--color-text-inverse);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);white-space:nowrap}[data-theme=soft-luxury] .tag{background:var(--color-surface-sunken);color:var(--color-text-body);border:var(--border-thin) var(--border-style) var(--color-border-default)}[data-theme=retro-terminal] .tag{background:transparent;color:var(--color-primary);border:1px solid var(--color-primary)}.tag-remove{background:none;border:none;cursor:pointer;font-size:12px;line-height:1;color:inherit;opacity:.7;padding:0}.tag-remove:hover{opacity:1}.kbd{display:inline-flex;align-items:center;justify-content:center;min-width:24px;padding:2px 6px;font-family:var(--font-mono);font-size:var(--font-size-xs);line-height:1.4;color:var(--color-text-body);background:var(--color-surface-sunken);border:var(--border-thin) var(--border-style) var(--color-border-default);border-bottom-width:2px;border-radius:var(--radius-sm)}.stepper{display:flex;align-items:flex-start;gap:0}.stepper-step{display:flex;flex-direction:column;align-items:center;flex:1;position:relative}.stepper-node{width:32px;height:32px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);border:var(--border-default) var(--border-style) var(--color-border-default);background:var(--color-surface-card);color:var(--color-text-muted);transition:all var(--duration-fast) var(--ease-default);z-index:1;position:relative}.stepper-node[data-status=complete]{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}.stepper-node[data-status=active]{border-color:var(--color-primary);color:var(--color-primary);box-shadow:0 0 0 3px #7c6cf01f}.stepper-label{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:var(--space-xs);text-align:center}.stepper-label[data-status=active]{color:var(--color-primary);font-weight:var(--font-weight-semibold)}.stepper-label[data-status=complete]{color:var(--color-text-body)}.stepper-connector{position:absolute;top:16px;left:calc(50% + 20px);right:calc(-50% + 20px);height:2px;background:var(--color-border-default)}.stepper-connector[data-filled=true]{background:var(--color-primary)}.collapsible-trigger{display:flex;align-items:center;gap:var(--space-sm);background:none;border:none;cursor:pointer;font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-heading);padding:var(--space-sm) 0}.collapsible-icon{color:var(--color-text-muted);transition:transform var(--duration-fast) var(--ease-default);display:flex;align-items:center}.collapsible-icon svg{width:14px;height:14px}.collapsible-icon[data-open=true]{transform:rotate(90deg)}.collapsible-content{overflow:hidden;transition:max-height var(--duration-normal) var(--ease-default)}.divider{border:none;border-top:var(--border-thin) var(--border-style) var(--color-border-subtle);margin:var(--space-lg) 0}.divider-with-label{display:flex;align-items:center;gap:var(--space-md);margin:var(--space-lg) 0}.divider-line{flex:1;height:1px;background:var(--color-border-subtle)}.divider-label{font-size:var(--font-size-xs);color:var(--color-text-muted);letter-spacing:var(--tracking-wide);text-transform:uppercase;white-space:nowrap}.cmd-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:1100;display:flex;align-items:flex-start;justify-content:center;padding-top:20vh;animation:backdropIn var(--duration-fast) var(--ease-enter)}.cmd-panel{background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:480px;max-width:90vw;overflow:hidden;animation:dialogIn var(--duration-normal) var(--ease-enter)}.cmd-input-wrapper{padding:12px 16px;border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle);display:flex;align-items:center;gap:var(--space-sm)}.cmd-search-icon{color:var(--color-text-muted);font-size:14px;flex-shrink:0}.cmd-input{flex:1;border:none;outline:none;background:none;font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body)}.cmd-input::placeholder{color:var(--color-text-muted)}.cmd-list{max-height:300px;overflow-y:auto;padding:var(--space-xs) 0}.cmd-group-label{padding:8px 16px;font-size:var(--font-size-xs);color:var(--color-text-muted);letter-spacing:var(--tracking-wide);text-transform:uppercase}.cmd-item{display:flex;align-items:center;gap:var(--space-sm);padding:8px 16px;cursor:pointer;font-size:var(--font-size-sm);color:var(--color-text-body);transition:background var(--duration-fast) var(--ease-default)}.cmd-item:hover,.cmd-item[data-active=true]{background:var(--color-surface-sunken)}.cmd-item-icon{color:var(--color-text-muted);font-size:14px;width:20px;text-align:center}.cmd-item-label{flex:1}.cmd-item-shortcut{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--color-text-muted)}.cmd-empty{padding:24px 16px;text-align:center;color:var(--color-text-muted);font-size:var(--font-size-sm)}.cmd-footer{padding:8px 16px;border-top:var(--border-thin) var(--border-style) var(--color-border-subtle);display:flex;gap:var(--space-md);font-size:var(--font-size-xs);color:var(--color-text-muted)}.datepicker{display:flex;flex-direction:column;gap:var(--space-xs);position:relative}.datepicker-trigger{display:flex;align-items:center;gap:var(--space-sm);padding:10px 14px;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body);transition:border-color var(--duration-fast) var(--ease-default);width:100%}.datepicker-trigger:hover{border-color:var(--color-primary)}.datepicker-trigger-icon{color:var(--color-text-muted);display:flex;align-items:center}.datepicker-trigger-icon svg{width:16px;height:16px}.datepicker-trigger-placeholder{color:var(--color-text-muted)}.datepicker-dropdown{position:absolute;top:calc(100% + 4px);left:0;z-index:800;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:var(--space-md);animation:dropIn var(--duration-fast) var(--ease-enter);width:280px}.datepicker-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-sm)}.datepicker-nav-btn{background:none;border:none;cursor:pointer;padding:4px;color:var(--color-text-muted);border-radius:var(--radius-sm);display:flex;align-items:center;transition:background var(--duration-fast) var(--ease-default)}.datepicker-nav-btn svg{width:16px;height:16px}.datepicker-nav-btn:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.datepicker-month{font-family:var(--font-heading);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-heading)}.datepicker-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}.datepicker-weekday{font-size:11px;color:var(--color-text-muted);letter-spacing:var(--tracking-wide);text-transform:uppercase;padding:4px 0;font-weight:var(--font-weight-medium)}.datepicker-day{padding:6px 0;font-size:var(--font-size-xs);border-radius:var(--radius-sm);cursor:pointer;color:var(--color-text-body);transition:all var(--duration-fast) var(--ease-default);border:none;background:none}.datepicker-day:hover{background:var(--color-surface-sunken)}.datepicker-day[data-selected=true]{background:var(--color-primary);color:var(--color-text-inverse);font-weight:var(--font-weight-semibold)}.datepicker-day[data-today=true]{border:var(--border-thin) var(--border-style) var(--color-primary)}.datepicker-day[data-outside=true]{color:var(--color-text-muted);opacity:.4}.file-upload-zone{border:2px dashed var(--color-border-default);border-radius:var(--radius-lg);padding:var(--space-2xl) var(--space-xl);text-align:center;cursor:pointer;transition:all var(--duration-fast) var(--ease-default);background:var(--color-surface-card)}.file-upload-zone:hover,.file-upload-zone[data-dragging=true]{border-color:var(--color-primary);background:var(--color-surface-sunken)}.file-upload-icon{margin-bottom:var(--space-sm);color:var(--color-text-muted);display:flex;justify-content:center}.file-upload-icon svg{width:28px;height:28px}.file-upload-text{font-size:var(--font-size-sm);color:var(--color-text-body)}.file-upload-hint{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:var(--space-xs)}.file-upload-mini{display:inline-flex;align-items:center;gap:var(--space-sm);padding:8px 14px;background:var(--color-surface-card);border:var(--border-default) dashed var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;transition:all var(--duration-fast) var(--ease-default)}.file-upload-mini:hover{border-color:var(--color-primary);background:var(--color-surface-sunken)}.file-upload-mini svg{width:16px;height:16px;color:var(--color-text-muted)}.file-upload-mini-text{font-size:var(--font-size-sm);color:var(--color-text-body)}.file-upload-mini-hint{font-size:var(--font-size-xs);color:var(--color-text-muted)}.file-upload-link{color:var(--color-primary);text-decoration:underline;cursor:pointer}.file-list{display:flex;flex-direction:column;gap:var(--space-sm);margin-top:var(--space-md)}.file-item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface-sunken);border-radius:var(--radius-md);border:var(--border-thin) var(--border-style) var(--color-border-subtle)}.file-item-icon{font-size:16px;flex-shrink:0}.file-item-info{flex:1;min-width:0}.file-item-name{font-size:var(--font-size-sm);color:var(--color-text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-item-size{font-size:var(--font-size-xs);color:var(--color-text-muted)}.file-item-remove{background:none;border:none;cursor:pointer;color:var(--color-text-muted);font-size:14px;padding:2px}.file-item-remove:hover{color:var(--color-status-error)}.adt-toolbar{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md);flex-wrap:wrap}.adt-search{flex:1;min-width:180px;padding:8px 12px;font-family:var(--font-body);font-size:var(--font-size-sm);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);background:var(--color-surface-card);color:var(--color-text-body);outline:none;transition:border-color var(--duration-fast) var(--ease-default)}.adt-search::placeholder{color:var(--color-text-muted)}.adt-search:focus{border-color:var(--color-primary)}.adt-count{font-size:var(--font-size-xs);color:var(--color-text-muted)}.table th[data-sortable=true]{cursor:pointer;-webkit-user-select:none;user-select:none}.table th[data-sortable=true]:hover{color:var(--color-text-body)}.sort-icon{font-size:11px;margin-left:4px}.table td .checkbox{display:flex}.adt-pagination{display:flex;align-items:center;justify-content:space-between;margin-top:var(--space-md)}.adt-page-info{font-size:var(--font-size-xs);color:var(--color-text-muted)}.adt-page-btns{display:flex;gap:var(--space-xs)}.navbar{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-lg);background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-lg);flex-wrap:wrap}.navbar-brand{font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-heading);letter-spacing:var(--tracking-tight);white-space:nowrap}.navbar-links{display:flex;align-items:center;gap:var(--space-xs);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.navbar-links::-webkit-scrollbar{display:none}.navbar-link{padding:6px 12px;font-size:var(--font-size-sm);color:var(--color-text-muted);background:none;border:none;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-body);transition:all var(--duration-fast) var(--ease-default);font-weight:var(--font-weight-medium);white-space:nowrap;flex-shrink:0}.navbar-link:hover{color:var(--color-text-body);background:var(--color-surface-sunken)}.navbar-link[data-active=true]{color:var(--color-primary);background:var(--color-surface-sunken);font-weight:var(--font-weight-semibold)}.navbar-spacer{flex:1;min-width:var(--space-sm)}.navbar-search{padding:6px 12px;font-family:var(--font-body);font-size:var(--font-size-xs);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);background:var(--color-surface-sunken);color:var(--color-text-body);outline:none;width:180px;min-width:0;transition:border-color var(--duration-fast) var(--ease-default)}.navbar-search:focus{border-color:var(--color-primary);background:var(--color-surface-card)}.navbar-search::placeholder{color:var(--color-text-muted)}.navbar-actions{display:flex;align-items:center;gap:var(--space-sm);flex-shrink:0}@media(max-width:640px){.navbar{padding:var(--space-sm);gap:var(--space-sm)}.navbar-links{width:100%;order:10}.navbar-spacer{display:none}.navbar-search{width:100%;order:11}.navbar-actions{margin-left:auto}}.sidebar-demo{display:flex;gap:var(--space-lg)}.sidebar{width:240px;flex-shrink:0;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-lg);padding:var(--space-md) 0;display:flex;flex-direction:column}.sidebar[data-collapsed=true]{width:56px}.sidebar-section{padding:0 var(--space-sm);margin-bottom:var(--space-md)}.sidebar-section-label{padding:0 var(--space-sm);margin-bottom:var(--space-xs);font-size:11px;color:var(--color-text-muted);letter-spacing:var(--tracking-wide);text-transform:uppercase;font-weight:var(--font-weight-medium)}.sidebar-item{display:flex;align-items:center;gap:var(--space-sm);padding:8px var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-muted);border-radius:var(--radius-sm);cursor:pointer;border:none;background:none;width:100%;text-align:left;font-family:var(--font-body);transition:all var(--duration-fast) var(--ease-default)}.sidebar-item:hover{color:var(--color-text-body);background:var(--color-surface-sunken)}.sidebar-item[data-active=true]{color:var(--color-primary);background:var(--color-surface-sunken);font-weight:var(--font-weight-semibold)}.sidebar-item-icon{width:18px;text-align:center;flex-shrink:0;display:flex;align-items:center;justify-content:center}.sidebar-item-icon svg{width:16px;height:16px}.sidebar-item-badge{margin-left:auto}.sidebar-toggle{margin:auto var(--space-sm) var(--space-sm);padding:6px;background:none;border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-sm);cursor:pointer;color:var(--color-text-muted);transition:all var(--duration-fast) var(--ease-default);display:flex;align-items:center;justify-content:center}.sidebar-toggle svg{width:14px;height:14px}.sidebar-toggle:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.sidebar-content{flex:1;padding:var(--space-lg)}.breadcrumb{display:flex;align-items:center;gap:var(--space-xs);flex-wrap:wrap}.breadcrumb-item{font-size:var(--font-size-sm);color:var(--color-text-muted);text-decoration:none;cursor:pointer;transition:color var(--duration-fast) var(--ease-default);background:none;border:none;font-family:var(--font-body)}.breadcrumb-item:hover{color:var(--color-text-body)}.breadcrumb-item[data-current=true]{color:var(--color-text-heading);font-weight:var(--font-weight-semibold);cursor:default}.breadcrumb-sep{color:var(--color-text-muted);font-size:var(--font-size-xs);-webkit-user-select:none;user-select:none}.alert{display:flex;gap:var(--space-sm);padding:var(--space-md);border-radius:var(--radius-md);border:var(--border-thin) var(--border-style) transparent;font-size:var(--font-size-sm)}.alert-success{background:color-mix(in srgb,var(--color-status-success) 8%,var(--color-surface-card));border-color:color-mix(in srgb,var(--color-status-success) 25%,transparent)}.alert-warning{background:color-mix(in srgb,var(--color-status-warning) 8%,var(--color-surface-card));border-color:color-mix(in srgb,var(--color-status-warning) 25%,transparent)}.alert-error{background:color-mix(in srgb,var(--color-status-error) 8%,var(--color-surface-card));border-color:color-mix(in srgb,var(--color-status-error) 25%,transparent)}.alert-info{background:color-mix(in srgb,var(--color-status-info) 8%,var(--color-surface-card));border-color:color-mix(in srgb,var(--color-status-info) 25%,transparent)}.alert-icon{font-size:16px;flex-shrink:0;margin-top:1px}.alert-success .alert-icon{color:var(--color-status-success)}.alert-warning .alert-icon{color:var(--color-status-warning)}.alert-error .alert-icon{color:var(--color-status-error)}.alert-info .alert-icon{color:var(--color-status-info)}.alert-body{flex:1}.alert-title{font-weight:var(--font-weight-semibold);color:var(--color-text-heading);margin-bottom:2px}.alert-message{color:var(--color-text-body);line-height:var(--leading-normal)}.alert-dismiss{background:none;border:none;cursor:pointer;color:var(--color-text-muted);font-size:14px;padding:0;flex-shrink:0}.alert-dismiss:hover{color:var(--color-text-body)}.popover-wrapper{position:relative;display:inline-flex}.popover-panel{position:fixed;z-index:9000;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-md);min-width:220px;animation:dropIn var(--duration-fast) var(--ease-enter)}.popover-arrow{position:absolute;top:-5px;transform:rotate(45deg);width:10px;height:10px;background:var(--color-surface-card);border-left:var(--border-thin) var(--border-style) var(--color-border-default);border-top:var(--border-thin) var(--border-style) var(--color-border-default)}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:1000;animation:backdropIn var(--duration-normal) var(--ease-enter)}.sheet-panel{position:fixed;top:0;right:0;bottom:0;width:380px;max-width:90vw;background:var(--color-surface-card);border-left:var(--border-thin) var(--border-style) var(--color-border-subtle);box-shadow:var(--shadow-lg);padding:var(--space-xl);display:flex;flex-direction:column;animation:sheetIn var(--duration-normal) var(--ease-enter);z-index:1001}@keyframes sheetIn{0%{transform:translate(100%)}to{transform:translate(0)}}.sheet-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-lg)}.sheet-title{font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-heading)}.sheet-close{background:none;border:none;cursor:pointer;color:var(--color-text-muted);font-size:18px}.sheet-close:hover{color:var(--color-text-body)}.sheet-body{flex:1;overflow-y:auto}.sheet-footer{margin-top:var(--space-lg);display:flex;gap:var(--space-sm);justify-content:flex-end}.combobox{position:relative}.combobox-input{width:100%;padding:10px 36px 10px 14px;font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text-body);background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);outline:none;transition:border-color var(--duration-fast) var(--ease-default)}.combobox-input:focus{border-color:var(--color-primary)}.combobox-input::placeholder{color:var(--color-text-muted)}.combobox-list{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:800;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);max-height:200px;overflow-y:auto;animation:dropIn var(--duration-fast) var(--ease-enter)}.combobox-option{padding:8px 14px;font-size:var(--font-size-sm);color:var(--color-text-body);cursor:pointer;transition:background var(--duration-fast) var(--ease-default)}.combobox-option:hover,.combobox-option[data-active=true]{background:var(--color-surface-sunken)}.combobox-option[data-selected=true]{color:var(--color-primary);font-weight:var(--font-weight-semibold)}.combobox-empty{padding:12px 14px;font-size:var(--font-size-sm);color:var(--color-text-muted);text-align:center}.toggle-group{display:inline-flex;border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);overflow:hidden}.toggle-group-item{padding:8px 16px;font-family:var(--font-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);background:var(--color-surface-card);color:var(--color-text-muted);border:none;cursor:pointer;transition:all var(--duration-fast) var(--ease-default)}.toggle-group-item:not(:last-child){border-right:var(--border-thin) var(--border-style) var(--color-border-subtle)}.toggle-group-item:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.toggle-group-item[data-active=true]{background:var(--color-primary);color:var(--color-text-inverse)}.otp-wrapper{display:flex;flex-direction:column;gap:var(--space-xs)}.otp-slots{display:flex;gap:var(--space-sm)}.otp-slot{width:44px;height:48px;text-align:center;font-family:var(--font-mono);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-heading);background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);outline:none;transition:border-color var(--duration-fast) var(--ease-default)}.otp-slot:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #7c6cf01a}.timeline{position:relative;padding-left:28px}.timeline:before{content:"";position:absolute;left:8px;top:4px;bottom:4px;width:2px;background:var(--color-border-subtle)}.timeline-item{position:relative;padding-bottom:var(--space-lg)}.timeline-item:last-child{padding-bottom:0}.timeline-dot{position:absolute;left:-24px;top:4px;width:12px;height:12px;border-radius:var(--radius-full);border:var(--border-default) var(--border-style) var(--color-border-default);background:var(--color-surface-card)}.timeline-dot[data-variant=success]{background:var(--color-status-success);border-color:var(--color-status-success)}.timeline-dot[data-variant=primary]{background:var(--color-primary);border-color:var(--color-primary)}.timeline-dot[data-variant=warning]{background:var(--color-status-warning);border-color:var(--color-status-warning)}.timeline-dot[data-variant=error]{background:var(--color-status-error);border-color:var(--color-status-error)}.timeline-time{font-size:var(--font-size-xs);color:var(--color-text-muted);font-family:var(--font-mono)}.timeline-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-heading);margin-top:2px}.timeline-desc{font-size:var(--font-size-sm);color:var(--color-text-body);margin-top:2px}.stat{display:flex;flex-direction:column;gap:var(--space-xs)}.stat-label{font-size:var(--font-size-xs);color:var(--color-text-muted);letter-spacing:var(--tracking-wide);text-transform:uppercase;font-weight:var(--font-weight-medium)}.stat-value{font-family:var(--font-heading);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text-heading);letter-spacing:var(--tracking-tight);line-height:1}.stat-trend{display:inline-flex;align-items:center;gap:4px;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.stat-trend-up{color:var(--color-status-success)}.stat-trend-down{color:var(--color-status-error)}.stat-trend-neutral{color:var(--color-text-muted)}.avatar-status-wrapper{position:relative;display:inline-flex}.avatar-status-dot{position:absolute;bottom:0;right:0;width:10px;height:10px;border-radius:var(--radius-full);border:2px solid var(--color-surface-card)}.avatar-status-dot[data-status=online]{background:var(--color-status-success)}.avatar-status-dot[data-status=busy]{background:var(--color-status-error)}.avatar-status-dot[data-status=away]{background:var(--color-status-warning)}.avatar-status-dot[data-status=offline]{background:var(--color-text-muted)}.empty-state{text-align:center;padding:var(--space-3xl) var(--space-xl)}.empty-state-icon{font-size:48px;margin-bottom:var(--space-md);opacity:.4}.empty-state-icon svg{width:48px;height:48px}.empty-state-title{font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-heading);margin-bottom:var(--space-xs)}.empty-state-desc{font-size:var(--font-size-sm);color:var(--color-text-muted);max-width:320px;margin:0 auto var(--space-lg);line-height:var(--leading-relaxed)}.fieldset{border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-lg);padding:var(--space-lg);background:var(--color-surface-card)}.fieldset-legend{font-family:var(--font-heading);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-heading);padding:0 var(--space-sm);letter-spacing:var(--tracking-normal)}.fieldset-desc{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-bottom:var(--space-md);line-height:var(--leading-relaxed)}.fieldset-body{display:flex;flex-direction:column;gap:var(--space-md)}.error-page{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-3xl) var(--space-xl);min-height:300px}.error-page-code{font-family:var(--font-mono);font-size:clamp(48px,10vw,96px);font-weight:var(--font-weight-bold);color:var(--color-primary);line-height:1;margin-bottom:var(--space-sm);opacity:.35}.error-page-title{font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-heading);margin-bottom:var(--space-xs);line-height:var(--leading-tight)}.error-page-desc{font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-text-body);max-width:420px;margin:0 auto var(--space-lg);line-height:var(--leading-normal)}.error-page-actions{display:flex;gap:var(--space-sm);justify-content:center;flex-wrap:wrap}.error-page-inverted{background:var(--color-primary);border-radius:var(--radius-lg)}.error-page-inverted .error-page-code{color:#ffffffe6}.error-page-inverted .error-page-title{color:#fff}.error-page-inverted .error-page-desc{color:#fffc}.error-page-inverted .btn-ghost{color:#fff9}.error-page-inverted .btn-ghost:hover{color:#fff;background:#ffffff26}.pagination{display:flex;align-items:center;gap:var(--space-xs)}.page-btn{min-width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-body);font-size:var(--font-size-xs);color:var(--color-text-muted);background:none;border:var(--border-thin) var(--border-style) transparent;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--duration-fast) var(--ease-default)}.page-btn:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.page-btn[data-active=true]{background:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary)}.page-btn:disabled{opacity:.4;cursor:not-allowed}.page-ellipsis{color:var(--color-text-muted);font-size:var(--font-size-xs);padding:0 4px}.grid{display:grid;width:100%}.grid-cols-1{grid-template-columns:1fr}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}.grid-cols-5{grid-template-columns:repeat(5,1fr)}.grid-cols-6{grid-template-columns:repeat(6,1fr)}.grid-cols-2-1{grid-template-columns:2fr 1fr}.grid-cols-1-2{grid-template-columns:1fr 2fr}.grid-cols-3-1{grid-template-columns:3fr 1fr}.grid-gap-xs{gap:var(--space-xs)}.grid-gap-sm{gap:var(--space-sm)}.grid-gap-md{gap:var(--space-md)}.grid-gap-lg{gap:var(--space-lg)}.grid-gap-xl{gap:var(--space-xl)}@media(max-width:900px){.grid-collapse-900{grid-template-columns:1fr!important}.grid-collapse-900-2col{grid-template-columns:repeat(2,1fr)!important}}@media(max-width:640px){.grid-collapse-640{grid-template-columns:1fr!important}.grid-collapse-640-2col{grid-template-columns:repeat(2,1fr)!important}}.stack{display:flex}.stack-col{flex-direction:column}.stack-row{flex-direction:row}.stack-wrap{flex-wrap:wrap}.stack-gap-xs{gap:var(--space-xs)}.stack-gap-sm{gap:var(--space-sm)}.stack-gap-md{gap:var(--space-md)}.stack-gap-lg{gap:var(--space-lg)}.stack-gap-xl{gap:var(--space-xl)}.stack-gap-2xl{gap:var(--space-2xl)}.stack-align-start{align-items:flex-start}.stack-align-center{align-items:center}.stack-align-end{align-items:flex-end}.stack-align-stretch{align-items:stretch}.stack-align-baseline{align-items:baseline}.stack-justify-start{justify-content:flex-start}.stack-justify-center{justify-content:center}.stack-justify-end{justify-content:flex-end}.stack-justify-between{justify-content:space-between}.stack-flex-1{flex:1;min-width:0}.bar-chart{display:flex;align-items:flex-end;gap:3px;height:120px}.bar-chart-bar{flex:1;border-radius:var(--radius-sm) var(--radius-sm) 0 0;background:var(--color-primary);transition:height var(--duration-normal) var(--ease-default);min-width:0;position:relative;opacity:.7}.bar-chart-bar:hover{opacity:1}.bar-chart-bar[data-accent=true]{background:var(--color-secondary)}.bar-chart-labels{display:flex;gap:3px;margin-top:var(--space-xs)}.bar-chart-label{flex:1;text-align:center;font-size:11px;color:var(--color-text-muted);font-family:var(--font-mono)}.sparkline{display:block}.sparkline-line{fill:none;stroke:var(--color-primary);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.sparkline-area{fill:var(--color-primary);opacity:.08}.dashboard{display:flex;border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface-page);max-width:100%}.dashboard-sidebar{width:220px;flex-shrink:0;background:var(--color-surface-card);border-right:var(--border-thin) var(--border-style) var(--color-border-subtle);padding:var(--space-md) 0;display:flex;flex-direction:column}.dashboard-main{flex:1;display:flex;flex-direction:column;min-width:0}.dashboard-topbar{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);background:var(--color-surface-card);border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle)}.dashboard-topbar-title{font-family:var(--font-heading);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-heading)}.dashboard-content{flex:1;padding:var(--space-lg);padding-bottom:var(--space-xl)}.dashboard .card-elevated:hover{transform:none;box-shadow:var(--shadow-md)}.dashboard-grid{display:grid;gap:var(--space-md)}.dashboard-grid-4{grid-template-columns:repeat(4,1fr)}.dashboard-grid-2-1{grid-template-columns:2fr 1fr}.dashboard-grid-1-1{grid-template-columns:1fr 1fr}.dashboard-card-flush{padding:0}.dashboard-card-flush .card-header{padding:var(--space-md) var(--space-md) 0}.dashboard-card-flush .card-body{padding:var(--space-sm) var(--space-md) var(--space-md)}.activity-item{display:flex;gap:var(--space-sm);align-items:flex-start;padding:var(--space-sm) 0}.activity-item:not(:last-child){border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle)}.activity-text{flex:1;font-size:var(--font-size-xs);color:var(--color-text-body);line-height:var(--leading-normal)}.activity-text strong{color:var(--color-text-heading);font-weight:var(--font-weight-semibold)}.activity-time{font-size:11px;color:var(--color-text-muted);font-family:var(--font-mono);white-space:nowrap}@media(max-width:900px){.dashboard-grid-4{grid-template-columns:repeat(2,1fr)}.dashboard-grid-2-1,.dashboard-grid-1-1{grid-template-columns:1fr}.dashboard-sidebar{display:none}.navbar{flex-wrap:wrap}.navbar-spacer{display:none}.sidebar-demo .sidebar{width:56px;overflow:hidden}.sidebar-demo .sidebar .sidebar-section-label{display:none}.sidebar-demo .sidebar .sidebar-item span:not(.sidebar-item-icon){display:none}.sidebar-demo .sidebar .sidebar-item-badge{display:none}.sidebar-demo .sidebar .sidebar-item{justify-content:center;padding:8px}.sidebar-demo .sidebar .sidebar-toggle{display:none}.sidebar-demo .sidebar-content{padding:var(--space-sm)}}@media(max-width:640px){.dashboard-grid-4{grid-template-columns:1fr}}.color-picker-wrapper{display:flex;flex-direction:column;gap:var(--space-xs)}.color-picker-area{position:relative;width:100%;height:160px;border-radius:var(--radius-md);cursor:crosshair;overflow:hidden;border:var(--border-thin) var(--border-style) var(--color-border-default)}.color-picker-cursor{position:absolute;width:16px;height:16px;border-radius:var(--radius-full);border:2px solid #fff;box-shadow:0 0 0 1px #0000004d,inset 0 0 0 1px #0000001a;transform:translate(-50%,-50%);pointer-events:none}.color-picker-hue-track{position:relative;width:100%;height:14px;border-radius:var(--radius-full);background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);cursor:pointer;border:var(--border-thin) var(--border-style) var(--color-border-subtle)}.color-picker-hue-thumb{position:absolute;top:-2px;width:18px;height:18px;border-radius:var(--radius-full);background:#fff;border:2px solid var(--color-border-default);box-shadow:var(--shadow-sm);transform:translate(-50%);pointer-events:none}.color-picker-inputs{display:flex;gap:var(--space-xs);align-items:flex-end}.color-picker-hex{flex:1;padding:8px 10px;font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--color-text-body);background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);outline:none;text-transform:uppercase;transition:border-color var(--duration-fast) var(--ease-default)}.color-picker-hex:focus{border-color:var(--color-primary)}.color-picker-preview{width:38px;height:38px;border-radius:var(--radius-md);flex-shrink:0;border:var(--border-default) var(--border-style) var(--color-border-default);box-shadow:var(--shadow-inner)}.color-picker-swatches{display:flex;gap:var(--space-xs);flex-wrap:wrap}.color-swatch{width:28px;height:28px;border-radius:var(--radius-sm);cursor:pointer;border:2px solid transparent;transition:all var(--duration-fast) var(--ease-default);box-shadow:inset 0 0 0 1px #0000000f}.color-swatch:hover{transform:scale(1.15)}.color-swatch[data-active=true]{border-color:var(--color-text-heading);box-shadow:0 0 0 2px var(--color-surface-card),0 0 0 4px var(--color-text-heading)}.color-dropdown{position:relative;display:inline-flex;flex-direction:column;gap:var(--space-xs)}.color-dropdown-trigger{display:inline-flex;align-items:center;gap:var(--space-sm);padding:8px 12px;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-default)}.color-dropdown-trigger:hover{border-color:var(--color-primary)}.color-dropdown-swatch{width:22px;height:22px;border-radius:var(--radius-sm);flex-shrink:0;border:var(--border-thin) var(--border-style) var(--color-border-subtle);box-shadow:inset 0 0 0 1px #0000000f}.color-dropdown-value{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--color-text-body);text-transform:uppercase}.color-dropdown-chevron{display:flex;align-items:center;color:var(--color-text-muted);transition:transform var(--duration-fast) var(--ease-default)}.color-dropdown-chevron[data-open=true]{transform:rotate(180deg)}.color-dropdown-panel{position:absolute;top:calc(100% + 6px);left:0;z-index:800;width:240px;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-sm);animation:dropIn var(--duration-fast) var(--ease-enter)}.color-dropdown-panel .color-picker-hex{width:100%}.color-dropdown-panel .color-picker-swatches{padding-top:var(--space-xs)}.font-dropdown{position:relative;display:inline-flex;flex-direction:column;gap:var(--space-xs)}.font-dropdown-trigger{display:inline-flex;align-items:center;gap:var(--space-sm);padding:8px 12px;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-default);min-width:200px}.font-dropdown-trigger:hover{border-color:var(--color-primary)}.font-dropdown-preview{flex:1;font-size:var(--font-size-sm);color:var(--color-text-heading);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.font-dropdown-name{font-size:11px;color:var(--color-text-muted);font-family:var(--font-mono)}.font-dropdown-chevron{display:flex;align-items:center;color:var(--color-text-muted);transition:transform var(--duration-fast) var(--ease-default);flex-shrink:0}.font-dropdown-chevron[data-open=true]{transform:rotate(180deg)}.font-dropdown-panel{position:absolute;top:calc(100% + 6px);left:0;z-index:800;width:280px;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;animation:dropIn var(--duration-fast) var(--ease-enter)}.font-dropdown-search{padding:10px 12px;border:none;border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle);font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body);background:none;outline:none;width:100%}.font-dropdown-search::placeholder{color:var(--color-text-muted)}.font-dropdown-list{max-height:240px;overflow-y:auto;padding:var(--space-xs) 0}.font-dropdown-item{display:flex;flex-direction:column;gap:1px;padding:8px 12px;cursor:pointer;transition:background var(--duration-fast) var(--ease-default)}.font-dropdown-item:hover,.font-dropdown-item[data-active=true]{background:var(--color-surface-sunken)}.font-dropdown-item-sample{font-size:var(--font-size-base);color:var(--color-text-heading);line-height:1.3}.font-dropdown-item-name{font-size:11px;color:var(--color-text-muted);font-family:var(--font-mono)}.font-dropdown-item-check{color:var(--color-primary);font-size:12px}.font-dropdown-empty{padding:16px 12px;text-align:center;font-size:var(--font-size-sm);color:var(--color-text-muted)}.search-select{position:relative}.search-select-trigger{display:flex;align-items:center;gap:var(--space-sm);padding:10px 14px;width:100%;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text-body);transition:border-color var(--duration-fast) var(--ease-default);text-align:left}.search-select-trigger:hover{border-color:var(--color-primary)}.search-select-trigger-placeholder{color:var(--color-text-muted)}.search-select-trigger-chevron{margin-left:auto;display:flex;align-items:center;color:var(--color-text-muted)}.search-select-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:800;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);animation:dropIn var(--duration-fast) var(--ease-enter)}.search-select-search{padding:10px 12px;border:none;border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle);font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body);background:none;outline:none;width:100%}.search-select-search::placeholder{color:var(--color-text-muted)}.search-select-list{max-height:200px;overflow-y:auto;padding:var(--space-xs) 0}.search-select-option{padding:8px 14px;font-size:var(--font-size-sm);color:var(--color-text-body);cursor:pointer;display:flex;align-items:center;gap:var(--space-sm);transition:background var(--duration-fast) var(--ease-default)}.search-select-option:hover,.search-select-option[data-active=true]{background:var(--color-surface-sunken)}.search-select-option[data-selected=true]{color:var(--color-primary);font-weight:var(--font-weight-semibold)}.search-select-check{font-size:12px;color:var(--color-primary);width:16px}.search-select-empty{padding:12px 14px;font-size:var(--font-size-sm);color:var(--color-text-muted);text-align:center}.multi-select-trigger{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-xs);padding:6px 10px;min-height:42px;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;width:100%;transition:border-color var(--duration-fast) var(--ease-default)}.multi-select-trigger:hover{border-color:var(--color-primary)}.multi-select-tag{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;background:var(--color-surface-sunken);color:var(--color-text-body);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border:var(--border-thin) var(--border-style) var(--color-border-subtle)}.multi-select-tag-remove{background:none;border:none;cursor:pointer;font-size:11px;color:var(--color-text-muted);padding:0;line-height:1}.multi-select-tag-remove:hover{color:var(--color-status-error)}.multi-select-placeholder{color:var(--color-text-muted);font-size:var(--font-size-sm)}.multi-select-chevron{margin-left:auto;display:flex;align-items:center;color:var(--color-text-muted);flex-shrink:0}.text-style-bar{display:inline-flex;align-items:center;gap:2px;padding:3px;border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);background:var(--color-surface-card);width:fit-content;align-self:flex-start}.text-style-btn{width:32px;height:30px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--color-text-muted);border:none;cursor:pointer;font-size:var(--font-size-sm);font-family:var(--font-body);border-radius:var(--radius-sm);transition:all var(--duration-fast) var(--ease-default)}.text-style-btn:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.text-style-btn[data-active=true]{background:var(--color-primary);color:var(--color-text-inverse)}.text-style-btn-b{font-weight:700}.text-style-btn-i{font-style:italic}.text-style-btn-u{text-decoration:underline}.text-style-btn-s{text-decoration:line-through}.text-style-btn-caps{font-size:11px;letter-spacing:.05em;font-weight:600}.text-style-size{width:40px;height:30px;border:none;background:var(--color-surface-sunken);font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--color-text-body);text-align:center;outline:none;padding:0 2px;border-radius:var(--radius-sm);margin-left:2px;-moz-appearance:textfield}.text-style-size::-webkit-inner-spin-button,.text-style-size::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.text-style-size:focus{background:var(--color-surface-sunken)}.text-style-size-label{display:flex;align-items:center;padding:0 6px 0 0;font-size:11px;color:var(--color-text-muted);background:var(--color-surface-card);letter-spacing:.03em;font-family:var(--font-mono);white-space:nowrap}.icon-picker-wrapper{display:flex;flex-direction:column;gap:var(--space-xs)}.icon-picker-trigger{display:inline-flex;align-items:center;gap:var(--space-sm);padding:8px 12px;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-default);width:fit-content;align-self:flex-start}.icon-picker-trigger:hover{border-color:var(--color-primary)}.icon-picker-trigger-icon{font-size:20px;line-height:1}.icon-picker-trigger-label{font-size:var(--font-size-xs);color:var(--color-text-muted);font-family:var(--font-mono)}.icon-picker-trigger-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.icon-picker-trigger-chevron{display:flex;align-items:center;color:var(--color-text-muted);transition:transform var(--duration-fast) var(--ease-default)}.icon-picker-trigger-chevron svg{width:14px;height:14px}.icon-picker-trigger-chevron[data-open=true]{transform:rotate(180deg)}.icon-picker-panel{position:absolute;top:calc(100% + 6px);left:0;z-index:800;width:296px;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;animation:dropIn var(--duration-fast) var(--ease-enter)}.icon-picker-search{padding:10px 12px;border:none;border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle);font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body);background:none;outline:none;width:100%}.icon-picker-search::placeholder{color:var(--color-text-muted)}.icon-picker-tabs{display:flex;border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle);overflow-x:auto;-webkit-overflow-scrolling:touch}.icon-picker-tab{padding:6px 10px;font-size:11px;color:var(--color-text-muted);background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;font-family:var(--font-body);font-weight:var(--font-weight-medium);letter-spacing:var(--tracking-wide);transition:all var(--duration-fast) var(--ease-default);text-transform:uppercase}.icon-picker-tab:hover{color:var(--color-text-body)}.icon-picker-tab[data-active=true]{color:var(--color-primary);border-bottom-color:var(--color-primary)}.icon-picker-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;padding:var(--space-sm);max-height:200px;overflow-y:auto}.icon-picker-cell{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--duration-fast) var(--ease-default);border:2px solid transparent;color:var(--color-text-body)}.icon-picker-cell svg{width:18px;height:18px}.icon-picker-cell:hover{background:var(--color-surface-sunken);transform:scale(1.15)}.icon-picker-cell[data-active=true]{border-color:var(--color-primary);background:var(--color-surface-sunken)}.icon-picker-empty{padding:20px 12px;text-align:center;font-size:var(--font-size-sm);color:var(--color-text-muted)}.icon-display{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;line-height:1}.icon-display-xs{width:16px;height:16px}.icon-display-xs svg{width:12px;height:12px}.icon-display-sm{width:20px;height:20px}.icon-display-sm svg{width:16px;height:16px}.icon-display-md{width:24px;height:24px}.icon-display-md svg{width:20px;height:20px}.icon-display-lg{width:32px;height:32px}.icon-display-lg svg{width:24px;height:24px}.icon-display-xl{width:48px;height:48px}.icon-display-xl svg{width:36px;height:36px}.icon-display-muted{color:var(--color-text-muted)}.icon-display-body{color:var(--color-text-body)}.icon-display-heading{color:var(--color-text-heading)}.icon-display-primary{color:var(--color-primary)}.icon-display-success{color:var(--color-status-success)}.icon-display-warning{color:var(--color-status-warning)}.icon-display-error{color:var(--color-status-error)}.icon-display-info{color:var(--color-status-info)}.icon-display-bg{background:var(--color-surface-sunken);border-radius:var(--radius-md);padding:8px;width:auto;height:auto}.icon-display-bg svg{width:20px;height:20px}.icon-display-bg-primary{background:var(--color-primary);color:var(--color-text-inverse);border-radius:var(--radius-md);padding:8px;width:auto;height:auto}.icon-display-bg-primary svg{width:20px;height:20px}.icon-display-bg-circle{border-radius:var(--radius-full)}.icon-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border:var(--border-default) var(--border-style) transparent;cursor:pointer;transition:all var(--duration-fast) var(--ease-default);outline:none;border-radius:var(--radius-md);line-height:1}.icon-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.icon-btn:active{transform:scale(.93)}.icon-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.icon-btn-sm{width:28px;height:28px}.icon-btn-sm svg{width:14px;height:14px}.icon-btn-md{width:34px;height:34px}.icon-btn-md svg{width:16px;height:16px}.icon-btn-lg{width:42px;height:42px}.icon-btn-lg svg{width:20px;height:20px}.icon-btn-primary{background:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary)}.icon-btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.icon-btn-secondary{background:var(--color-surface-card);color:var(--color-text-body);border-color:var(--color-border-default)}.icon-btn-secondary:hover:not(:disabled){background:var(--color-surface-sunken)}.icon-btn-ghost{background:transparent;color:var(--color-text-muted)}.icon-btn-ghost:hover:not(:disabled){background:var(--color-surface-sunken);color:var(--color-text-body)}.icon-btn-ghost[data-active=true]{background:var(--color-surface-sunken);color:var(--color-primary)}.icon-btn-danger{background:transparent;color:var(--color-text-muted)}.icon-btn-danger:hover:not(:disabled){background:color-mix(in srgb,var(--color-status-error) 10%,var(--color-surface-card));color:var(--color-status-error)}.icon-btn-color-secondary{background:var(--color-secondary);color:#fff;border-color:var(--color-secondary)}.icon-btn-color-tertiary{background:var(--color-tertiary);color:#fff;border-color:var(--color-tertiary)}.toolbar{display:inline-flex;align-items:stretch;border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);overflow:hidden;background:var(--color-surface-card);width:fit-content;align-self:flex-start}.toolbar-full{width:100%}.toolbar-group{display:flex;align-items:stretch}.toolbar-separator{width:1px;background:var(--color-border-subtle);flex-shrink:0}.toolbar-spacer{flex:1;min-width:var(--space-sm)}.toolbar .icon-btn{border:none;border-radius:0}.toolbar .icon-btn svg{width:15px;height:15px}.toolbar .icon-btn-ghost{background:var(--color-surface-card)}.toolbar .icon-btn-ghost:hover:not(:disabled){background:var(--color-surface-sunken)}.toolbar .icon-btn-ghost[data-active=true]{background:var(--color-primary);color:var(--color-text-inverse)}.toolbar .btn{border:none;border-radius:0}.toolbar-label{padding:0 8px;font-size:var(--font-size-xs);color:var(--color-text-muted);font-family:var(--font-body);font-weight:var(--font-weight-medium);white-space:nowrap;display:flex;align-items:center}.list{display:flex;flex-direction:column;gap:var(--space-xs);font-size:var(--font-size-sm);color:var(--color-text-body);line-height:var(--leading-normal)}.list-ordered{list-style:none;counter-reset:list-counter}.list-item{display:flex;gap:var(--space-sm);align-items:flex-start}.list-bullet{flex-shrink:0;width:20px;text-align:center;color:var(--color-text-muted);font-weight:var(--font-weight-semibold)}.list-ordered .list-bullet:before{counter-increment:list-counter;content:counter(list-counter) "."}.list-bullet-dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--color-primary);margin-top:7px;flex-shrink:0}.list-item-content{flex:1;min-width:0}.list-item-title{font-weight:var(--font-weight-semibold);color:var(--color-text-heading)}.list-nested{margin-top:var(--space-xs);margin-left:var(--space-lg)}.list-icon{flex-shrink:0;font-size:14px;margin-top:2px}.list-checklist .list-bullet{color:var(--color-status-success)}.blockquote{position:relative;padding:var(--space-md) var(--space-lg);border-left:4px solid var(--color-primary);margin:0;background:var(--color-surface-sunken);border-radius:0 var(--radius-md) var(--radius-md) 0}.blockquote-text{font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text-body);line-height:var(--leading-relaxed);font-style:italic}.blockquote-citation{margin-top:var(--space-sm);font-size:var(--font-size-xs);color:var(--color-text-muted);font-style:normal;font-weight:var(--font-weight-medium)}.blockquote-accent{border-left-color:var(--color-accent)}.blockquote-success{border-left-color:var(--color-status-success)}.blockquote-warning{border-left-color:var(--color-status-warning)}.blockquote-error{border-left-color:var(--color-status-error)}.blockquote-large .blockquote-text{font-family:var(--font-heading);font-size:var(--font-size-lg);font-style:normal;font-weight:var(--font-weight-bold);color:var(--color-text-heading);line-height:var(--leading-tight)}.code-block{position:relative;background:var(--color-surface-sunken);border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-md);overflow:hidden}.code-block-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-xs) var(--space-md);background:var(--color-surface-card);border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle)}.code-block-lang{font-family:var(--font-mono);font-size:11px;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-weight:var(--font-weight-medium)}.code-block-copy{background:none;border:none;cursor:pointer;font-size:12px;color:var(--color-text-muted);padding:2px 6px;border-radius:var(--radius-sm);transition:all var(--duration-fast) var(--ease-default);font-family:var(--font-body);font-size:var(--font-size-xs)}.code-block-copy:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.code-block-body{padding:var(--space-md);overflow-x:auto;font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--color-text-body);line-height:var(--leading-relaxed);white-space:pre;-moz-tab-size:2;tab-size:2}.code-block-body .code-line{display:block}.code-block-body .code-line-number{display:inline-block;width:28px;text-align:right;margin-right:var(--space-md);color:var(--color-text-muted);-webkit-user-select:none;user-select:none;font-size:var(--font-size-xs)}.code-inline{font-family:var(--font-mono);font-size:.875em;color:var(--color-text-heading);background:var(--color-surface-sunken);padding:2px 6px;border-radius:var(--radius-sm);border:var(--border-thin) var(--border-style) var(--color-border-subtle)}.heading{font-family:var(--font-heading);color:var(--color-text-heading);font-weight:var(--font-weight-bold);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight)}.heading-1{font-size:var(--font-size-4xl)}.heading-2{font-size:var(--font-size-3xl)}.heading-3{font-size:var(--font-size-2xl)}.heading-4{font-size:var(--font-size-xl)}.heading-5{font-size:var(--font-size-lg)}.heading-6{font-size:var(--font-size-base)}.subtitle{font-family:var(--font-body);color:var(--color-text-muted);line-height:var(--leading-normal)}.subtitle-lg{font-size:var(--font-size-lg)}.subtitle-md{font-size:var(--font-size-base)}.subtitle-sm{font-size:var(--font-size-sm)}.text-display{font-family:var(--font-heading);color:var(--color-text-heading);font-weight:var(--font-weight-bold);letter-spacing:var(--tracking-tight);line-height:1}.text-display-xl{font-size:calc(var(--font-size-4xl) * 1.5)}.text-display-lg{font-size:var(--font-size-4xl)}.text-overline{font-family:var(--font-body);font-size:var(--font-size-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-weight:var(--font-weight-semibold)}.text-body{font-family:var(--font-body);color:var(--color-text-body);line-height:var(--leading-normal)}.text-body-lg{font-size:var(--font-size-lg)}.text-body-md{font-size:var(--font-size-base)}.text-body-sm{font-size:var(--font-size-sm)}.text-caption{font-family:var(--font-body);font-size:var(--font-size-xs);color:var(--color-text-muted);line-height:var(--leading-normal)}.heading-group{display:flex;flex-direction:column}.heading-group-tight{gap:2px}.heading-group-normal{gap:var(--space-xs)}.heading-group-loose{gap:var(--space-sm)}.heading-divider{border-bottom:var(--border-default) var(--border-style) var(--color-border-default);padding-bottom:var(--space-sm)}.chat-window{display:flex;flex-direction:column;border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface-page);max-width:100%;height:520px}.chat-header{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface-card);border-bottom:var(--border-thin) var(--border-style) var(--color-border-subtle)}.chat-header-title{font-family:var(--font-heading);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-text-heading);flex:1}.chat-header-status{font-size:11px;color:var(--color-status-success);display:flex;align-items:center;gap:4px}.chat-header-status-dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--color-status-success)}.chat-messages{flex:1;overflow-y:auto;padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-md)}.chat-message{display:flex;gap:var(--space-sm);max-width:85%;animation:chatMsgIn var(--duration-normal) var(--ease-enter)}.chat-message-user{align-self:flex-end;flex-direction:row-reverse}.chat-message-assistant{align-self:flex-start}@keyframes chatMsgIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.chat-bubble{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-lg);font-size:var(--font-size-sm);line-height:var(--leading-normal);color:var(--color-text-body);max-width:100%;word-wrap:break-word}.chat-bubble-user{background:var(--color-primary);color:var(--color-text-inverse);border-bottom-right-radius:var(--radius-sm)}.chat-bubble-assistant{background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-bottom-left-radius:var(--radius-sm)}.chat-bubble p{margin:0}.chat-bubble p+p{margin-top:var(--space-xs)}.chat-bubble code{font-family:var(--font-mono);font-size:.875em;background:var(--color-surface-sunken);padding:1px 4px;border-radius:var(--radius-sm)}.chat-bubble-user code{background:#ffffff26}.chat-bubble pre{margin:var(--space-xs) 0;padding:var(--space-sm);background:var(--color-surface-sunken);border-radius:var(--radius-sm);overflow-x:auto;font-family:var(--font-mono);font-size:var(--font-size-xs);line-height:var(--leading-relaxed)}.chat-bubble-user pre{background:#ffffff1a}.chat-meta{font-size:11px;color:var(--color-text-muted);margin-top:2px}.chat-meta-user{text-align:right}.chat-typing{display:flex;gap:4px;align-items:center;padding:4px 0}.chat-typing-dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--color-text-muted);animation:chatTyping 1.4s ease-in-out infinite}.chat-typing-dot:nth-child(2){animation-delay:.2s}.chat-typing-dot:nth-child(3){animation-delay:.4s}@keyframes chatTyping{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}.chat-input-bar{display:flex;align-items:flex-end;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface-card);border-top:var(--border-thin) var(--border-style) var(--color-border-subtle)}.chat-input{flex:1;padding:8px 12px;font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body);background:var(--color-surface-sunken);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);outline:none;resize:none;min-height:38px;max-height:120px;line-height:var(--leading-normal);transition:border-color var(--duration-fast) var(--ease-default)}.chat-input::placeholder{color:var(--color-text-muted)}.chat-input:focus{border-color:var(--color-primary);background:var(--color-surface-card)}.chat-send-btn{width:38px;height:38px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--duration-fast) var(--ease-default)}.chat-send-btn:hover{background:var(--color-primary-hover)}.chat-send-btn:disabled{opacity:.4;cursor:not-allowed}.chat-suggestions{display:flex;flex-wrap:wrap;gap:var(--space-xs);padding:0 var(--space-md) var(--space-sm)}.chat-suggestion{padding:4px 10px;font-family:var(--font-body);font-size:var(--font-size-xs);color:var(--color-text-muted);background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-full);cursor:pointer;transition:all var(--duration-fast) var(--ease-default)}.chat-suggestion:hover{border-color:var(--color-primary);color:var(--color-primary)}.chat-actions{display:flex;gap:var(--space-xs);margin-top:var(--space-xs)}.chat-action-btn{padding:2px 6px;font-size:11px;color:var(--color-text-muted);background:none;border:var(--border-thin) var(--border-style) transparent;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-body);transition:all var(--duration-fast) var(--ease-default)}.chat-action-btn:hover{color:var(--color-text-body);background:var(--color-surface-sunken);border-color:var(--color-border-subtle)}.spinner-wrapper{display:inline-flex;align-items:center;justify-content:center}.spinner{border-radius:var(--radius-full);border:2px solid var(--color-border-subtle);border-top-color:var(--color-primary);animation:spinnerRotate .8s linear infinite}.spinner-sm{width:16px;height:16px;border-width:2px}.spinner-md{width:24px;height:24px;border-width:2.5px}.spinner-lg{width:36px;height:36px;border-width:3px}.spinner-xl{width:48px;height:48px;border-width:3.5px}.spinner-primary{border-top-color:var(--color-primary)}.spinner-success{border-top-color:var(--color-status-success)}.spinner-warning{border-top-color:var(--color-status-warning)}.spinner-error{border-top-color:var(--color-status-error)}.spinner-inverse{border-color:#ffffff40;border-top-color:#fff}@keyframes spinnerRotate{to{transform:rotate(360deg)}}.loading-overlay{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--space-sm);padding:var(--space-2xl);color:var(--color-text-muted);font-size:var(--font-size-sm)}.loading-dots{display:flex;gap:6px;align-items:center}.loading-dot{width:8px;height:8px;border-radius:var(--radius-full);background:var(--color-primary);animation:loadingBounce 1.2s ease-in-out infinite}.loading-dot:nth-child(2){animation-delay:.15s}.loading-dot:nth-child(3){animation-delay:.3s}@keyframes loadingBounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}.loading-bar{width:120px;height:3px;background:var(--color-surface-sunken);border-radius:var(--radius-full);overflow:hidden;position:relative}.loading-bar-fill{position:absolute;top:0;left:-40%;width:40%;height:100%;background:var(--color-primary);border-radius:var(--radius-full);animation:loadingBarSlide 1.2s ease-in-out infinite}@keyframes loadingBarSlide{0%{left:-40%}to{left:100%}}.loading-pulse{width:48px;height:48px;border-radius:var(--radius-full);background:var(--color-primary);animation:loadingPulse 1.5s ease-in-out infinite;opacity:.2}@keyframes loadingPulse{0%,to{transform:scale(.8);opacity:.2}50%{transform:scale(1.2);opacity:.5}}.icon-btn-color-secondary{background:var(--color-secondary);color:#fff}.icon-btn-color-secondary:hover:not(:disabled){background:var(--color-secondary-hover)}.icon-btn-color-tertiary{background:var(--color-tertiary);color:#fff}.icon-btn-color-tertiary:hover:not(:disabled){background:var(--color-tertiary-hover)}.toolbar .icon-btn-ghost[data-active=true][data-color=secondary]{background:var(--color-secondary);color:#fff}.toolbar .icon-btn-ghost[data-active=true][data-color=tertiary]{background:var(--color-tertiary);color:#fff}.switch-track[data-checked=true][data-color=secondary]{background:var(--color-secondary)}.switch-track[data-checked=true][data-color=tertiary]{background:var(--color-tertiary)}.checkbox-box[data-checked=true][data-color=secondary]{background:var(--color-secondary);border-color:var(--color-secondary)}.checkbox-box[data-checked=true][data-color=tertiary]{background:var(--color-tertiary);border-color:var(--color-tertiary)}.radio-circle[data-checked=true][data-color=secondary]{border-color:var(--color-secondary)}.radio-circle[data-checked=true][data-color=secondary]:after{background:var(--color-secondary)}.radio-circle[data-checked=true][data-color=tertiary]{border-color:var(--color-tertiary)}.radio-circle[data-checked=true][data-color=tertiary]:after{background:var(--color-tertiary)}.slider-fill-secondary{background:var(--color-secondary)}.slider-fill-tertiary{background:var(--color-tertiary)}.slider-thumb-secondary{border-color:var(--color-secondary)}.slider-thumb-tertiary{border-color:var(--color-tertiary)}.slider-step-dot[data-filled=true][data-color=secondary]{background:var(--color-secondary)}.slider-step-dot[data-filled=true][data-color=tertiary]{background:var(--color-tertiary)}.tag-input-tag[data-color=secondary]{background:color-mix(in srgb,var(--color-secondary) 15%,var(--color-surface-card));border-color:var(--color-secondary);color:var(--color-secondary)}.tag-input-tag[data-color=tertiary]{background:color-mix(in srgb,var(--color-tertiary) 15%,var(--color-surface-card));border-color:var(--color-tertiary);color:var(--color-tertiary)}.toggle-group-btn[data-active=true][data-color=secondary]{background:var(--color-secondary);color:#fff;border-color:var(--color-secondary)}.toggle-group-btn[data-active=true][data-color=tertiary]{background:var(--color-tertiary);color:#fff;border-color:var(--color-tertiary)}.avatar-color-secondary{background:var(--color-secondary);color:#fff}.avatar-color-tertiary{background:var(--color-tertiary);color:#fff}.stepper-node[data-status=complete][data-color=secondary]{background:var(--color-secondary);border-color:var(--color-secondary)}.stepper-node[data-status=active][data-color=secondary]{border-color:var(--color-secondary);color:var(--color-secondary)}.stepper-connector[data-complete=true][data-color=secondary]{background:var(--color-secondary)}.stepper-node[data-status=complete][data-color=tertiary]{background:var(--color-tertiary);border-color:var(--color-tertiary)}.stepper-node[data-status=active][data-color=tertiary]{border-color:var(--color-tertiary);color:var(--color-tertiary)}.stepper-connector[data-complete=true][data-color=tertiary]{background:var(--color-tertiary)}.page-btn[data-active=true][data-color=secondary]{background:var(--color-secondary);border-color:var(--color-secondary);color:#fff}.page-btn[data-active=true][data-color=tertiary]{background:var(--color-tertiary);border-color:var(--color-tertiary);color:#fff}.spinner-secondary{border-top-color:var(--color-secondary)}.spinner-tertiary{border-top-color:var(--color-tertiary)}.tab-trigger[data-active=true][data-color=secondary]{color:var(--color-secondary);border-bottom-color:var(--color-secondary)}.tab-trigger[data-active=true][data-color=tertiary]{color:var(--color-tertiary);border-bottom-color:var(--color-tertiary)}.blockquote-secondary{border-left-color:var(--color-secondary)}.blockquote-tertiary{border-left-color:var(--color-tertiary)}.text-style-btn[data-active=true][data-color=secondary]{background:var(--color-secondary);color:#fff}.text-style-btn[data-active=true][data-color=tertiary]{background:var(--color-tertiary);color:#fff}.navbar-link[data-active=true][data-color=secondary]{color:var(--color-secondary);background:color-mix(in srgb,var(--color-secondary) 10%,var(--color-surface-card))}.navbar-link[data-active=true][data-color=tertiary]{color:var(--color-tertiary);background:color-mix(in srgb,var(--color-tertiary) 10%,var(--color-surface-card))}.sidebar-item[data-active=true][data-color=secondary]{color:var(--color-secondary);background:color-mix(in srgb,var(--color-secondary) 10%,var(--color-surface-card))}.sidebar-item[data-active=true][data-color=tertiary]{color:var(--color-tertiary);background:color-mix(in srgb,var(--color-tertiary) 10%,var(--color-surface-card))}.datepicker-day[data-selected=true][data-color=secondary]{background:var(--color-secondary)}.datepicker-day[data-selected=true][data-color=tertiary]{background:var(--color-tertiary)}.datepicker-day[data-today=true][data-color=secondary]{border-color:var(--color-secondary)}.datepicker-day[data-today=true][data-color=tertiary]{border-color:var(--color-tertiary)}.timepicker-option[data-selected=true][data-color=secondary]{background:var(--color-secondary)}.timepicker-option[data-selected=true][data-color=tertiary]{background:var(--color-tertiary)}.timepicker{display:flex;flex-direction:column;gap:var(--space-xs)}.timepicker-trigger{display:inline-flex;align-items:center;gap:var(--space-sm);padding:10px 14px;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--color-text-body);transition:border-color var(--duration-fast) var(--ease-default)}.timepicker-trigger:hover{border-color:var(--color-primary)}.timepicker-trigger svg{width:16px;height:16px;color:var(--color-text-muted)}.timepicker-dropdown{position:absolute;top:calc(100% + 4px);left:0;z-index:800;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-sm) var(--space-md);display:flex;gap:var(--space-lg);align-items:flex-start;animation:dropIn var(--duration-fast) var(--ease-enter);max-width:calc(100vw - 24px)}.timepicker-column{display:flex;flex-direction:column;gap:1px;max-height:220px;overflow-y:auto;min-width:48px;scrollbar-width:thin}.timepicker-column::-webkit-scrollbar{width:4px}.timepicker-column::-webkit-scrollbar-thumb{background:var(--color-border-subtle);border-radius:4px}.timepicker-column-label{font-size:11px;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-weight:var(--font-weight-medium);padding-bottom:var(--space-xs);text-align:center}.timepicker-option{padding:6px 14px;font-size:var(--font-size-sm);font-family:var(--font-mono);color:var(--color-text-body);border-radius:var(--radius-sm);cursor:pointer;text-align:center;border:none;background:none;transition:all var(--duration-fast) var(--ease-default);white-space:nowrap}.timepicker-option:hover{background:var(--color-surface-sunken)}.timepicker-option[data-selected=true]{background:var(--color-primary);color:var(--color-text-inverse);font-weight:var(--font-weight-semibold)}.daterange{display:flex;flex-direction:column;gap:var(--space-xs)}.daterange-trigger{display:inline-flex;align-items:center;gap:var(--space-sm);padding:10px 14px;background:var(--color-surface-card);border:var(--border-default) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-body);font-size:var(--font-size-sm);color:var(--color-text-body);transition:border-color var(--duration-fast) var(--ease-default)}.daterange-trigger:hover{border-color:var(--color-primary)}.daterange-trigger svg{width:16px;height:16px;color:var(--color-text-muted)}.daterange-dropdown{position:absolute;top:calc(100% + 4px);left:0;z-index:800;background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-md);animation:dropIn var(--duration-fast) var(--ease-enter);max-width:calc(100vw - 24px)}.daterange-calendars{display:flex;gap:var(--space-lg)}@media(max-width:640px){.daterange-calendars{flex-direction:column}}.datepicker-day[data-in-range=true]{background:color-mix(in srgb,var(--color-primary) 15%,var(--color-surface-card))}.datepicker-day[data-range-start=true]{background:var(--color-primary);color:var(--color-text-inverse);border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.datepicker-day[data-range-end=true]{background:var(--color-primary);color:var(--color-text-inverse);border-radius:0 var(--radius-sm) var(--radius-sm) 0}.drag-list{display:flex;flex-direction:column;gap:0}.drag-item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-subtle);border-radius:var(--radius-md);cursor:grab;-webkit-user-select:none;user-select:none;transition:box-shadow var(--duration-fast) var(--ease-default),border-color var(--duration-fast) var(--ease-default),opacity var(--duration-fast) var(--ease-default);margin-bottom:4px;position:relative}.drag-item:hover{border-color:var(--color-border-default)}.drag-item:active{cursor:grabbing}.drag-item[data-dragging=true]{opacity:.35;border-style:dashed;border-color:var(--color-primary)}.drag-handle{display:flex;align-items:center;color:var(--color-text-muted);cursor:grab;flex-shrink:0}.drag-item-content{flex:1;font-size:var(--font-size-sm);color:var(--color-text-body);min-width:0}.drag-item-right{display:flex;align-items:center;gap:var(--space-xs);flex-shrink:0}.drag-drop-indicator{height:3px;background:var(--color-primary);border-radius:var(--radius-full);margin:-1px 0;position:relative;z-index:2;pointer-events:none;box-shadow:0 0 8px color-mix(in srgb,var(--color-primary) 50%,transparent)}.drag-drop-indicator:before{content:"";position:absolute;left:-4px;top:50%;transform:translateY(-50%);width:10px;height:10px;border-radius:var(--radius-full);background:var(--color-primary)}.drag-group{display:flex;flex-direction:column;margin-bottom:4px}.drag-group-header{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface-card);border:var(--border-thin) var(--border-style) var(--color-border-default);border-radius:var(--radius-md);cursor:grab;-webkit-user-select:none;user-select:none;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);color:var(--color-text-heading);position:relative}.drag-group-header[data-dragging=true]{opacity:.35;border-style:dashed;border-color:var(--color-primary)}.drag-group-header-target{border-color:var(--color-primary)!important;background:color-mix(in srgb,var(--color-primary) 12%,var(--color-surface-card))!important;box-shadow:inset 0 0 0 2px var(--color-primary),0 0 8px color-mix(in srgb,var(--color-primary) 25%,transparent)!important}.drag-group-children{margin-left:var(--space-lg);padding-left:var(--space-sm);border-left:2px solid var(--color-border-subtle);display:flex;flex-direction:column;margin-top:2px;padding-top:2px;padding-bottom:2px}.drag-group-children .drag-item{font-size:var(--font-size-sm)}.drag-group-collapse{background:none;border:none;cursor:pointer;display:flex;align-items:center;color:var(--color-text-muted);padding:0;transition:transform var(--duration-fast) var(--ease-default)}.drag-group-collapse svg{width:14px;height:14px}.drag-group-collapse[data-open=true]{transform:rotate(90deg)}.drag-empty-hint{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-xs);color:var(--color-text-muted);font-style:italic}.scroll-indicator{position:fixed;top:0;left:0;right:0;height:3px;z-index:200}.scroll-indicator-bar{height:100%;background:var(--color-primary);transition:width 50ms linear}@media(max-width:640px){.showcase-header{flex-direction:column;align-items:flex-start;padding:var(--space-sm) var(--space-md)}.showcase-body{padding:var(--space-lg) var(--space-md)}.direction-switcher{width:100%;flex-wrap:wrap}.direction-btn{flex:1;min-width:0;padding:6px 4px;font-size:11px;text-align:center}.download-btn{width:100%;justify-content:center}.demo-grid{grid-template-columns:1fr}.form-demo{max-width:100%}.table-wrapper{max-width:calc(100vw - var(--space-md) - var(--space-md))}.adt-toolbar{flex-direction:column}.adt-search{width:100%;min-width:0}.component-row{gap:var(--space-xs)}.stepper{overflow-x:auto;min-width:0;padding-bottom:var(--space-sm)}.tabs-list{overflow-x:auto;-webkit-overflow-scrolling:touch}.tab-trigger{white-space:nowrap;flex-shrink:0}.toggle-group,.otp-slots{flex-wrap:wrap}.pagination{flex-wrap:wrap;justify-content:center}.breadcrumb{font-size:var(--font-size-xs)}.bar-chart-labels{overflow-x:auto}.navbar{padding:var(--space-sm)}.navbar-links{flex-wrap:wrap;gap:0}.navbar-link{padding:4px 8px;font-size:var(--font-size-xs)}.dashboard{flex-direction:column;min-height:auto;overflow:visible;border-radius:0;border:none}.dashboard-sidebar{display:none}.dashboard-topbar{flex-wrap:wrap;padding:var(--space-sm) 0;gap:var(--space-xs);border-left:none;border-right:none;border-radius:0}.dashboard-topbar-title{width:100%}.dashboard-main{overflow:visible}.dashboard-content{padding:0;padding-top:var(--space-md)}.dashboard-content .grid{grid-template-columns:1fr!important}.dashboard-content .card{overflow:hidden}.dashboard-card-flush .card-body{overflow-x:auto}.sheet-panel{width:100%;max-width:100%}.cmd-panel{width:95vw}[style*="grid-template-columns: 1fr 1fr"]{grid-template-columns:1fr!important}[style*="grid-template-columns: repeat"]{grid-template-columns:1fr 1fr!important}}@media(max-width:380px){.dashboard-grid-4{grid-template-columns:1fr}.direction-btn{font-size:11px;padding:5px 3px}.otp-slot{width:36px;height:40px;font-size:var(--font-size-lg)}}html{scrollbar-gutter:stable}.app-shell{display:flex;flex-direction:column;height:100dvh;overflow:hidden}.navbar{background:var(--color-text-heading);color:var(--color-text-inverse);padding:0 24px;height:52px;display:flex;align-items:center;gap:24px;box-shadow:0 2px 8px #3a24181f;position:sticky;top:0;z-index:100;border-radius:0;border:none}.nav-brand{font-family:var(--font-heading);font-size:18px;font-weight:700;color:var(--color-text-inverse);letter-spacing:-.01em}.nav-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:#faf5ef99;text-decoration:none;padding:14px 0;border-bottom:2px solid transparent;transition:color .18s ease}.nav-link svg{width:14px;height:14px;flex-shrink:0}.nav-link:hover{color:var(--color-text-inverse)}.nav-link.active{color:var(--color-text-inverse);border-bottom-color:var(--color-primary)}.nav-spacer{flex:1}.nav-avatar{width:32px;height:32px;border-radius:var(--radius-full);background:var(--color-primary);color:var(--color-text-inverse);display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-size:13px;font-weight:600}@media(max-width:768px){.navbar{padding:0 16px;gap:16px}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border-default);border-radius:var(--radius-full)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes empty-state-pulse{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.12);opacity:.25}}.empty-state-icon{display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--color-surface-sunken);color:var(--color-text-muted);animation:empty-state-pulse 3s ease-in-out infinite}.empty-state-icon svg{flex-shrink:0}.preview-body a{color:var(--color-primary);text-decoration:underline}.preview-body a:hover{color:var(--color-accent)}.preview-body h1,.preview-body h2,.preview-body h3,.preview-body h4,.preview-body h5,.preview-body h6{font-family:var(--font-heading);font-weight:var(--font-weight-bold);color:var(--color-text-heading);margin:var(--space-lg) 0 var(--space-sm)}.preview-body h1{font-size:var(--font-size-2xl)}.preview-body h2{font-size:var(--font-size-xl)}.preview-body h3{font-size:var(--font-size-lg)}.preview-body h4{font-size:var(--font-size-base)}.preview-body ul,.preview-body ol{padding-left:var(--space-lg);margin:var(--space-sm) 0}.preview-body li{margin-bottom:var(--space-xs)}.preview-body p{margin:0 0 var(--space-md)}.preview-body code{font-family:var(--font-mono);font-size:.9em;background:var(--color-surface-sunken);padding:2px 6px;border-radius:var(--radius-sm)}.preview-body img{max-width:100%;border-radius:var(--radius-md);margin:var(--space-md) 0}.reading-header{margin-bottom:20px}.reading-meta{display:flex;align-items:center;gap:12px;padding-bottom:20px;border-bottom:1px solid var(--color-border-subtle)}.reading-avatar{width:44px;height:44px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:600;font-size:16px;color:var(--color-text-inverse);flex-shrink:0}.reading-sender-info{flex:1;min-width:0}.reading-sender-name{font-size:15px;font-weight:700;color:var(--color-text-heading)}.bg-primary{background:var(--color-primary)}.bg-secondary{background:var(--color-secondary)}.bg-tertiary{background:var(--color-tertiary)}.bg-accent{background:var(--color-accent)}.reading-body{background:var(--color-surface-card);border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);padding:32px;box-shadow:var(--shadow-sm);font-size:15px;line-height:1.75;color:var(--color-text-body)}.reading-body p{margin-bottom:16px}.reading-body p:last-child{margin-bottom:0}.reading-body strong{color:var(--color-text-heading);font-weight:600}.reading-body a{color:var(--color-primary);text-decoration:underline;text-decoration-color:#c4653a4d;text-underline-offset:2px}.reading-body a:hover{text-decoration-color:var(--color-primary)}.reading-body blockquote{border-left:3px solid var(--color-border-default);padding-left:16px;margin:16px 0;color:var(--color-text-muted);font-style:italic}.reading-body ul,.reading-body ol{padding-left:24px;margin-bottom:16px}.reading-body li{margin-bottom:4px}.reading-body code{font-family:var(--font-mono);font-size:.875em;background:var(--color-surface-sunken);padding:2px 6px;border-radius:var(--radius-sm)}.reading-body img{max-width:100%;border-radius:var(--radius-md);margin:var(--space-md) 0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.saving-spinner{display:inline-block;width:12px;height:12px;border:2px solid var(--color-border-default);border-top-color:var(--color-primary);border-radius:50%;animation:spin .6s linear infinite}.inbox-layout{display:flex;flex:1;overflow:hidden;position:relative}.inbox-sidebar-container{position:relative;width:380px;margin:12px 0 12px 12px;flex-shrink:0;transition:width .25s ease,margin .25s ease,opacity .25s ease}.inbox-sidebar-container.collapsed{width:0;margin-left:0;margin-right:0;opacity:0;overflow:hidden;pointer-events:none}.inbox-sidebar{width:100%;height:100%;border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);background:var(--color-surface-card);display:flex;flex-direction:column;box-shadow:var(--shadow-md);overflow:hidden}.sidebar-toggle-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);border:1px solid var(--color-border-subtle);background:var(--color-surface-card);color:var(--color-text-muted);cursor:pointer;box-shadow:var(--shadow-sm);z-index:10}.sidebar-toggle-btn:hover{color:var(--color-text-body);background:var(--color-surface-sunken)}.sidebar-toggle-collapse{position:absolute;top:8px;right:8px}.sidebar-toggle-expand{position:absolute;left:12px;top:18px}.reading-pane{flex:1;min-width:0;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;padding:32px 40px;background:var(--color-surface-page)}.reading-pane-inner{width:100%;max-width:720px;margin:0 auto;flex:1;display:flex;flex-direction:column}.sidebar-header{padding:10px 20px;border-bottom:1px solid var(--color-border-subtle);display:flex;flex-direction:column;align-items:center}.sidebar-folder-desc{font-size:11px;color:var(--color-text-muted);margin:6px 0 0;text-align:center;line-height:1.4}.sidebar-filter{display:flex;gap:0}.sidebar-filter-btn{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.04em;padding:5px 10px;background:none;border:1px solid var(--color-border-default);color:var(--color-text-muted);cursor:pointer;transition:all .15s ease}.sidebar-filter-btn svg{width:13px;height:13px;flex-shrink:0}.sidebar-filter-btn:first-child{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.sidebar-filter-btn:last-child{border-radius:0 var(--radius-sm) var(--radius-sm) 0}.sidebar-filter-btn:not(:first-child){border-left:none}.sidebar-filter-btn:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.sidebar-filter-btn.active{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}@media(max-width:768px){.inbox-layout{flex-direction:column}.inbox-sidebar-container{width:100%;flex:1;margin:0;border-radius:0}.inbox-sidebar{width:100%;height:100%;border:none;border-radius:0;box-shadow:none}.sidebar-toggle-btn{display:none}.reading-pane{padding:20px 16px}.reading-pane-inner{max-width:none}.inbox-layout.show-reading .inbox-sidebar-container{display:none}.inbox-layout:not(.show-reading) .reading-pane{display:none}.reading-body{padding:20px}}.btn-group-bar{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-bottom:12px}.btn-group-label{font-size:11px;font-weight:600;color:var(--color-text-muted);letter-spacing:.06em;text-transform:uppercase}.btn-group{display:inline-flex;border:1px solid var(--color-border-default);border-radius:var(--radius-md);overflow:hidden}.btn-group-item{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.06em;padding:5px 10px;border:none;cursor:pointer;transition:all .18s ease;background:var(--color-surface-card);color:var(--color-text-muted);border-right:1px solid var(--color-border-subtle)}.btn-group-item:last-child{border-right:none}.btn-group-item:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.btn-group-item svg{width:12px;height:12px}.btn-group-item.active{background:var(--color-surface-sunken);color:var(--color-text-heading);font-weight:700;cursor:default}.btn-group-item:disabled{cursor:default;opacity:1}.btn-group-item:disabled:hover{background:var(--color-surface-sunken);color:var(--color-text-heading)}.back-btn{display:none;align-items:center;gap:4px;font-family:var(--font-body);font-size:13px;font-weight:500;color:var(--color-text-muted);background:none;border:none;cursor:pointer;padding:0;margin-right:auto}.back-btn:hover{color:var(--color-text-body)}@media(max-width:768px){.back-btn{display:inline-flex}}.editable-wrap{position:relative}.reset-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:20px;height:20px;padding:0;border:none;border-radius:var(--radius-full);background:var(--color-status-warning);color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .12s ease,background .18s ease;z-index:2}.reset-btn svg{width:12px;height:12px}.reset-btn:hover{background:var(--color-secondary)}.reset-btn.visible{opacity:1;pointer-events:auto}.preview-page{width:100%;max-width:800px;margin:0 auto;padding:32px 16px;box-sizing:border-box;overflow-y:auto;flex:1}.page-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}.page-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-full);color:var(--color-text-inverse);flex-shrink:0}.page-icon svg{width:22px;height:22px}.page-title{font-family:var(--font-heading);font-size:25px;font-weight:700;color:var(--color-text-heading);letter-spacing:-.01em}.page-count{font-size:12px;font-weight:600;background:var(--color-surface-sunken);color:var(--color-text-muted);padding:2px 8px;border-radius:var(--radius-full)}.toggle{position:relative;width:36px;height:20px;display:inline-block}.toggle input{opacity:0;width:0;height:0;position:absolute}.toggle-track{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-border-default);border-radius:var(--radius-full);transition:background .18s ease;cursor:pointer}.toggle input:checked+.toggle-track{background:var(--color-status-success)}.toggle-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:var(--radius-full);box-shadow:0 1px 3px #00000026;transition:transform .18s ease;pointer-events:none}.toggle input:checked~.toggle-thumb{transform:translate(16px)}.pub-toggle{display:flex;align-items:center;gap:10px}.pub-toggle-label{font-size:13px;color:var(--color-text-muted)}.pub-status{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:var(--radius-full)}.pub-status-live{background:#6a8a4a1a;color:var(--color-status-success)}.pub-status-hidden{background:var(--color-surface-sunken);color:var(--color-text-muted)}.preview-banner{display:flex;align-items:center;gap:10px;background:#6a8a4a0d;border:1px solid #6a8a4a33;border-radius:var(--radius-md);padding:10px 16px;margin-bottom:20px}.preview-banner-icon{color:var(--color-status-success);flex-shrink:0}.preview-banner-icon svg{width:16px;height:16px}.preview-banner-text{font-size:13px;color:var(--color-text-body);flex:1}.preview-banner-text a{color:var(--color-primary);text-decoration:underline}.preview-banner-copy{display:inline-flex;gap:5px;align-items:center;font-size:12px;font-weight:600;color:var(--color-text-muted);background:none;border:1px solid var(--color-border-default);border-radius:var(--radius-sm);padding:5px 10px;cursor:pointer;transition:all .18s ease}.preview-banner-copy svg{width:14px;height:14px}.preview-banner-copy:hover{background:var(--color-surface-card);color:var(--color-text-body)}.unpublished-banner{display:flex;align-items:center;gap:10px;background:var(--color-surface-sunken);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);padding:10px 16px;margin-bottom:20px}.unpublished-banner-icon{color:var(--color-text-muted);flex-shrink:0}.unpublished-banner-icon svg{width:16px;height:16px}.unpublished-banner-text{font-size:13px;color:var(--color-text-muted)}.archive-preview-section{margin-top:4px;width:100%}.archive-preview-label{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:8px}.archive-preview{background:#fff;border:1px solid #e8e8e8;border-radius:12px;padding:32px 28px 20px;box-shadow:0 2px 8px #0000000a;font-family:system-ui,-apple-system,sans-serif;width:100%;box-sizing:border-box}.archive-title{font-size:28px;font-weight:700;color:#222;margin-bottom:6px;outline:none;border-bottom:1px dashed transparent;cursor:text}.archive-title:hover{border-bottom-color:#ddd}.archive-title:focus{border-bottom-color:#bbb}.archive-subtitle{font-size:15px;color:#666;margin-bottom:20px;outline:none;border-bottom:1px dashed transparent;cursor:text}.archive-subtitle:hover{border-bottom-color:#ddd}.archive-subtitle:focus{border-bottom-color:#bbb}.archive-search-bar{display:flex;gap:8px;margin-bottom:16px}.archive-search{flex:1;padding:8px 12px;font-size:13px;border:1px solid #e0e0e0;border-radius:8px;background:#fafafa;outline:none;font-family:system-ui,-apple-system,sans-serif}.archive-search:focus{border-color:#ccc;background:#fff}.archive-sort{display:inline-flex;gap:5px;align-items:center;font-size:12px;font-weight:500;color:#666;background:#fafafa;border:1px solid #e0e0e0;border-radius:8px;padding:0 12px;cursor:pointer;font-family:system-ui,-apple-system,sans-serif}.archive-sort svg{width:14px;height:14px}.archive-sort:hover{background:#f0f0f0;color:#555}.archive-email{position:relative;display:flex;gap:12px;padding:14px 8px;border-bottom:1px solid #f0f0f0;border-radius:6px;transition:background .12s ease;align-items:center}.archive-email:last-child{border-bottom:none}.archive-email:hover{background:#f8f8f8}.archive-email-content{flex:1;min-width:0}.archive-email-date{font-size:12px;color:#777;font-family:system-ui,-apple-system,sans-serif;margin-bottom:2px}.archive-email-subject{font-size:16px;font-weight:600;color:#222;line-height:1.35;margin-bottom:2px}.archive-email-preheader{font-size:13px;color:#666;line-height:1.45}.archive-email-actions{position:absolute;right:8px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:6px;opacity:0;transition:opacity .12s ease;pointer-events:none;background:linear-gradient(90deg,transparent,#f8f8f8 12px,#f8f8f8);padding:4px 4px 4px 16px;border-radius:6px}.archive-email:hover .archive-email-actions{pointer-events:auto}.archive-email:hover .archive-email-actions{opacity:1}.archive-email-actions-label{font-family:system-ui,-apple-system,sans-serif;font-size:11px;color:#777;white-space:nowrap}.archive-email-btn-group{display:flex}.archive-email-btn-group button{display:inline-flex;align-items:center;gap:4px;font-family:system-ui,-apple-system,sans-serif;font-size:11px;font-weight:500;padding:4px 10px;background:#fff;color:#777;border:1px solid #ddd;cursor:pointer;transition:background .12s ease,color .12s ease;white-space:nowrap}.archive-email-btn-group button svg{width:12px;height:12px}.archive-email-btn-group button:first-child{border-radius:6px 0 0 6px}.archive-email-btn-group button:last-child{border-radius:0 6px 6px 0;border-left:none}.archive-email-btn-group button:hover{background:#f0f0f0;color:#333}@media(max-width:768px){.preview-page{padding:20px 12px}.page-header{flex-wrap:wrap;gap:8px}.pub-toggle-label{display:none}.preview-banner{flex-wrap:wrap}.preview-banner-copy{margin-left:auto}.archive-preview{padding:24px 16px 16px}.archive-email-subject{font-size:15px}.archive-email-content{position:relative}.archive-email-actions{position:absolute;right:8px;top:14px;transform:none;opacity:1;pointer-events:auto;background:none;padding:0}.archive-email-actions-label,.archive-email-btn-label{display:none}.archive-email-btn-group button{padding:4px 6px}}.settings-page{flex:1;overflow-y:auto}.settings-page-inner{max-width:800px;margin:0 auto;padding:32px 16px 64px;box-sizing:border-box;width:100%}.settings-section{background:var(--color-surface-card);border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);padding:24px;margin-bottom:16px;box-shadow:var(--shadow-sm)}.settings-section-header{display:flex;align-items:center;gap:12px;margin-bottom:6px}.settings-section-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-full);background:var(--color-tertiary);color:var(--color-text-inverse);flex-shrink:0}.settings-section-icon svg{width:18px;height:18px}.settings-section-title{font-family:var(--font-heading);font-size:17px;font-weight:700;color:var(--color-text-heading);letter-spacing:-.01em}.settings-section-desc{font-size:13px;color:var(--color-text-muted);margin-bottom:16px;line-height:1.55;padding-left:48px}.subdomain-display{display:flex;align-items:center;gap:8px}.subdomain-url{font-family:var(--font-mono);font-size:14px;color:var(--color-text-heading);padding:6px 10px;border-radius:var(--radius-md);border:1.5px solid transparent;cursor:pointer;transition:background .15s ease,border-color .15s ease}.subdomain-url:hover{background:var(--color-surface-sunken)}.subdomain-editable{font-weight:700;border-bottom:1.5px dashed var(--color-border-strong)}.subdomain-copy-btn{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.04em;padding:5px 10px;background:none;border:1px solid var(--color-border-default);border-radius:var(--radius-sm);color:var(--color-text-muted);cursor:pointer;transition:all .18s ease}.subdomain-copy-btn:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.subdomain-copy-btn svg{width:12px;height:12px}.subdomain-edit{display:flex;align-items:stretch;height:38px}.subdomain-prefix{display:flex;align-items:center;font-family:var(--font-mono);font-size:13px;color:var(--color-text-muted);padding:0 4px 0 12px;background:var(--color-surface-sunken);border:1.5px solid var(--color-border-default);border-right:none;border-radius:var(--radius-md) 0 0 var(--radius-md);white-space:nowrap}.subdomain-input{font-family:var(--font-mono);font-size:14px;font-weight:600;color:var(--color-text-heading);padding:0 4px;width:120px;background:var(--color-surface-raised);border:1.5px solid var(--color-border-default);border-left:none;border-right:none;outline:none}.subdomain-input:focus{box-shadow:inset 0 -2px 0 0 var(--color-primary)}.subdomain-suffix{display:flex;align-items:center;font-family:var(--font-mono);font-size:13px;color:var(--color-text-muted);padding:0 12px 0 4px;background:var(--color-surface-sunken);border:1.5px solid var(--color-border-default);border-left:none;white-space:nowrap}.subdomain-save{display:flex;align-items:center;font-family:var(--font-body);font-size:12px;font-weight:600;padding:0 12px;background:var(--color-primary);color:var(--color-text-inverse);border:1.5px solid var(--color-primary);border-radius:0;cursor:pointer;transition:background .18s ease;white-space:nowrap}.subdomain-save:hover{background:var(--color-primary-hover)}.subdomain-cancel{display:flex;align-items:center;font-family:var(--font-body);font-size:12px;font-weight:600;padding:0 12px;background:var(--color-surface-card);color:var(--color-text-muted);border:1.5px solid var(--color-border-default);border-left:none;border-radius:0 var(--radius-md) var(--radius-md) 0;cursor:pointer;transition:all .18s ease;white-space:nowrap}.subdomain-cancel:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.subdomain-status{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:12px;font-weight:500}.subdomain-status svg{width:14px;height:14px}.subdomain-status-available{color:var(--color-status-success)}.subdomain-status-taken{color:var(--color-status-error)}.subdomain-status-checking{color:var(--color-text-muted)}.cname-alert{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding:12px 14px;background:#5a7a9a12;border:1px solid #5a7a9a30;border-radius:var(--radius-md)}.cname-alert-icon{color:var(--color-status-info);flex-shrink:0;margin-top:1px}.cname-alert-icon svg{width:16px;height:16px}.cname-alert-body{flex:1;min-width:0}.cname-alert-title{font-size:13px;font-weight:700;color:var(--color-text-heading);margin-bottom:4px}.cname-alert-text{font-size:12.5px;color:var(--color-text-body);line-height:1.55}.cname-alert-record{display:inline-flex;align-items:center;gap:8px;margin-top:8px;padding:6px 10px;background:var(--color-surface-sunken);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:12px;color:var(--color-text-heading)}.cname-alert-record-arrow{color:var(--color-text-muted)}.copy-field{display:flex;align-items:stretch}.copy-field-input{flex:1;font-family:var(--font-mono);font-size:13px;padding:0 12px;height:38px;background:var(--color-surface-sunken);border:1.5px solid var(--color-border-default);border-right:none;border-radius:var(--radius-md) 0 0 var(--radius-md);color:var(--color-text-body);outline:none}.copy-field-btn{display:inline-flex;gap:5px;align-items:center;font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:.04em;padding:0 14px;height:38px;background:var(--color-surface-card);border:1.5px solid var(--color-border-default);border-radius:0 var(--radius-md) var(--radius-md) 0;color:var(--color-text-muted);cursor:pointer;transition:all .18s ease;white-space:nowrap}.copy-field-btn:hover{background:var(--color-surface-sunken);color:var(--color-text-body)}.copy-field-btn svg{width:14px;height:14px}.rules-list{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.rule-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--color-surface-sunken);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);transition:box-shadow .18s ease,opacity .18s ease}.rule-item.dragging{opacity:.4}.rule-item.drag-over{box-shadow:0 -2px 0 0 var(--color-primary)}.drag-handle{display:flex;align-items:center;justify-content:center;cursor:grab;color:var(--color-border-strong);flex-shrink:0;padding:2px;border-radius:4px;transition:color .15s ease}.drag-handle:hover{color:var(--color-text-body)}.drag-handle:active{cursor:grabbing}.drag-handle svg{width:16px;height:16px}.rule-pattern{font-family:var(--font-mono);font-size:13px;color:var(--color-text-heading);font-weight:500}.rule-arrow{color:var(--color-text-muted);font-size:13px;flex-shrink:0}.rule-replacement{font-family:var(--font-mono);font-size:13px;color:var(--color-primary)}.rule-desc{font-size:12px;color:var(--color-text-muted);margin-left:auto;white-space:nowrap}.rule-remove{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:none;border:none;border-radius:var(--radius-sm);color:var(--color-text-muted);cursor:pointer;transition:all .15s ease;flex-shrink:0}.rule-remove:hover{background:#c44a3a1a;color:var(--color-status-error)}.rule-remove svg{width:14px;height:14px}.section-divider{border:none;border-top:1px solid var(--color-border-subtle);margin:16px 0}.add-rule-header{font-size:13px;font-weight:700;color:var(--color-text-heading);margin-bottom:8px}.add-rule-row,.add-rule-fields{display:flex;flex-direction:column;gap:8px}.add-rule-actions{display:flex;align-items:center;justify-content:flex-end}.add-rule-input{flex:1;font-family:var(--font-mono);font-size:13px;padding:8px 12px;background:var(--color-surface-raised);border:1.5px solid var(--color-border-default);border-radius:var(--radius-md);color:var(--color-text-body);outline:none;transition:border-color .18s ease,box-shadow .18s ease}.add-rule-input::placeholder{color:var(--color-text-muted)}.add-rule-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #c4653a1f}.add-rule-arrow{font-size:11px;font-weight:500;color:var(--color-text-muted);padding:0 4px;letter-spacing:.02em;text-align:center}.add-rule-btn{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-body);font-size:12px;font-weight:600;padding:8px 14px;background:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background .18s ease;white-space:nowrap}.add-rule-btn:hover{background:var(--color-primary-hover)}.add-rule-btn svg{width:14px;height:14px}.export-options{display:flex;gap:10px}.export-btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-body);font-size:13px;font-weight:600;padding:10px 18px;border-radius:var(--radius-md);cursor:pointer;transition:all .18s ease;white-space:nowrap}.export-btn svg{width:16px;height:16px}.export-btn-primary{background:var(--color-primary);color:var(--color-text-inverse);border:none}.export-btn-primary:hover{background:var(--color-primary-hover)}.export-btn-primary:disabled{opacity:.6;cursor:not-allowed}.export-note{font-size:12px;color:var(--color-text-muted);margin-top:12px;line-height:1.55}@media(max-width:768px){.settings-page-inner{padding:20px 12px 48px}.settings-section{padding:16px}.subdomain-display{flex-wrap:wrap}.subdomain-edit{flex-wrap:wrap;height:auto}.subdomain-prefix{border-radius:var(--radius-md) var(--radius-md) 0 0;border-right:1.5px solid var(--color-border-default);border-bottom:none}.subdomain-input{width:100%;border-left:1.5px solid var(--color-border-default);border-right:1.5px solid var(--color-border-default)}.subdomain-suffix{border-left:1.5px solid var(--color-border-default);border-bottom:1.5px solid var(--color-border-default)}.subdomain-save{border-radius:0;flex:1;justify-content:center;height:36px}.subdomain-cancel{border-radius:0 0 var(--radius-md) var(--radius-md);border-left:1.5px solid var(--color-border-default);flex:1;justify-content:center;height:36px}.copy-field{flex-direction:column}.copy-field-input{border-right:1.5px solid var(--color-border-default);border-radius:var(--radius-md) var(--radius-md) 0 0}.copy-field-btn{border-radius:0 0 var(--radius-md) var(--radius-md);justify-content:center}.rule-item{flex-wrap:wrap}.rule-desc{display:none}.export-options{flex-direction:column}.export-btn{width:100%;justify-content:center}}