*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--color-primary:#4f46e5;--color-primary-hover:#4338ca;--color-primary-dark:#3730a3;--color-primary-light:#818cf8;--color-bg:#fff;--color-bg-alt:#f9fafb;--color-bg-elevated:#fff;--color-text:#111827;--color-text-secondary:#6b7280;--color-text-inverse:#fff;--color-border:#d1d5db;--color-border-light:#e5e7eb;--color-error:#ef4444;--color-success:#22c55e;--color-warning:#f59e0b;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--min-touch-target:44px;--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", "Consolas", monospace;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px -1px #0000001a;font-family:var(--font-sans);color:var(--color-text);background-color:var(--color-bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}body{min-width:320px;min-height:100vh;margin:0}#root{width:100%}button{font-family:inherit;font-size:inherit;cursor:pointer;background:0 0;border:none}button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}input[type=number]{font-family:inherit;font-size:inherit}input[type=number]:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.cage-configurator{gap:var(--spacing-lg);flex-wrap:wrap;display:flex}.cage-configurator__field{gap:var(--spacing-sm);flex-direction:column;display:flex}.cage-configurator__label{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.875rem;font-weight:600}.cage-configurator__input{min-width:80px;max-width:120px;min-height:var(--min-touch-target);padding:var(--spacing-sm) var(--spacing-md);border:2px solid var(--color-border);border-radius:var(--radius-md);text-align:center;color:var(--color-text);background:var(--color-bg);font-size:1.125rem;font-weight:600;transition:border-color .15s}.cage-configurator__input:focus{border-color:var(--color-primary);outline:none}.cage-configurator__operators{gap:var(--spacing-xs);display:flex}.cage-configurator__op-button{min-width:var(--min-touch-target);min-height:var(--min-touch-target);padding:var(--spacing-sm);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);color:var(--color-text);font-size:1.25rem;font-weight:600;transition:all .15s}.cage-configurator__op-button:hover{border-color:var(--color-primary-light);background:var(--color-bg-alt)}.cage-configurator__op-button--active{border-color:var(--color-primary);background:var(--color-primary);color:var(--color-text-inverse)}.cage-configurator__op-button--active:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.grid-size-selector{gap:var(--spacing-sm);flex-direction:column;display:flex}.grid-size-selector__label{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.875rem;font-weight:600}.grid-size-selector__buttons{gap:var(--spacing-xs);flex-wrap:wrap;display:flex}.grid-size-selector__button{min-width:var(--min-touch-target);min-height:var(--min-touch-target);padding:var(--spacing-sm) var(--spacing-md);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);color:var(--color-text);font-weight:500;transition:all .15s}.grid-size-selector__button:hover{border-color:var(--color-primary-light);background:var(--color-bg-alt)}.grid-size-selector__button--active{border-color:var(--color-primary);background:var(--color-primary);color:var(--color-text-inverse)}.grid-size-selector__button--active:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.results-panel{gap:var(--spacing-md);flex-direction:column;display:flex}.results-panel__empty,.results-panel__computing,.results-panel__none{color:var(--color-text-secondary);text-align:center;padding:var(--spacing-lg);font-size:.9375rem}.results-panel__summary{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-alt);border-radius:var(--radius-md);justify-content:space-between;align-items:center;display:flex}.results-panel__count{font-size:.9375rem;font-weight:600}.results-panel__time{color:var(--color-text-secondary);font-size:.8125rem;font-family:var(--font-mono)}.cell-summary{gap:var(--spacing-sm);flex-direction:column;display:flex}.cell-summary__title{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin:0;font-size:.8125rem;font-weight:600}.cell-summary__grid{gap:var(--spacing-sm);flex-wrap:wrap;display:flex}.cell-summary__cell{align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-bg-alt);border-radius:var(--radius-sm);font-size:.875rem;display:flex}.cell-summary__cell-label{background:var(--color-primary);width:22px;height:22px;color:var(--color-text-inverse);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:700;display:inline-flex}.cell-summary__cell-values{font-family:var(--font-mono);font-size:.8125rem}.combination-list{gap:var(--spacing-md);flex-direction:column;display:flex}.combination-list__group-title{color:var(--color-text);margin:0;font-size:.9375rem;font-weight:600}.combination-list__items{gap:var(--spacing-xs);flex-wrap:wrap;display:flex}.combination-card{padding:var(--spacing-xs);background:var(--color-bg-alt);border-radius:var(--radius-sm);border:1px solid var(--color-border-light);gap:2px;display:inline-flex}.combination-card__value{border-radius:var(--radius-sm);background:var(--color-bg);width:28px;height:28px;font-family:var(--font-mono);justify-content:center;align-items:center;font-size:.875rem;font-weight:600;display:inline-flex}.shape-drawer{gap:var(--spacing-sm);flex-direction:column;display:flex}.shape-drawer__header{justify-content:space-between;align-items:center;display:flex}.shape-drawer__label{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.875rem;font-weight:600}.shape-drawer__clear-btn{padding:var(--spacing-xs) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text-secondary);font-size:.8125rem;transition:all .15s}.shape-drawer__clear-btn:hover{border-color:var(--color-error);color:var(--color-error)}.shape-drawer__grid{grid-template-columns:repeat(var(--grid-cols), 1fr);aspect-ratio:1;touch-action:none;-webkit-user-select:none;user-select:none;gap:2px;max-width:320px;display:grid}.shape-drawer__cell{aspect-ratio:1;min-width:var(--min-touch-target);min-height:var(--min-touch-target);border:2px solid var(--color-border-light);border-radius:var(--radius-sm);background:var(--color-bg-alt);color:var(--color-text);justify-content:center;align-items:center;font-size:1rem;font-weight:700;transition:background-color .1s;display:flex}.shape-drawer__cell:hover{background:var(--color-border-light)}.shape-drawer__cell--selected{background:var(--color-primary);color:var(--color-text-inverse);border-color:#0000}.shape-drawer__cell--selected:hover{background:var(--color-primary-hover)}.shape-drawer__cell--selected.border-top{border-top:3px solid var(--color-primary-dark)}.shape-drawer__cell--selected.border-bottom{border-bottom:3px solid var(--color-primary-dark)}.shape-drawer__cell--selected.border-left{border-left:3px solid var(--color-primary-dark)}.shape-drawer__cell--selected.border-right{border-right:3px solid var(--color-primary-dark)}.shape-drawer__info{min-height:1.5em;font-size:.875rem}.shape-drawer__hint{color:var(--color-text-secondary)}.shape-drawer__warning{color:var(--color-error);font-weight:500}.shape-drawer__status{color:var(--color-text-secondary)}.app{max-width:640px;padding:var(--spacing-md) var(--spacing-md) var(--spacing-xl);margin:0 auto}.app__header{margin-bottom:var(--spacing-lg)}.app__title{color:var(--color-text);margin:0;font-size:1.5rem;font-weight:700}.app__subtitle{color:var(--color-text-secondary);margin:var(--spacing-xs) 0 0;font-size:.9375rem}.app__main,.app__config{gap:var(--spacing-lg);flex-direction:column;display:flex}.app__results{border-top:1px solid var(--color-border-light);padding-top:var(--spacing-lg)}@media (width>=480px){.app{padding:var(--spacing-lg) var(--spacing-lg) var(--spacing-xl)}.app__title{font-size:1.75rem}}