@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--bg-primary: #ffffff;--bg-secondary: #f8fafc;--bg-tertiary: #f1f5f9;--text-primary: #0f172a;--text-secondary: #1e293b;--text-muted: #64748b;--text-light: #94a3b8;--neutral-50: #f8fafc;--neutral-100: #f1f5f9;--neutral-200: #e2e8f0;--neutral-300: #cbd5e1;--neutral-400: #94a3b8;--neutral-500: #64748b;--neutral-600: #475569;--neutral-700: #334155;--neutral-800: #1e293b;--neutral-900: #0f172a;--border-light: #e2e8f0;--border-medium: #cbd5e1;--border-dark: #94a3b8;--primary-50: #eff6ff;--primary-100: #dbeafe;--primary-200: #bfdbfe;--primary-300: #93c5fd;--primary-400: #60a5fa;--primary-500: #3b82f6;--primary-600: #2563eb;--primary-700: #1d4ed8;--primary-800: #1e40af;--primary-900: #1e3a8a;--success-50: #f0fdf4;--success-100: #dcfce7;--success-200: #bbf7d0;--success-300: #86efac;--success-400: #4ade80;--success-500: #22c55e;--success-600: #16a34a;--success-700: #15803d;--info-50: #eff6ff;--info-100: #dbeafe;--info-200: #bfdbfe;--info-300: #93c5fd;--info-400: #60a5fa;--info-500: #3b82f6;--info-600: #2563eb;--info-700: #1d4ed8;--warning-50: #fffbeb;--warning-100: #fef3c7;--warning-200: #fde68a;--warning-300: #fcd34d;--warning-400: #fbbf24;--warning-500: #f59e0b;--warning-600: #d97706;--warning-700: #b45309;--error-50: #fef2f2;--error-100: #fee2e2;--error-200: #fecaca;--error-300: #fca5a5;--error-400: #f87171;--error-500: #ef4444;--error-600: #dc2626;--error-700: #b91c1c;--error-800: #991b1b;--error-900: #7f1d1d;--move-image-bg: transparent;--move-image-padding: 0;--move-image-border-color: var(--border-light);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-base: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--selection-bg: #dbeafe;--selection-text: #1e40af;--scrollbar-track: #f1f5f9;--scrollbar-thumb: #cbd5e1;--scrollbar-thumb-hover: #94a3b8}[data-theme=dark]{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-tertiary: #334155;--text-primary: #f1f5f9;--text-secondary: #e2e8f0;--text-muted: #94a3b8;--text-light: #64748b;--neutral-50: #0f172a;--neutral-100: #1e293b;--neutral-200: #334155;--neutral-300: #475569;--neutral-400: #64748b;--neutral-500: #94a3b8;--neutral-600: #cbd5e1;--neutral-700: #e2e8f0;--neutral-800: #f1f5f9;--neutral-900: #f8fafc;--border-light: #334155;--border-medium: #475569;--border-dark: #64748b;--primary-50: #1e3a8a;--primary-100: #1e40af;--primary-200: #1d4ed8;--primary-300: #2563eb;--primary-400: #3b82f6;--primary-500: #60a5fa;--primary-600: #93c5fd;--primary-700: #bfdbfe;--primary-800: #dbeafe;--primary-900: #eff6ff;--success-50: #14532d;--success-100: #166534;--success-200: #15803d;--success-300: #16a34a;--success-400: #22c55e;--success-500: #4ade80;--success-600: #86efac;--success-700: #bbf7d0;--info-50: #1e3a8a;--info-100: #1e40af;--info-200: #1d4ed8;--info-300: #2563eb;--info-400: #3b82f6;--info-500: #60a5fa;--info-600: #93c5fd;--info-700: #bfdbfe;--warning-50: #78350f;--warning-100: #92400e;--warning-200: #b45309;--warning-300: #d97706;--warning-400: #f59e0b;--warning-500: #fbbf24;--warning-600: #fcd34d;--warning-700: #fde68a;--error-50: #7f1d1d;--error-100: #991b1b;--error-200: #b91c1c;--error-300: #dc2626;--error-400: #ef4444;--error-500: #f87171;--error-600: #fca5a5;--error-700: #fecaca;--error-800: #fee2e2;--error-900: #fef2f2;--move-image-bg: rgba(255, 255, 255, .9);--move-image-padding: 4px;--move-image-border-color: rgba(255, 255, 255, .2);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-base: 0 1px 3px 0 rgba(0, 0, 0, .4), 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .4), 0 4px 6px -2px rgba(0, 0, 0, .3);--selection-bg: #1e40af;--selection-text: #dbeafe;--scrollbar-track: #1e293b;--scrollbar-thumb: #475569;--scrollbar-thumb-hover: #64748b}*{box-sizing:border-box}html{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;background-color:var(--bg-secondary);color:var(--text-secondary);font-size:16px;line-height:1.6}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--scrollbar-track);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}*:focus{outline:2px solid var(--primary-500);outline-offset:2px}button:focus{outline:2px solid var(--primary-500);outline-offset:2px}input:focus,select:focus{outline:2px solid var(--primary-500);outline-offset:2px}*{transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease}::selection{background-color:var(--selection-bg);color:var(--selection-text)}img{max-width:100%;height:auto}@media screen and (min-width: 768px) and (max-width: 1024px){.responsive-container{width:90%!important;max-width:800px!important}.responsive-flex{gap:1.5rem!important}.responsive-button-group{gap:.75rem!important}button,input[type=button],input[type=submit],input[type=reset],select,a{min-height:48px;min-width:48px}}button,input[type=button],input[type=submit],input[type=reset],select,a{min-height:44px;min-width:44px}input,select,textarea{font-size:16px}@media screen and (max-width: 768px){html,body{font-size:14px}}@media screen and (max-width: 480px){html,body{font-size:13px}}@media screen and (max-width: 768px){.mobile-padding{padding:1rem!important}.mobile-margin{margin:1rem!important}}@media screen and (max-width: 480px){.mobile-padding{padding:.75rem!important}.mobile-margin{margin:.75rem!important}}@media screen and (max-width: 768px){.responsive-container{width:95%!important;max-width:none!important}}@media screen and (max-width: 480px){.responsive-container{width:98%!important;padding:0 .5rem!important}}@media screen and (max-width: 768px){.responsive-flex{flex-direction:column!important;gap:1rem!important}.responsive-flex>*{flex:1 1 auto!important;min-width:auto!important}}@media screen and (max-width: 768px){.responsive-grid{grid-template-columns:1fr!important;gap:1rem!important}}@media screen and (max-width: 480px){.mobile-text-center{text-align:center!important}.mobile-text-left{text-align:left!important}}@media screen and (max-width: 768px){.responsive-button-group{flex-direction:column!important;gap:.5rem!important}.responsive-button-group>*{width:100%!important}}@media screen and (max-width: 768px){.responsive-form{display:flex!important;flex-direction:column!important;gap:1rem!important}.responsive-form input,.responsive-form select,.responsive-form textarea{width:100%!important;font-size:16px!important}}@media screen and (max-width: 768px){.responsive-image{max-width:100%!important;height:auto!important}.responsive-image-container{display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important}}@media screen and (max-width: 768px){.responsive-nav{flex-direction:column!important;gap:.5rem!important}.responsive-nav>*{width:100%!important;text-align:center!important}}.horizontal-layout{display:grid;grid-template-columns:200px 1fr 200px;gap:1rem;align-items:start;margin-bottom:2rem}.horizontal-layout>*:nth-child(2){justify-self:center;max-width:500px;width:100%}.vertical-layout{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.pattern-display{display:flex;flex-direction:column;gap:.5rem;align-items:center;justify-content:center;min-height:200px;width:200px;flex-shrink:0;justify-self:center;align-self:center;text-align:center;background-color:var(--bg-secondary);border-radius:12px;padding:1rem;box-shadow:0 4px 6px #0000001a;border:1px solid var(--border-light)}.pattern-label{font-size:.875rem;font-weight:600;color:#475569;text-align:center;margin-bottom:0;letter-spacing:.025em}.pattern-image{max-width:200px;height:auto;border-radius:8px;box-shadow:0 4px 6px #0000001a;border:1px solid var(--move-image-border-color);background:var(--move-image-bg);padding:var(--move-image-padding);display:block}.responsive-pattern-image{background:var(--move-image-bg);padding:var(--move-image-padding);border:1px solid var(--move-image-border-color)}.move-image{background:var(--move-image-bg);padding:var(--move-image-padding);flex-shrink:0;position:relative;z-index:1}.pattern-container-mobile{display:flex;justify-content:center;align-items:center;gap:1rem;margin:1.5rem 0;flex-wrap:wrap}.pattern-container-mobile .pattern-display{width:150px;min-height:auto;flex:none;padding:1rem}.pattern-container-mobile .pattern-image{max-width:150px;width:150px;height:auto}@media (max-width: 768px){.pattern-image{max-width:150px}.pattern-label{font-size:.8rem}.horizontal-layout{grid-template-columns:1fr;gap:1rem}.vertical-layout .pattern-display{width:150px;margin:0 auto}.vertical-layout .pattern-image{max-width:150px;width:150px}}@media (max-width: 1024px){.move-image{max-width:48px;max-height:48px;width:48px;height:48px;flex-shrink:0}}@media (max-width: 480px){.move-image{max-width:44px;max-height:44px;width:44px;height:44px;flex-shrink:0}}@media (max-width: 380px){.move-image{max-width:40px;max-height:40px;width:40px;height:40px;flex-shrink:0}}.responsive-cube-grid{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:flex-start;width:100%;box-sizing:border-box;position:relative}@media (max-width: 1024px){.responsive-cube-grid{justify-content:center;gap:8px;padding:0 8px;flex-wrap:wrap;align-items:flex-start}.responsive-cube-grid>div:not(.trigger-box){flex:0 0 auto;min-width:fit-content;max-width:fit-content;margin:0;padding:0;position:relative;z-index:1}.responsive-cube-grid .trigger-box{flex:0 0 auto;min-width:fit-content;max-width:100%;box-sizing:border-box;margin:0;padding:0;position:relative;z-index:2}.responsive-cube-grid .trigger-box>div:last-child{display:flex;gap:8px;flex-wrap:nowrap;justify-content:center;width:fit-content;max-width:100%;overflow:visible;margin:0;padding:0}.responsive-cube-grid .trigger-box>div:last-child>div{flex:0 0 auto;min-width:fit-content;margin:0;padding:0;position:relative;z-index:3}}@media (max-width: 480px){.responsive-cube-grid{gap:6px;padding:0 6px}.responsive-cube-grid .trigger-box>div:last-child{gap:6px}}@media (max-width: 380px){.responsive-cube-grid{gap:4px;padding:0 4px}.responsive-cube-grid .trigger-box>div:last-child{gap:4px}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){.responsive-cube-grid{gap:10px;padding:0 12px}}@media (min-width: 1025px) and (max-width: 1200px){.responsive-cube-grid{gap:10px;padding:0 12px}}@media (max-width: 1024px){.responsive-cube-grid>div{gap:4px!important;margin:0!important;padding:0!important;position:relative!important;z-index:1!important}.responsive-cube-grid>div:not(.trigger-box)>div:first-child{width:20px!important;height:20px!important;font-size:.6rem!important;flex-shrink:0!important}.responsive-cube-grid>div:not(.trigger-box)>div:last-child{font-size:.75rem!important;line-height:1.2!important;max-width:50px!important;flex-shrink:0!important}.responsive-cube-grid .move-image{margin:0!important;padding:0!important;flex-shrink:0!important}}@media (max-width: 380px){.responsive-cube-grid>div:not(.trigger-box)>div:first-child{width:18px!important;height:18px!important;font-size:.55rem!important}.responsive-cube-grid>div:not(.trigger-box)>div:last-child{font-size:.7rem!important;max-width:45px!important}}@media (max-width: 480px){.pattern-image{max-width:120px}.pattern-label{font-size:.75rem}.pattern-container-mobile{gap:.5rem}.pattern-container-mobile .pattern-display{width:120px;padding:.75rem}.pattern-container-mobile .pattern-image{max-width:120px;width:120px}.pattern-container-mobile .pattern-label{font-size:.7rem;margin-bottom:0}.vertical-layout .pattern-display{width:120px}.vertical-layout .pattern-image{max-width:120px;width:120px}}@media print{body{background:#fff}.no-print{display:none!important}}