.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);font-family:var(--font-interface);font-weight:var(--fw-medium);font-size:var(--fs-body);border-radius:var(--radius-md);border:var(--border-width-thin) solid transparent;cursor:pointer;transition:background-color var(--motion-duration-fast) var(--motion-easing-standard),border-color var(--motion-duration-fast) var(--motion-easing-standard),color var(--motion-duration-fast) var(--motion-easing-standard),transform var(--motion-duration-fast) var(--motion-easing-standard),box-shadow var(--motion-duration-fast) var(--motion-easing-standard);-webkit-user-select:none;user-select:none;text-decoration:none;white-space:nowrap;min-height:40px;padding:8px 16px}@media (max-width: 639px){.btn{min-height:44px;padding:10px 16px}}.btn-size-small{min-height:32px;padding:4px 10px;font-size:var(--fs-caption);border-radius:var(--radius-sm)}.btn-size-medium{min-height:40px;padding:8px 16px;font-size:var(--fs-body)}.btn-size-large{min-height:48px;padding:12px 24px;font-size:16px;font-weight:var(--fw-semibold)}.btn-primary{background-color:var(--sys-color-interactive-primary);color:var(--btn-primary-text);box-shadow:var(--shadow-elevation-1)}.btn-primary:hover:not(:disabled){background-color:var(--sys-color-interactive-hover);transform:translateY(-1px);box-shadow:var(--shadow-elevation-2)}.btn-primary:active:not(:disabled){background-color:var(--sys-color-interactive-active);transform:translateY(0)}.btn-secondary{background-color:var(--sys-color-bg-surface);border-color:var(--sys-color-border-subtle);color:var(--sys-color-text-primary);box-shadow:var(--shadow-elevation-1)}.btn-secondary:hover:not(:disabled){border-color:var(--sys-color-text-muted);background-color:var(--sys-color-bg-default);transform:translateY(-1px);box-shadow:var(--shadow-elevation-2)}.btn-secondary:active:not(:disabled){transform:translateY(0)}.btn-danger{background-color:var(--sys-color-feedback-error);color:var(--sys-color-bg-surface)}.btn-danger:hover:not(:disabled){background-color:#c91d2e;transform:translateY(-1px)}.btn-ghost{background-color:transparent;color:var(--sys-color-text-primary);border-color:transparent}.btn-ghost:hover:not(:disabled){background-color:var(--sys-color-bg-default);color:var(--sys-color-interactive-primary)}.btn-ai{background-color:var(--sys-color-ai-badge-bg);color:var(--sys-color-ai-primary);border-color:var(--sys-color-ai-badge-border)}.btn-ai:hover:not(:disabled){background-color:var(--sys-color-ai-primary);color:var(--sys-color-bg-surface)}.btn:disabled{background-color:var(--sys-color-border-subtle)!important;color:var(--sys-color-text-muted)!important;border-color:transparent!important;cursor:not-allowed!important;transform:none!important;box-shadow:none!important;opacity:var(--opacity-disabled)}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;min-height:40px;border-radius:var(--radius-full);border:var(--border-width-thin) solid var(--sys-color-border-subtle);background-color:var(--sys-color-bg-surface);color:var(--sys-color-text-primary);cursor:pointer;transition:all var(--motion-duration-fast) var(--motion-easing-standard);padding:0}@media (max-width: 639px){.btn-icon{width:44px;height:44px;min-width:44px;min-height:44px}}.btn-icon:hover:not(:disabled){background-color:var(--sys-color-bg-default);border-color:var(--sys-color-text-muted);color:var(--sys-color-interactive-primary)}.btn-icon:disabled{opacity:var(--opacity-disabled);cursor:not-allowed}.form-group{display:flex;flex-direction:column;gap:var(--spacing-xs);width:100%}.form-label{font-size:var(--fs-caption);font-weight:var(--fw-semibold);color:var(--sys-color-text-muted);letter-spacing:.3px}.form-input,.form-textarea,.form-select{font-family:var(--font-interface);font-size:var(--fs-body);color:var(--sys-color-text-primary);background-color:var(--sys-color-bg-surface);border:var(--border-width-thin) solid var(--sys-color-border-subtle);border-radius:var(--radius-md);padding:10px 14px;width:100%;min-height:40px;transition:border-color var(--motion-duration-fast) var(--motion-easing-standard),box-shadow var(--motion-duration-fast) var(--motion-easing-standard)}@media (max-width: 639px){.form-input,.form-select{min-height:44px;padding:12px 14px}}.form-input:hover,.form-textarea:hover,.form-select:hover{border-color:var(--sys-color-text-muted)}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--sys-color-interactive-primary);box-shadow:0 0 0 3px var(--sys-color-interactive-focus-halo)}.form-input.border-danger,.form-textarea.border-danger{border-color:var(--sys-color-feedback-error)}.form-textarea{min-height:100px;resize:vertical}.select-wrapper{position:relative;width:100%}.select-wrapper select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:36px;cursor:pointer}.select-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--sys-color-text-muted)}.form-check{display:inline-flex;align-items:center;gap:var(--spacing-sm);cursor:pointer;-webkit-user-select:none;user-select:none;min-height:32px}.form-check-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;min-width:18px;border:var(--border-width-thin) solid var(--sys-color-border-subtle);border-radius:var(--radius-xs);background-color:var(--sys-color-bg-surface);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;position:relative;transition:all var(--motion-duration-fast) var(--motion-easing-standard)}.form-check-input:hover{border-color:var(--sys-color-text-muted)}.form-check-input:checked{background-color:var(--sys-color-interactive-primary);border-color:var(--sys-color-interactive-primary)}.form-check-input:checked:after{content:"";width:5px;height:9px;border:solid var(--sys-color-bg-surface);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}.form-check-radio{width:16px;height:16px;min-width:16px;border-radius:var(--radius-full)}.form-check-radio:checked:after{content:"";width:6px;height:6px;border-radius:var(--radius-full);background-color:var(--sys-color-bg-surface);border:none;transform:none}.form-switch{display:inline-flex;align-items:center;gap:var(--spacing-sm);cursor:pointer;-webkit-user-select:none;user-select:none;min-height:44px}.switch-track{width:44px;height:24px;background-color:var(--sys-color-border-subtle);border-radius:var(--radius-full);position:relative;transition:background-color var(--motion-duration-fast) var(--motion-easing-standard)}.switch-thumb{width:18px;height:18px;background-color:var(--sys-color-bg-surface);border-radius:var(--radius-full);position:absolute;top:3px;left:3px;transition:transform var(--motion-duration-fast) var(--motion-easing-standard);box-shadow:var(--shadow-elevation-1)}.form-switch-active .switch-track{background-color:var(--sys-color-interactive-primary)}.form-switch-active .switch-thumb{transform:translate(20px)}.card{background-color:var(--card-bg);border:var(--border-width-thin) solid var(--card-border);border-radius:var(--radius-lg);padding:var(--layout-modal-padding);box-shadow:var(--card-shadow);transition:transform var(--motion-duration-normal) var(--motion-easing-standard),box-shadow var(--motion-duration-normal) var(--motion-easing-standard),border-color var(--motion-duration-normal) var(--motion-easing-standard)}.card-clickable{cursor:pointer}.card-clickable:hover{border-color:var(--sys-color-text-muted);transform:translateY(-2px);box-shadow:var(--shadow-elevation-2)}.card-clickable:active{transform:scale(.99)}.ai-tint{background-color:var(--sys-color-ai-bg)!important;border-color:var(--sys-color-ai-border-subtle)!important}.badge{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:3px 10px;border-radius:var(--radius-full);font-size:var(--fs-caption);font-weight:var(--fw-semibold);line-height:1;white-space:nowrap}.badge-solid{background-color:var(--sys-color-interactive-primary);color:var(--btn-primary-text)}.badge-soft{background-color:var(--sys-color-border-subtle);color:var(--sys-color-text-primary)}.badge-success{background-color:var(--sys-color-feedback-success-soft);color:var(--sys-color-feedback-success)}.badge-warning{background-color:var(--sys-color-feedback-warning-soft);color:var(--sys-color-feedback-warning)}.badge-error{background-color:var(--sys-color-feedback-error-soft);color:var(--sys-color-feedback-error)}.badge-ai{background-color:var(--sys-color-ai-badge-bg);color:var(--sys-color-ai-primary);border:var(--border-width-thin) solid var(--sys-color-ai-badge-border)}.chip{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:6px 12px;border-radius:var(--radius-full);font-size:var(--fs-caption);background-color:var(--sys-color-bg-surface);border:var(--border-width-thin) solid var(--sys-color-border-subtle);color:var(--sys-color-text-primary);cursor:pointer;transition:all var(--motion-duration-fast) var(--motion-easing-standard);min-height:32px}.chip:hover{background-color:var(--sys-color-bg-default);border-color:var(--sys-color-text-muted)}.chip-active{background-color:var(--sys-color-interactive-primary);border-color:var(--sys-color-interactive-primary);color:var(--btn-primary-text)}.chip-dismiss{cursor:pointer;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;padding:2px}.avatar{border-radius:var(--radius-full);display:inline-flex;align-items:center;justify-content:center;font-weight:var(--fw-bold);font-family:var(--font-educational);color:var(--sys-color-bg-surface);background-color:var(--sys-color-interactive-primary);object-fit:cover;-webkit-user-select:none;user-select:none;flex-shrink:0}.avatar-size-small{width:32px;height:32px;font-size:11px}.avatar-size-medium{width:40px;height:40px;font-size:14px}.avatar-size-large{width:64px;height:64px;font-size:22px}.avatar-squared{border-radius:var(--radius-xs)}.tooltip-trigger{position:relative;display:inline-flex}.tooltip-bubble{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);background-color:var(--sys-color-text-primary);color:var(--sys-color-bg-surface);font-size:var(--fs-caption);padding:6px 10px;border-radius:var(--radius-sm);white-space:nowrap;max-width:250px;box-shadow:var(--shadow-elevation-2);z-index:var(--z-tooltip);pointer-events:none;animation:tooltip-fade var(--motion-duration-fast) var(--motion-easing-enter)}@keyframes tooltip-fade{0%{opacity:0;transform:translate(-50%,4px)}to{opacity:1;transform:translate(-50%)}}.toast-container{position:fixed;top:24px;right:24px;display:flex;flex-direction:column;gap:var(--spacing-sm);z-index:var(--z-toast);max-width:400px;width:calc(100% - 48px)}@media (max-width: 639px){.toast-container{top:auto;bottom:24px;left:16px;right:16px;width:calc(100% - 32px)}}.toast-item{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md);padding:var(--layout-content-gap);border-radius:var(--radius-md);background-color:var(--sys-color-bg-surface);border:var(--border-width-thin) solid var(--sys-color-border-subtle);box-shadow:var(--shadow-elevation-3);animation:toast-slide var(--motion-duration-slow) var(--motion-easing-enter)}@keyframes toast-slide{0%{transform:translate(100px);opacity:0}to{transform:translate(0);opacity:1}}.alert{display:flex;align-items:flex-start;gap:var(--spacing-md);padding:var(--layout-content-gap);border-radius:var(--radius-xl);border:var(--border-width-thin) solid transparent;width:100%}.alert-info{background-color:var(--sys-color-feedback-info-soft);border-color:var(--sys-color-interactive-primary);color:var(--sys-color-text-primary)}.alert-warning{background-color:var(--sys-color-feedback-warning-soft);border-color:var(--sys-color-feedback-warning);color:var(--sys-color-text-primary)}.alert-error{background-color:var(--sys-color-feedback-error-soft);border-color:var(--sys-color-feedback-error);color:var(--sys-color-text-primary)}.alert-success{background-color:var(--sys-color-feedback-success-soft);border-color:var(--sys-color-feedback-success);color:var(--sys-color-text-primary)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,var(--opacity-overlay));display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--layout-padding-mobile);animation:fade-in var(--motion-duration-fast) var(--motion-easing-enter)}.modal-box{background-color:var(--sys-color-bg-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-elevation-3);max-width:720px;width:100%;max-height:90vh;overflow-y:auto;display:flex;flex-direction:column;animation:modal-scale var(--motion-duration-normal) var(--motion-easing-enter)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-scale{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@media (max-width: 639px){.modal-overlay{align-items:flex-end;padding:0}.modal-box{max-width:100%;border-bottom-left-radius:0;border-bottom-right-radius:0;max-height:85vh}}.drawer-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,var(--opacity-overlay));z-index:var(--z-drawer);animation:fade-in var(--motion-duration-fast) var(--motion-easing-enter)}.drawer-content{position:fixed;top:0;right:0;bottom:0;width:100%;max-width:480px;background-color:var(--sys-color-bg-surface);box-shadow:var(--shadow-elevation-3);z-index:var(--z-drawer);display:flex;flex-direction:column;padding:var(--layout-drawer-padding);animation:drawer-slide var(--motion-duration-slow) var(--motion-easing-enter)}@keyframes drawer-slide{0%{transform:translate(100%)}to{transform:translate(0)}}@media (max-width: 639px){.drawer-content{max-width:100%;height:90vh;top:auto;bottom:0;border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl);animation:drawer-slide-up var(--motion-duration-slow) var(--motion-easing-enter)}@keyframes drawer-slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}}.sidebar{width:240px;height:100vh;position:fixed;top:0;left:0;background-color:var(--sys-color-bg-surface);border-right:var(--border-width-thin) solid var(--sys-color-border-subtle);display:flex;flex-direction:column;z-index:var(--z-sticky);transition:width var(--motion-duration-normal) var(--motion-easing-standard),transform var(--motion-duration-normal) var(--motion-easing-standard)}.sidebar-link{display:flex;align-items:center;gap:var(--spacing-md);padding:14px var(--layout-sidebar-gap);color:var(--sys-color-text-muted);text-decoration:none;font-weight:var(--fw-medium);transition:all var(--motion-duration-fast) var(--motion-easing-standard);border-right:var(--border-width-thick) solid transparent}.sidebar-link:hover{background-color:var(--sys-color-bg-default);color:var(--sys-color-interactive-primary)}.sidebar-link-active{background-color:var(--sys-color-feedback-info-soft);color:var(--sys-color-interactive-primary);border-right-color:var(--sys-color-interactive-primary);font-weight:var(--fw-semibold)}@media (min-width: 640px) and (max-width: 1023px){.sidebar{width:64px}.sidebar-link span,.sidebar-brand-text{display:none}.sidebar-link{justify-content:center;padding:16px 0}}@media (max-width: 639px){.sidebar{transform:translate(-100%);width:260px;z-index:var(--z-drawer)}.sidebar.mobile-open{transform:translate(0)}}.topbar{height:64px;background-color:var(--sys-color-bg-surface);border-bottom:var(--border-width-thin) solid var(--sys-color-border-subtle);display:flex;align-items:center;justify-content:space-between;padding:0 var(--layout-padding-desktop);position:sticky;top:0;z-index:var(--z-sticky)}@media (max-width: 1023px){.topbar{padding:0 var(--layout-padding-tablet)}}@media (max-width: 639px){.topbar{padding:0 var(--layout-padding-mobile)}}.breadcrumb-nav{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--fs-caption);color:var(--sys-color-text-muted)}.breadcrumb-link{color:var(--sys-color-text-muted);text-decoration:none}.breadcrumb-link:hover{color:var(--sys-color-interactive-primary)}.breadcrumb-active{color:var(--sys-color-text-primary);font-weight:var(--fw-semibold)}.table-container{overflow-x:auto;width:100%;border-radius:var(--radius-lg);border:var(--border-width-thin) solid var(--sys-color-border-subtle);background-color:var(--sys-color-bg-surface)}.data-table{width:100%;border-collapse:collapse;text-align:left}.data-table th{padding:14px 16px;background-color:var(--sys-color-bg-default);border-bottom:var(--border-width-thin) solid var(--sys-color-border-subtle);font-weight:var(--fw-semibold);font-size:var(--fs-caption);color:var(--sys-color-text-muted)}.data-table td{padding:14px 16px;border-bottom:var(--border-width-thin) solid var(--sys-color-border-subtle);font-size:var(--fs-body)}.data-table tr:hover td{background-color:var(--sys-color-bg-default)}.tab-bar{display:flex;border-bottom:var(--border-width-thin) solid var(--sys-color-border-subtle);gap:var(--spacing-lg)}.tab-btn{padding:12px 4px;background:none;border:none;font-size:var(--fs-body);font-weight:var(--fw-medium);color:var(--sys-color-text-muted);cursor:pointer;position:relative;transition:color var(--motion-duration-fast) var(--motion-easing-standard)}.tab-btn:hover{color:var(--sys-color-interactive-primary)}.tab-btn-active{color:var(--sys-color-interactive-primary);font-weight:var(--fw-semibold)}.tab-btn-active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background-color:var(--sys-color-interactive-primary)}.accordion{border:var(--border-width-thin) solid var(--sys-color-border-subtle);border-radius:var(--radius-md);margin-bottom:var(--spacing-sm);background-color:var(--sys-color-bg-surface);overflow:hidden}.accordion-header{padding:14px 16px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-weight:var(--fw-medium);-webkit-user-select:none;user-select:none}.accordion-content{padding:16px;border-top:var(--border-width-thin) solid var(--sys-color-border-subtle);background-color:var(--sys-color-bg-default)}.skeleton{background:var(--sys-color-border-subtle);animation:skeleton-pulse 1.5s infinite var(--motion-easing-standard)}@keyframes skeleton-pulse{0%{opacity:.4}50%{opacity:.8}to{opacity:.4}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px var(--layout-padding-desktop);border:var(--border-width-thin) solid var(--sys-color-border-subtle);border-radius:var(--radius-xl);background-color:var(--sys-color-bg-surface)}.file-upload-zone{border:var(--border-width-thick) dashed var(--sys-color-border-subtle);border-radius:var(--radius-xl);padding:36px var(--layout-modal-padding);text-align:center;cursor:pointer;background-color:var(--sys-color-bg-surface);transition:all var(--motion-duration-fast) var(--motion-easing-standard)}.file-upload-zone:hover,.file-upload-zone.is-dragover{border-color:var(--sys-color-interactive-primary);background-color:var(--sys-color-feedback-info-soft)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes indeterminate-bar{0%{left:-35%;width:35%}50%{left:30%;width:50%}to{left:100%;width:35%}}:root{--font-interface: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-educational: "Outfit", "Plus Jakarta Sans", sans-serif;--font-code: "JetBrains Mono", monospace;--fs-h1: 32px;--fs-h2: 24px;--fs-h3: 18px;--fs-body: 15px;--fs-caption: 12px;--fs-code: 20px;--lh-h1: 1.2;--lh-h2: 1.3;--lh-h3: 1.4;--lh-body: 1.5;--lh-caption: 1.5;--fw-regular: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 48px;--radius-xs: 4px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 999px;--border-width-thin: 1px;--border-width-thick: 2px;--opacity-hover: .08;--opacity-selected: .12;--opacity-disabled: .5;--opacity-overlay: .5;--opacity-focus: .15;--opacity-drag: .6;--z-base: 0;--z-content: 1;--z-sticky: 100;--z-dropdown: 200;--z-command-palette: 300;--z-overlay: 400;--z-drawer: 500;--z-modal: 600;--z-toast: 700;--z-tooltip: 800;--motion-duration-fast: .15s;--motion-duration-normal: .25s;--motion-duration-slow: .35s;--motion-easing-standard: cubic-bezier(.4, 0, .2, 1);--motion-easing-enter: cubic-bezier(0, 0, .2, 1);--motion-easing-exit: cubic-bezier(.4, 0, 1, 1);--layout-container-max: 1280px;--layout-padding-desktop: 32px;--layout-padding-tablet: 24px;--layout-padding-mobile: 16px;--layout-section-gap: 48px;--layout-card-gap: 24px;--layout-grid-gap: 24px;--layout-content-gap: 16px;--layout-sidebar-gap: 24px;--layout-modal-padding: 24px;--layout-drawer-padding: 24px;--icon-size-xs: 12px;--icon-size-sm: 16px;--icon-size-md: 20px;--icon-size-lg: 24px;--icon-size-xl: 32px;--sys-color-chart-primary: hsl(215, 90%, 50%);--sys-color-chart-secondary: hsl(195, 85%, 45%);--sys-color-chart-success: hsl(145, 80%, 42%);--sys-color-chart-warning: hsl(38, 92%, 50%);--sys-color-chart-error: hsl(354, 85%, 52%);--sys-color-ai-primary: hsl(270, 70%, 50%);--sys-color-ai-bg-soft: hsl(270, 70%, 97%);--sys-color-ai-bg-soft-dark: hsl(270, 40%, 15%);--sys-color-ai-badge-bg: rgba(147, 51, 234, .15);--sys-color-ai-badge-border: rgba(147, 51, 234, .3);--sys-color-ai-border-subtle: rgba(147, 51, 234, .25)}:root,.theme-light{--sys-color-bg-default: hsl(210, 20%, 98%);--sys-color-bg-surface: hsl(0, 0%, 100%);--sys-color-text-primary: hsl(210, 40%, 10%);--sys-color-text-muted: hsl(210, 10%, 45%);--sys-color-border-subtle: hsl(210, 10%, 92%);--sys-color-interactive-primary: hsl(215, 90%, 50%);--sys-color-interactive-hover: hsl(215, 90%, 40%);--sys-color-interactive-active: hsl(215, 90%, 35%);--sys-color-interactive-focus-halo: rgba(37, 99, 235, .15);--sys-color-feedback-success: hsl(145, 80%, 42%);--sys-color-feedback-success-soft: rgba(34, 197, 94, .12);--sys-color-feedback-warning: hsl(38, 92%, 50%);--sys-color-feedback-warning-soft: rgba(245, 158, 11, .12);--sys-color-feedback-error: hsl(354, 85%, 52%);--sys-color-feedback-error-soft: rgba(239, 68, 68, .12);--sys-color-feedback-info-soft: rgba(37, 99, 235, .08);--shadow-elevation-1: 0 1px 3px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .03);--shadow-elevation-2: 0 4px 6px -1px rgba(0, 0, 0, .08), 0 2px 4px -1px rgba(0, 0, 0, .04);--shadow-elevation-3: 0 20px 25px -5px rgba(0, 0, 0, .15), 0 10px 10px -5px rgba(0, 0, 0, .04);--sys-color-ai-bg: var(--sys-color-ai-bg-soft);--btn-primary-bg: var(--sys-color-interactive-primary);--btn-primary-text: var(--sys-color-bg-surface);--btn-primary-hover-bg: var(--sys-color-interactive-hover);--card-bg: var(--sys-color-bg-surface);--card-border: var(--sys-color-border-subtle);--card-shadow: var(--shadow-elevation-1);--input-bg: var(--sys-color-bg-surface);--input-border-default: var(--sys-color-border-subtle);--input-border-focus: var(--sys-color-interactive-primary);--input-text-main: var(--sys-color-text-primary)}.theme-dark{--sys-color-bg-default: hsl(220, 25%, 8%);--sys-color-bg-surface: hsl(220, 20%, 12%);--sys-color-text-primary: hsl(210, 20%, 95%);--sys-color-text-muted: hsl(210, 10%, 65%);--sys-color-border-subtle: hsl(220, 15%, 20%);--sys-color-interactive-primary: hsl(215, 100%, 60%);--sys-color-interactive-hover: hsl(215, 100%, 50%);--sys-color-interactive-active: hsl(215, 100%, 45%);--sys-color-interactive-focus-halo: rgba(96, 165, 250, .2);--sys-color-feedback-success: hsl(145, 70%, 45%);--sys-color-feedback-success-soft: rgba(34, 197, 94, .2);--sys-color-feedback-warning: hsl(38, 80%, 55%);--sys-color-feedback-warning-soft: rgba(245, 158, 11, .2);--sys-color-feedback-error: hsl(354, 75%, 55%);--sys-color-feedback-error-soft: rgba(239, 68, 68, .2);--sys-color-feedback-info-soft: rgba(96, 165, 250, .15);--shadow-elevation-1: 0 1px 3px rgba(0, 0, 0, .3), 0 1px 2px rgba(0, 0, 0, .2);--shadow-elevation-2: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-elevation-3: 0 20px 25px -5px rgba(0, 0, 0, .5), 0 10px 10px -5px rgba(0, 0, 0, .4);--sys-color-ai-bg: var(--sys-color-ai-bg-soft-dark);--btn-primary-bg: var(--sys-color-interactive-primary);--btn-primary-text: hsl(220, 25%, 8%);--btn-primary-hover-bg: var(--sys-color-interactive-hover);--card-bg: var(--sys-color-bg-surface);--card-border: var(--sys-color-border-subtle);--card-shadow: var(--shadow-elevation-1);--input-bg: var(--sys-color-bg-surface);--input-border-default: var(--sys-color-border-subtle);--input-border-focus: var(--sys-color-interactive-primary);--input-text-main: var(--sys-color-text-primary)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-interface);background-color:var(--sys-color-bg-default);color:var(--sys-color-text-primary);line-height:var(--lh-body);font-size:var(--fs-body);transition:background-color var(--motion-duration-normal) var(--motion-easing-standard),color var(--motion-duration-normal) var(--motion-easing-standard);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;min-height:100vh}button,input,textarea,select{font:inherit}a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}.focusable:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:var(--border-width-thick) solid var(--sys-color-interactive-primary);outline-offset:2px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.gimdik-container{max-width:var(--layout-container-max);margin-left:auto;margin-right:auto;padding-left:var(--layout-padding-mobile);padding-right:var(--layout-padding-mobile);width:100%}@media (min-width: 640px){.gimdik-container{padding-left:var(--layout-padding-tablet);padding-right:var(--layout-padding-tablet)}}@media (min-width: 1024px){.gimdik-container{padding-left:var(--layout-padding-desktop);padding-right:var(--layout-padding-desktop)}}.grid-system{display:grid;gap:var(--spacing-md);grid-template-columns:repeat(4,1fr);width:100%}@media (min-width: 640px){.grid-system{gap:var(--spacing-md);grid-template-columns:repeat(8,1fr)}}@media (min-width: 1024px){.grid-system{gap:var(--layout-grid-gap);grid-template-columns:repeat(12,1fr)}}.col-span-1{grid-column:span 1}.col-span-2{grid-column:span 2}.col-span-3{grid-column:span 3}.col-span-4{grid-column:span 4}.col-span-5{grid-column:span 5}.col-span-6{grid-column:span 6}.col-span-7{grid-column:span 7}.col-span-8{grid-column:span 8}.col-span-9{grid-column:span 9}.col-span-10{grid-column:span 10}.col-span-11{grid-column:span 11}.col-span-12{grid-column:span 12}@media (max-width: 1023px) and (min-width: 640px){.col-span-3,.col-span-4{grid-column:span 4}.col-span-6,.col-span-8,.col-span-12{grid-column:span 8}}@media (max-width: 639px){.col-span-1,.col-span-2,.col-span-3,.col-span-4,.col-span-5,.col-span-6,.col-span-7,.col-span-8,.col-span-9,.col-span-10,.col-span-11,.col-span-12{grid-column:span 4}}.app-wrapper{display:flex;min-height:100vh;width:100%;background-color:var(--sys-color-bg-default)}.app-main-area{display:flex;flex-direction:column;min-height:100vh;margin-left:240px;width:calc(100% - 240px);transition:margin-left var(--motion-duration-normal) var(--motion-easing-standard),width var(--motion-duration-normal) var(--motion-easing-standard)}@media (min-width: 640px) and (max-width: 1023px){.app-main-area{margin-left:64px;width:calc(100% - 64px)}}@media (max-width: 639px){.app-main-area{margin-left:0;width:100%}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--sys-color-border-subtle);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--sys-color-text-muted)}@keyframes game-shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.animate-shake{animation:game-shake .4s var(--motion-easing-standard)}.memory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;width:100%;max-width:640px;margin:0 auto}@media (max-width: 639px){.memory-grid{grid-template-columns:repeat(3,1fr);gap:8px}}@media (max-width: 400px){.memory-grid{grid-template-columns:repeat(2,1fr);gap:8px}}.memory-card{aspect-ratio:4 / 3;width:100%;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);border:var(--border-width-thick) solid var(--sys-color-border-subtle);background:var(--sys-color-bg-surface);cursor:pointer;padding:8px;font-family:var(--font-educational);font-size:var(--fs-caption);font-weight:var(--fw-semibold);text-align:center;transition:all var(--motion-duration-fast) var(--motion-easing-standard);position:relative;overflow:hidden;-webkit-user-select:none;user-select:none;min-height:80px}.memory-card-closed{background:linear-gradient(135deg,var(--sys-color-interactive-primary) 0%,var(--sys-color-interactive-primary-hover) 100%);color:#fff;border-color:transparent;font-size:24px}.memory-card-closed:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.memory-card-flipped{border-color:var(--sys-color-interactive-primary);background:var(--sys-color-bg-default);color:var(--sys-color-text-primary)}.memory-card-matched{border-color:var(--sys-color-feedback-success);background:var(--sys-color-feedback-success-soft);color:var(--sys-color-feedback-success);cursor:default;box-shadow:none}.memory-card-mismatched{border-color:var(--sys-color-feedback-error);background:var(--sys-color-feedback-error-soft);color:var(--sys-color-feedback-error)}.wordguess-word-wrapper{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:24px 0;width:100%}.wordguess-char-box{width:36px;height:48px;border-bottom:3px solid var(--sys-color-border-subtle);display:flex;align-items:center;justify-content:center;font-size:var(--fs-h2);font-weight:var(--fw-bold);font-family:var(--font-code);text-transform:uppercase;color:var(--sys-color-text-primary);transition:all var(--motion-duration-fast) var(--motion-easing-standard)}.wordguess-char-box-space{width:16px;border-bottom:none}.wordguess-char-box-filled{border-bottom-color:var(--sys-color-interactive-primary)}.wordguess-keyboard{display:grid;grid-template-columns:repeat(9,1fr);gap:6px;width:100%;max-width:560px;margin:0 auto}@media (max-width: 639px){.wordguess-keyboard{grid-template-columns:repeat(7,1fr);gap:4px}}.wordguess-key{height:40px;display:flex;align-items:center;justify-content:center;font-weight:var(--fw-semibold);font-size:var(--fs-body);border-radius:var(--radius-sm);border:var(--border-width-thin) solid var(--sys-color-border-subtle);background:var(--sys-color-bg-surface);cursor:pointer;-webkit-user-select:none;user-select:none;transition:all var(--motion-duration-fast) var(--motion-easing-standard)}.wordguess-key:hover:not(:disabled){background:var(--sys-color-bg-default);border-color:var(--sys-color-text-muted)}.wordguess-key-correct{background:var(--sys-color-feedback-success-soft)!important;border-color:var(--sys-color-feedback-success)!important;color:var(--sys-color-feedback-success)!important}.wordguess-key-incorrect{background:var(--sys-color-feedback-error-soft)!important;border-color:var(--sys-color-feedback-error)!important;color:var(--sys-color-feedback-error)!important}