:root{--color-bg:var(--lightningcss-light,#fff)var(--lightningcss-dark,#0f0f1a);--color-bg-secondary:var(--lightningcss-light,#f8f9fa)var(--lightningcss-dark,#1a1a2e);--color-bg-tertiary:var(--lightningcss-light,#e9ecef)var(--lightningcss-dark,#252540);--color-surface:var(--lightningcss-light,#fff)var(--lightningcss-dark,#1a1a2e);--color-text:var(--lightningcss-light,#1a1a2e)var(--lightningcss-dark,#e2e8f0);--color-text-secondary:var(--lightningcss-light,#495057)var(--lightningcss-dark,#a0aec0);--color-text-muted:var(--lightningcss-light,#868e96)var(--lightningcss-dark,#718096);--color-primary:var(--lightningcss-light,#6366f1)var(--lightningcss-dark,#818cf8);--color-primary-hover:var(--lightningcss-light,#4f46e5)var(--lightningcss-dark,#6366f1);--color-primary-light:var(--lightningcss-light,#eef2ff)var(--lightningcss-dark,#1e1b4b);--color-accent:#06b6d4;--color-border:var(--lightningcss-light,#dee2e6)var(--lightningcss-dark,#2d2d44);--color-border-light:var(--lightningcss-light,#e9ecef)var(--lightningcss-dark,#252540);--color-error:var(--lightningcss-light,#e53e3e)var(--lightningcss-dark,#fc8181);--color-success:var(--lightningcss-light,#38a169)var(--lightningcss-dark,#68d391);--color-text-inverse:#fff;--color-text-strong:var(--lightningcss-light,#333)var(--lightningcss-dark,#1a202c);--color-shadow:var(--lightningcss-light,#00000014)var(--lightningcss-dark,#0000004d);--color-shadow-lg:var(--lightningcss-light,#0000001f)var(--lightningcss-dark,#00000080);--color-hero-from:#6366f1;--color-hero-via:#8b5cf6;--color-hero-to:#06b6d4;--color-code-bg:var(--lightningcss-light,#f1f3f5)var(--lightningcss-dark,#252540);--midi-key-label:#4b5563;--midi-key-white-border:color-mix(in srgb, var(--color-border) 85%, #93a4bf 15%);--midi-key-white-bg:#f4f7fb;--midi-key-black-border:#ffffff14;--midi-key-black-bg:#141924;--midi-key-white-active:#60a5fa;--midi-key-black-active:#2563eb;--midi-key-white-correct:#34d399;--midi-key-black-correct:#059669;--museum-bg:radial-gradient(circle at top, var(--lightningcss-light,#ffffffeb)var(--lightningcss-dark,#1e1e32e6), transparent 42%), linear-gradient(180deg, var(--lightningcss-light,#f7fbff)var(--lightningcss-dark,#0f0f1a) 0%, var(--lightningcss-light,#e6eef5)var(--lightningcss-dark,#1a1a2e) 100%);--museum-overlay-bg:linear-gradient(180deg, var(--lightningcss-light,#e7eef54d)var(--lightningcss-dark,#0f0f1a66), var(--lightningcss-light,#48566580)var(--lightningcss-dark,#0a0a1499)), var(--lightningcss-light,#0d152038)var(--lightningcss-dark,#0000004d);--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4rem;--space-4xl:6rem;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3rem;--line-height-tight:1.1;--line-height-normal:1.5;--line-height-relaxed:1.75;--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-xl:1rem;--radius-full:9999px;--shadow-sm:0 1px 2px var(--color-shadow);--shadow-md:0 4px 6px var(--color-shadow), 0 1px 3px var(--color-shadow);--shadow-lg:0 10px 25px var(--color-shadow-lg), 0 4px 10px var(--color-shadow);--shadow-xl:0 20px 40px var(--color-shadow-lg), 0 8px 16px var(--color-shadow);--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.35s ease;--header-height:4rem;--max-width:1200px;--max-width-narrow:800px;--soko-board-max-width:800px;--control-height:2.25rem;--type-normal:#a8a878;--type-fire:#f08030;--type-water:#6890f0;--type-electric:#f8d030;--type-grass:#78c850;--type-ice:#98d8d8;--type-fighting:#c03028;--type-poison:#a040a0;--type-ground:#e0c068;--type-flying:#a890f0;--type-psychic:#f85888;--type-bug:#a8b820;--type-rock:#b8a038;--type-ghost:#705898;--type-dragon:#7038f8;--type-dark:#705848;--type-steel:#b8b8d0;--type-fairy:#ee99ac;--stat-high:#4caf50;--stat-mid:#ff9800;--stat-low:#f44336;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--select-arrow-light:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23495057' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");--select-arrow-dark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a0aec0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");--select-arrow:var(--select-arrow-light)}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--select-arrow:var(--select-arrow-dark)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--select-arrow:var(--select-arrow-dark)}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + var(--space-lg))}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}img,svg{max-width:100%;display:block}a{color:var(--color-primary);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-primary-hover)}ul,ol{list-style:none}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none}input,select{font:inherit;color:inherit}select{appearance:base-select;background-image:var(--select-arrow);background-position:right .75rem center;background-repeat:no-repeat;background-size:1rem}select:open{border-color:var(--color-primary)}select::picker-icon{display:none}select::picker(select){appearance:base-select;border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-lg);scrollbar-width:thin;scrollbar-color:var(--color-border) transparent;max-height:320px;margin-top:.35rem;padding:.35rem;overflow-y:auto}select::picker(select)::-webkit-scrollbar{width:8px}select::picker(select)::-webkit-scrollbar-track{background:0 0}select::picker(select)::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:var(--radius-md)}select::picker(select)::-webkit-scrollbar-thumb:hover{background-color:var(--color-text-muted)}select option{border-radius:var(--radius-sm);cursor:pointer;padding:.5rem .75rem}select option:hover,select option:focus{background:var(--color-primary-light);color:var(--color-primary)}select option:checked{background:var(--color-primary-light);color:var(--color-primary);font-weight:600}select option::checkmark{display:none}.midi-piano{margin-bottom:var(--space-2xl);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.midi-monitor__actions{justify-content:flex-end;align-items:center;gap:var(--space-md);flex-wrap:wrap;flex-shrink:0;display:flex}.midi-monitor__error{color:var(--color-error);margin-bottom:var(--space-lg)}.midi-status{vertical-align:middle;opacity:.92;width:1.95rem;height:1.95rem;transition:opacity var(--transition-fast), transform var(--transition-fast), color var(--transition-fast);justify-content:center;align-items:center;display:inline-flex}.midi-status svg{width:1.55rem;height:1.55rem;overflow:visible}.midi-status--pending{color:var(--color-text-secondary)}.midi-status--connected{color:var(--color-success)}.midi-status--denied,.midi-status--unsupported{color:var(--color-error)}.midi-piano__header{justify-content:space-between;align-items:center;gap:var(--space-md);padding:var(--space-lg) var(--space-lg) 0;margin-bottom:var(--space-lg);display:flex}.midi-piano__title{font-size:var(--text-xl)}.midi-piano__subtitle{color:var(--color-text-secondary);font-size:var(--text-sm)}.midi-piano__last-note{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-secondary);padding:var(--space-xs) var(--space-sm);background:var(--color-bg-secondary);border-radius:var(--radius-sm);flex-shrink:0;font-weight:600}.midi-piano__scroller{border-radius:0 0 var(--radius-md) var(--radius-md);width:100%;position:relative;overflow:hidden}.midi-piano__keyboard{--midi-white-key-width:32px;--midi-white-key-height:176px;--midi-black-key-width:19px;--midi-black-key-height:106px;width:calc(36 * var(--midi-white-key-width));transform-origin:0 0;position:absolute;inset:0 auto auto 0}.midi-piano__white-keys{grid-template-columns:repeat(36, var(--midi-white-key-width));display:grid}.midi-piano__black-keys{pointer-events:none;width:100%;position:absolute;inset:0 auto auto 0}.midi-key{min-width:0;transition:transform var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);position:relative}.midi-key__label{letter-spacing:.03em;color:var(--midi-key-label);white-space:nowrap;pointer-events:none;font-size:.68rem;position:absolute;bottom:.75rem;left:50%;transform:translate(-50%)}.midi-key--white{height:var(--midi-white-key-height);border:1px solid var(--midi-key-white-border);background:var(--midi-key-white-bg);border-radius:0}.midi-piano__white-keys>.midi-key--white:first-child{border-bottom-left-radius:var(--radius-md)}.midi-piano__white-keys>.midi-key--white:last-child{border-bottom-right-radius:var(--radius-md)}.midi-key--black{width:var(--midi-black-key-width);height:var(--midi-black-key-height);border:1px solid var(--midi-key-black-border);background:var(--midi-key-black-bg);z-index:2;border-radius:0 0 .3rem .3rem;position:absolute;top:0}.midi-key--active{transform:none}.midi-key--white.midi-key--active{background:var(--midi-key-white-active);border-color:var(--midi-key-white-active)}.midi-key--black.midi-key--active{background:var(--midi-key-black-active);border-color:var(--midi-key-black-active)}.midi-key--white.midi-key--correct{background:var(--midi-key-white-correct);border-color:var(--midi-key-white-correct)}.midi-key--black.midi-key--correct{background:var(--midi-key-black-correct);border-color:var(--midi-key-black-correct)}.midi-player{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md) var(--radius-md) 0 0;flex-wrap:wrap;display:flex}.midi-player__name{font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap;max-width:180px;font-weight:600;overflow:hidden}.midi-player__btn{padding:var(--space-xs);font-size:var(--text-sm);border-radius:var(--radius-md);cursor:pointer;color:var(--color-text-secondary);transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;font-weight:600}.midi-player__btn:hover{background:var(--color-bg-tertiary);color:var(--color-text)}.midi-player__btn--icon{padding:var(--space-xs);justify-content:center;align-items:center;line-height:0;display:inline-flex}.midi-player__btn--close{margin-left:auto}.midi-player__source-toggle--active{color:var(--color-primary);background:var(--color-bg-tertiary)}.midi-player__seek{cursor:pointer;appearance:none;border-radius:3px;flex:1;min-width:100px;height:6px}.midi-player__seek::-webkit-slider-thumb{appearance:none;background:var(--color-text);cursor:pointer;border-radius:50%;width:14px;height:14px}.midi-player__seek::-moz-range-thumb{background:var(--color-text);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}.midi-player__seek::-moz-range-track{background:0 0;border-radius:3px;height:6px}.midi-player__time{font-size:var(--text-xs);font-family:var(--font-mono);color:var(--color-text-secondary);min-width:36px}.midi-player__speed{padding:var(--space-xs) 1.5rem var(--space-xs) var(--space-xs);font-size:var(--text-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-surface);cursor:pointer;background-position:right .4rem center;background-size:.75rem}.midi-player__score{font-size:var(--text-sm);font-family:var(--font-mono);color:var(--color-text-secondary);white-space:nowrap}.midi-player__learning{color:#6b7280;transition:color var(--transition-fast), opacity var(--transition-fast)}.midi-player__learning--active{color:var(--midi-key-white-correct)}.midi-player__learning--waiting{color:var(--midi-key-white-correct);animation:1.5s ease-in-out infinite learning-pulse}@keyframes learning-pulse{0%,to{opacity:1}50%{opacity:.4}}.midi-waterfall{background:var(--color-bg-secondary);border:2px solid var(--color-border);border-top:none;border-radius:0;flex:1;min-height:200px;position:relative;overflow:hidden}.midi-waterfall__canvas{width:100%;height:100%;display:block}@media (width<=768px){.midi-piano__header{padding:var(--space-md) var(--space-md) 0;flex-direction:column;align-items:flex-start}.midi-monitor__actions{justify-content:flex-start}.midi-key:after{display:none}}.skip-link{top:-100%;left:var(--space-md);padding:var(--space-sm) var(--space-md);background:var(--color-primary);color:var(--color-text-inverse);border-radius:var(--radius-md);z-index:1000;font-weight:600;position:absolute}.skip-link:focus{top:var(--space-sm);color:var(--color-text-inverse)}.header{z-index:100;height:var(--header-height);background:var(--color-bg);border-bottom:1px solid var(--color-border);align-items:center;display:flex;position:sticky;top:0}.header__inner{width:100%;max-width:var(--max-width);padding:0 var(--space-lg);justify-content:space-between;align-items:center;margin:0 auto;display:flex}.header__logo{font-size:var(--text-lg);color:var(--color-text);letter-spacing:-.02em;font-weight:700}.header__logo:hover{color:var(--color-primary)}.header__nav{align-items:center;gap:var(--space-lg);display:flex}.nav-link{color:var(--color-text-secondary);font-weight:500;font-size:var(--text-sm);padding:var(--space-xs) 0;transition:color var(--transition-fast);position:relative}.nav-link:hover{color:var(--color-text)}.nav-link:after{content:"";background:var(--color-primary);border-radius:var(--radius-full);width:0;height:2px;transition:width var(--transition-base);position:absolute;bottom:-2px;left:0}.nav-link:hover:after,.nav-link[data-status=active]:after{width:100%}.nav-link[data-status=active]{color:var(--color-primary)}.main{min-height:calc(100vh - var(--header-height))}.footer{border-top:1px solid var(--color-border);padding:var(--space-2xl) var(--space-lg);text-align:center;color:var(--color-text-muted);font-size:var(--text-sm)}.footer__links{justify-content:center;gap:var(--space-lg);margin-bottom:var(--space-md);display:flex}.footer__link{color:var(--color-text-secondary);transition:color var(--transition-fast)}.footer__link:hover{color:var(--color-primary)}.theme-toggle{width:var(--control-height);height:var(--control-height);border-radius:var(--radius-md);background:var(--color-bg-tertiary);color:var(--color-text-secondary);transition:background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);justify-content:center;align-items:center;line-height:0;display:flex}.theme-toggle:hover{background:var(--color-border);color:var(--color-text);transform:scale(1.05)}.section{padding:var(--space-2xl) var(--space-lg) var(--space-4xl)}.container{max-width:var(--max-width);margin:0 auto}.container--narrow{max-width:var(--max-width-narrow)}.section__title{font-size:var(--text-3xl);letter-spacing:-.02em;margin-bottom:var(--space-sm);font-weight:700}.section__subtitle{color:var(--color-text-secondary);font-size:var(--text-lg);margin-bottom:var(--space-md)}.phebo-hero,.soko-hero{justify-content:space-between;align-items:flex-end;gap:var(--space-lg);margin-bottom:var(--space-md);flex-wrap:wrap;display:flex}.phebo-hero__heading,.soko-hero__heading{min-width:0}.phebo-hero__heading .section__subtitle,.soko-hero__heading .section__subtitle{margin-bottom:0}.hero{min-height:calc(100vh - var(--header-height));text-align:center;padding:var(--space-3xl) var(--space-lg);background:linear-gradient(135deg, var(--color-hero-from), var(--color-hero-via), var(--color-hero-to));background-size:300% 300%;justify-content:center;align-items:center;animation:8s infinite gradient-shift;display:flex;position:relative;overflow:hidden}.hero:before{content:"";background:var(--color-bg);opacity:.85;position:absolute;inset:0}.hero__content{z-index:1;max-width:700px;position:relative}.hero__greeting{font-size:var(--text-lg);color:var(--color-primary);margin-bottom:var(--space-sm);font-weight:600}.hero__name{font-size:var(--text-5xl);letter-spacing:-.03em;font-weight:800;line-height:var(--line-height-tight);margin-bottom:var(--space-md)}.hero__role{font-size:var(--text-2xl);color:var(--color-text-secondary);font-family:var(--font-mono);white-space:nowrap;border-right:3px solid var(--color-primary);width:0;animation:3s steps(33,end) .5s forwards typing,.75s step-end infinite blink-caret;display:inline-block;overflow:hidden}.hero__description{font-size:var(--text-lg);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-top:var(--space-lg);margin-bottom:var(--space-xl)}.hero__actions{gap:var(--space-md);flex-wrap:wrap;justify-content:center;display:flex}.hero__scroll-hint{bottom:var(--space-2xl);text-decoration:none;position:absolute;left:50%;translate:-50%}.hero__scroll-arrow{border-bottom:2px solid var(--color-text-secondary);border-right:2px solid var(--color-text-secondary);width:20px;height:20px;animation:2s ease-in-out infinite scroll-bounce;display:block;rotate:45deg}@keyframes scroll-bounce{0%,to{opacity:.4;translate:0}50%{opacity:1;translate:0 6px}}.btn{align-items:center;gap:var(--space-sm);font-weight:600;font-size:var(--text-sm);border-radius:var(--radius-md);transition:background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);padding:.75rem 1.5rem;display:inline-flex}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.btn--primary{background:var(--color-primary);color:var(--color-text-inverse)}.btn--primary:hover:not(:disabled){background:var(--color-primary-hover);color:var(--color-text-inverse);box-shadow:var(--shadow-md)}.btn--outline{border:2px solid var(--color-border);color:var(--color-text)}.btn--outline:hover:not(:disabled){border-color:var(--color-primary);color:var(--color-primary);background:var(--color-primary-light)}.btn--active{box-shadow:0 0 0 2px var(--color-primary)}.btn--small{font-size:var(--text-xs);padding:.5rem 1rem}.btn--icon{width:var(--control-height);height:var(--control-height);border:2px solid var(--color-border);background:var(--color-surface);box-shadow:var(--shadow-md);justify-content:center;padding:0}.btn--icon:hover:not(:disabled){border-color:var(--color-primary);color:var(--color-primary)}.btn--icon.btn--primary{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}.btn--icon.btn--primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover);color:var(--color-text-inverse)}.btn--icon.btn--danger:hover:not(:disabled){border-color:var(--color-error);color:var(--color-error)}.btn--icon.btn--active{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary)}.input{height:var(--control-height);padding:0 var(--space-sm);border:2px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-surface);color:var(--color-text);font-size:var(--text-sm);transition:border-color var(--transition-fast)}.input:focus-visible{border-color:var(--color-primary);outline:none}.input::placeholder{color:var(--color-text-muted)}select.input{cursor:pointer;align-items:center;padding-right:2.25rem;display:flex}.control-panel{gap:var(--space-md);padding:var(--space-md);background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);flex-direction:column;display:flex}.canvas-panel{border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);flex:480px;min-width:320px;min-height:44rem;overflow:hidden}.floating-panel{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md)}.themed-scrollbar{scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}.themed-scrollbar::-webkit-scrollbar{width:8px;height:8px}.themed-scrollbar::-webkit-scrollbar-track{background:0 0}.themed-scrollbar::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:var(--radius-md)}.themed-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--color-text-muted)}.themed-scrollbar::-webkit-resizer{display:none}.control-panel__section{gap:var(--space-xs);padding-top:var(--space-sm);border-top:1px solid var(--color-border-light);flex-direction:column;display:flex}.control-panel__section:first-child{border-top:none;padding-top:0}.control-panel__section-title{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);font-weight:700}.card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);padding:var(--space-xl);transition:transform var(--transition-base), box-shadow var(--transition-base)}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.skill-card{text-align:center}.skill-card__icon{font-size:var(--text-4xl);margin-bottom:var(--space-md);display:block}.skill-card__title{font-size:var(--text-lg);margin-bottom:var(--space-sm);font-weight:700}.skill-card__description{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.project-card__tag{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-primary);margin-bottom:var(--space-sm);font-weight:600;display:inline-block}.project-card__title{font-size:var(--text-xl);margin-bottom:var(--space-sm);font-weight:700}.project-card__description{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-lg)}.project-card__tech{gap:var(--space-sm);margin-bottom:var(--space-lg);flex-wrap:wrap;display:flex}.tech-tag{font-size:var(--text-xs);background:var(--color-primary-light);color:var(--color-primary);border-radius:var(--radius-full);padding:.2rem .6rem;font-weight:500}.project-card__link{font-size:var(--text-sm);font-weight:600}.grid{gap:var(--space-lg);display:grid}.grid--skills{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.grid--projects{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}.grid--pokemon{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.github-section__heading{font-size:var(--text-2xl);letter-spacing:-.02em;margin-top:var(--space-2xl);margin-bottom:var(--space-lg);font-weight:700}.github-calendar-wrapper{justify-content:center;display:flex;overflow-x:auto}.github-page__grid{gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.github-page__grid--loading{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.github-page__skeleton{border:1px solid var(--color-border-light);border-radius:var(--radius-lg);background:linear-gradient(90deg, var(--color-bg-tertiary), var(--color-bg-secondary), var(--color-bg-tertiary));background-size:200% 100%;min-height:12rem;animation:1.5s ease-in-out infinite skeleton-pulse}.github-page__state{padding:var(--space-2xl);text-align:center;justify-items:center;gap:var(--space-md);border:1px dashed var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg-secondary);color:var(--color-text-secondary);display:grid}.github-page__state button{border-radius:var(--radius-md);background:var(--color-primary);color:var(--color-text-inverse);box-shadow:var(--shadow-sm);transition:transform var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast);justify-content:center;align-items:center;padding:.75rem 1rem;font-weight:600;display:inline-flex}.github-page__state button:hover{background:var(--color-primary-hover);color:var(--color-text-inverse);box-shadow:var(--shadow-md);transform:translateY(-1px)}.github-repo-card{gap:var(--space-md);padding:var(--space-lg);box-shadow:var(--shadow-sm);color:inherit;transition:transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);flex-direction:column;text-decoration:none;display:flex}.github-repo-card:hover{border-color:color-mix(in srgb, var(--color-primary) 28%, var(--color-border-light))}.github-repo-card__meta{gap:var(--space-sm);font-size:var(--text-xs);letter-spacing:.05em;text-transform:uppercase;color:var(--color-primary);flex-wrap:wrap;font-weight:700;display:flex}.github-repo-card__meta span{border-radius:var(--radius-full);background:var(--color-primary-light);padding:.25rem .6rem}.github-repo-card h3{font-size:var(--text-xl);letter-spacing:-.02em;font-weight:700;line-height:1.2}.github-repo-card p{color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.github-repo-card__footer{justify-content:space-between;align-items:center;gap:var(--space-sm) var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border-light);font-size:var(--text-sm);flex-wrap:wrap;margin-top:auto;display:flex}.github-repo-card__footer a{font-weight:600}.pokemon-card{padding:var(--space-lg);text-align:center;color:inherit;text-decoration:none;display:block}.pokemon-card:hover{color:inherit}.pokemon-card__id{font-size:var(--text-xs);color:var(--color-text-muted);font-family:var(--font-mono);margin-bottom:var(--space-xs)}.pokemon-card__sprite{width:96px;height:96px;margin:0 auto var(--space-sm);image-rendering:pixelated}.pokemon-card__name{font-size:var(--text-base);text-transform:capitalize;margin-bottom:var(--space-sm);font-weight:600}.pokemon-card__types{gap:var(--space-xs);justify-content:center;display:flex}.type-badge{border-radius:var(--radius-full);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-inverse);padding:.15rem .6rem;font-weight:600;display:inline-block}.type-badge--normal{background:var(--type-normal)}.type-badge--fire{background:var(--type-fire)}.type-badge--water{background:var(--type-water)}.type-badge--electric{background:var(--type-electric);color:var(--color-text-strong)}.type-badge--grass{background:var(--type-grass)}.type-badge--ice{background:var(--type-ice);color:var(--color-text-strong)}.type-badge--fighting{background:var(--type-fighting)}.type-badge--poison{background:var(--type-poison)}.type-badge--ground{background:var(--type-ground);color:var(--color-text-strong)}.type-badge--flying{background:var(--type-flying)}.type-badge--psychic{background:var(--type-psychic)}.type-badge--bug{background:var(--type-bug)}.type-badge--rock{background:var(--type-rock)}.type-badge--ghost{background:var(--type-ghost)}.type-badge--dragon{background:var(--type-dragon)}.type-badge--dark{background:var(--type-dark)}.type-badge--steel{background:var(--type-steel);color:var(--color-text-strong)}.type-badge--fairy{background:var(--type-fairy)}.pokemon-controls{gap:var(--space-md);margin-bottom:var(--space-xl);flex-wrap:wrap;align-items:center;display:flex}.search-input{flex:1;min-width:200px}.type-select{min-width:140px}.pagination{justify-content:center;align-items:center;gap:var(--space-sm);margin-top:var(--space-xl);display:flex}.pagination__info{font-size:var(--text-sm);color:var(--color-text-secondary);padding:0 var(--space-sm);text-align:center;min-width:80px}.pokemon-detail{max-width:var(--max-width-narrow);margin:0 auto}.pokemon-detail__header{text-align:center;margin-bottom:var(--space-2xl)}.pokemon-detail__id{font-family:var(--font-mono);font-size:var(--text-lg);color:var(--color-text-muted);font-weight:600}.pokemon-detail__name{font-size:var(--text-4xl);text-transform:capitalize;letter-spacing:-.02em;margin:var(--space-sm) 0;font-weight:800}.pokemon-detail__types{gap:var(--space-sm);margin-top:var(--space-sm);justify-content:center;display:flex}.pokemon-detail__types .type-badge{font-size:var(--text-sm);padding:.25rem .8rem}.pokemon-detail__body{gap:var(--space-2xl);grid-template-columns:1fr 1fr;align-items:start;display:grid}.sprite-gallery{text-align:center}.sprite-gallery__main{width:200px;height:200px;margin:0 auto var(--space-md);image-rendering:pixelated;background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--space-md)}.sprite-gallery__thumbs{gap:var(--space-sm);flex-wrap:wrap;justify-content:center;display:flex}.sprite-gallery__thumb{width:56px;height:56px;padding:var(--space-xs);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-secondary);cursor:pointer;transition:border-color var(--transition-fast), transform var(--transition-fast);image-rendering:pixelated}.sprite-gallery__thumb:hover{border-color:var(--color-primary);transform:scale(1.08)}.sprite-gallery__thumb--active{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-light)}.stats{gap:var(--space-md);flex-direction:column;display:flex}.stat-bar{align-items:center;gap:var(--space-md);display:flex}.stat-bar__label{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.03em;width:80px;color:var(--color-text-secondary);flex-shrink:0;font-weight:600}.stat-bar__track{background:var(--color-bg-tertiary);border-radius:var(--radius-full);flex:1;height:10px;overflow:hidden}.stat-bar__fill{border-radius:var(--radius-full);height:100%;transition:width .8s cubic-bezier(.4,0,.2,1);animation:.8s cubic-bezier(.4,0,.2,1) forwards fill-bar}.stat-bar__value{font-size:var(--text-sm);font-weight:700;font-family:var(--font-mono);text-align:right;flex-shrink:0;width:36px}.pokemon-measures{justify-content:center;align-items:center;gap:var(--space-lg);margin-top:var(--space-xl);padding:var(--space-md) var(--space-lg);background:var(--color-bg-secondary);border-radius:var(--radius-lg);display:flex}.pokemon-measures__item{align-items:baseline;gap:var(--space-sm);display:flex}.pokemon-measures__label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);font-weight:600}.pokemon-measures__value{font-size:var(--text-lg);font-weight:700}.pokemon-measures__divider{background:var(--color-border);width:1px;height:1.2rem}.pokemon-abilities{margin-top:var(--space-md);padding:var(--space-md) var(--space-lg);background:var(--color-bg-secondary);border-radius:var(--radius-lg);text-align:center}.pokemon-abilities__label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);margin-bottom:var(--space-sm);font-weight:600}.pokemon-abilities__list{justify-content:center;gap:var(--space-xs);flex-wrap:wrap;display:flex}.ability-badge{font-size:var(--text-sm);background:var(--color-bg-tertiary);border-radius:var(--radius-full);margin:var(--space-xs);text-transform:capitalize;padding:.2rem .6rem;display:inline-block}.ability-badge--hidden{border:1px dashed var(--color-primary);opacity:.7}.pokemon-nav{margin-top:var(--space-2xl);padding-top:var(--space-xl);border-top:1px solid var(--color-border);justify-content:space-between;display:flex}.pokemon-nav__link{font-weight:600;font-size:var(--text-sm);align-items:center;gap:var(--space-sm);display:flex}.about-header{align-items:center;gap:var(--space-2xl);margin-bottom:var(--space-3xl);flex-wrap:wrap;display:flex}.about-avatar{background:linear-gradient(135deg, var(--color-primary), var(--color-accent));border-radius:50%;flex-shrink:0;width:160px;height:160px}.about-intro__name{font-size:var(--text-3xl);letter-spacing:-.02em;font-weight:800}.about-intro__title{font-size:var(--text-lg);color:var(--color-primary);margin-bottom:var(--space-md);font-weight:600}.about-intro__bio{color:var(--color-text-secondary);line-height:var(--line-height-relaxed);max-width:540px}.skills-detail{gap:var(--space-md);max-width:600px;display:grid}.timeline{padding-left:var(--space-2xl);position:relative}.timeline:before{content:"";background:var(--color-border);width:2px;position:absolute;top:0;bottom:0;left:7px}.timeline-item{padding-bottom:var(--space-2xl);position:relative}.timeline-item:last-child{padding-bottom:0}.timeline-item:before{content:"";left:calc(-1 * var(--space-2xl) + 3px);background:var(--color-primary);border:2px solid var(--color-bg);width:10px;height:10px;box-shadow:0 0 0 2px var(--color-primary);border-radius:50%;position:absolute;top:6px}.timeline-item__period{font-size:var(--text-xs);color:var(--color-primary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-xs);font-weight:600}.timeline-item__title{font-size:var(--text-lg);margin-bottom:var(--space-xs);font-weight:700}.timeline-item__company{font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-sm)}.timeline-item__description{font-size:var(--text-sm);color:var(--color-text-muted);line-height:var(--line-height-relaxed)}.contact-links{gap:var(--space-md);flex-wrap:wrap;display:flex}.skeleton{background:var(--color-bg-tertiary);border-radius:var(--radius-md);animation:1.5s ease-in-out infinite skeleton-pulse}.skeleton-card{border:1px solid var(--color-border-light);border-radius:var(--radius-lg);padding:var(--space-lg);align-items:center;gap:var(--space-sm);flex-direction:column;display:flex}.skeleton-card__image{border-radius:var(--radius-md);width:96px;height:96px}.skeleton-card__text{border-radius:var(--radius-sm);width:80%;height:16px}.skeleton-card__text--short{width:50%}.error-state{text-align:center;padding:var(--space-4xl) var(--space-lg)}.error-state__title{font-size:var(--text-2xl);margin-bottom:var(--space-md);font-weight:700}.error-state__message{color:var(--color-text-secondary);margin-bottom:var(--space-xl)}.empty-state{text-align:center;padding:var(--space-3xl) var(--space-lg);color:var(--color-text-muted)}.empty-state__icon{font-size:var(--text-4xl);margin-bottom:var(--space-md)}.empty-state__text{font-size:var(--text-lg)}@keyframes gradient-shift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}@keyframes typing{0%{width:0}to{width:34ch}}@keyframes blink-caret{50%{border-color:#0000}}@keyframes fill-bar{0%{width:0}}@keyframes fade-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.4}}.fade-up{opacity:0;animation:.5s forwards fade-up}.fade-up--delay-1{animation-delay:.1s}.fade-up--delay-2{animation-delay:.2s}.fade-up--delay-3{animation-delay:.3s}.fade-up--delay-4{animation-delay:.4s}.fade-up--delay-5{animation-delay:.5s}.fade-up--delay-6{animation-delay:.6s}@media (width<=640px){.hero__name{font-size:var(--text-3xl)}.hero__role{font-size:var(--text-lg)}.pokemon-detail__body{grid-template-columns:1fr}.about-header{text-align:center;flex-direction:column}.about-intro__bio{max-width:none}.section{padding:var(--space-2xl) var(--space-lg)}.github-page__grid,.github-page__grid--loading{grid-template-columns:1fr}}@media (width<=768px){.grid--skills{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.grid--pokemon{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.pokemon-controls{flex-direction:column}.search-input{min-width:100%}.github-repo-card__footer{flex-direction:column;align-items:flex-start}}@media (width>=1024px){.timeline{padding-left:var(--space-3xl)}}.museum{width:100%;height:calc(100vh - var(--header-height));background:var(--museum-bg);position:relative;overflow:hidden}.museum__canvas{width:100%;height:100%;display:block}.museum__overlay{padding:var(--space-lg);background:var(--museum-overlay-bg);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);cursor:pointer;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.museum__overlay-content{text-align:center;border:2px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);max-width:28rem;box-shadow:var(--shadow-lg);padding:clamp(1.5rem,3vw,2.5rem);position:relative}.museum__overlay-eyebrow{margin-bottom:var(--space-md);font-size:var(--text-xs);letter-spacing:.24em;text-transform:uppercase;color:var(--color-primary);font-weight:700}.museum__overlay-title{letter-spacing:.08em;text-transform:uppercase;color:var(--color-text);margin-bottom:var(--space-md);font-size:clamp(2.5rem,5vw,4rem);font-weight:600}.museum__overlay-text{font-size:var(--text-base);line-height:var(--line-height-relaxed);color:var(--color-text-secondary)}.museum__overlay-hint{margin-top:var(--space-lg);font-size:var(--text-sm);letter-spacing:.12em;text-transform:uppercase;color:var(--color-text-muted);font-weight:600}@media (width<=640px){.museum{height:calc(100vh - 56px)}.museum__overlay-content{max-width:100%;padding:var(--space-lg)}.museum__overlay-title{font-size:clamp(2rem,12vw,3rem)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms;animation-duration:.01ms;animation-iteration-count:1}html{scroll-behavior:auto}.hero__role{border-right:none;width:100%}}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.phebo-layout{gap:var(--space-lg);flex:1;min-height:0;display:flex}.phebo-main{flex-direction:column;flex:1;min-width:0;min-height:0;display:flex}.phebo-practice{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.phebo-sidebar{top:var(--space-lg);left:var(--space-lg);max-height:calc(100% - 2 * var(--space-lg));z-index:5;width:300px;position:absolute;overflow-y:auto}.phebo-source-switch{align-items:center;gap:var(--space-sm);flex-wrap:wrap;display:flex}.phebo-controls{box-shadow:var(--shadow-lg);flex-shrink:0}.phebo-controls__row{gap:var(--space-md);flex-wrap:wrap;align-items:flex-end;display:flex}.phebo-controls__text{width:100%;font-family:var(--font-mono)}.phebo-controls__field{gap:var(--space-xs);flex-direction:column;display:flex}.phebo-controls__field--fixed{flex:none;min-width:4.5rem}.phebo-controls__field--narrow{flex:1 1 0;min-width:0}.phebo-controls__field--grow{flex:auto;min-width:0}.phebo-controls__label{font-size:var(--text-sm);color:var(--color-text-secondary)}.phebo-controls__select{width:100%}@media (width<=900px){.phebo-layout{flex-direction:column}.phebo-sidebar{width:100%;max-height:none;position:static}.phebo-controls{box-shadow:none}}@media (width<=768px){.phebo-hero{flex-direction:column}}.graph-canvas-wrapper{width:100%;position:relative}.graph-canvas{border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-secondary);cursor:crosshair;touch-action:none;width:100%;height:44rem}.graph-canvas-weight-editor{width:3.5rem;padding:var(--space-xs) var(--space-sm);font-size:var(--text-sm);text-align:center;border-color:var(--color-primary);z-index:10;position:absolute;transform:translate(-50%,-110%)}.graph-canvas-context-menu{min-width:170px;padding:var(--space-xs);z-index:10;flex-direction:column;display:flex;position:absolute;transform:translateY(8px)}.graph-canvas-context-menu button{align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);text-align:left;border-radius:var(--radius-sm);display:flex}.graph-canvas-context-menu button:hover:not(.graph-canvas-context-menu__delete){background:var(--color-primary-light);color:var(--color-primary)}.graph-canvas-context-menu__delete{color:var(--color-error)}.graph-canvas-context-menu__delete:hover{background:var(--color-primary-light);color:var(--color-error)}.graph-canvas-toolbar{top:var(--space-sm);left:var(--space-sm);align-items:flex-start;gap:var(--space-xs);z-index:10;max-width:calc(100% - 2 * var(--space-sm));display:flex;position:absolute}.graph-toolbar-algorithm{gap:var(--space-xs);flex-direction:column;display:flex}.graph-toolbar-algorithm__row{gap:var(--space-xs);flex-wrap:wrap;display:flex}.graph-toolbar-algorithm__reset{margin-left:auto}.graph-toolbar-algorithm__select-wrapper{align-items:center;gap:var(--space-xs);height:var(--control-height);padding:0 var(--space-sm);color:var(--color-text-muted);display:flex}.graph-toolbar-algorithm__select-wrapper:hover{border-color:var(--color-primary)}.graph-toolbar-algorithm__select-wrapper--source{color:var(--color-success)}.graph-toolbar-algorithm__select-wrapper--target{color:var(--color-error)}.graph-toolbar-algorithm__select{font-size:var(--text-sm);cursor:pointer;background:0 0;border:none}.graph-toolbar-algorithm__select::picker(select){margin-inline-start:calc(-1 * (var(--space-sm) + 1rem + var(--space-xs)))}.graph-toolbar-algorithm__error{max-width:220px;color:var(--color-error);font-size:var(--text-xs);background:var(--color-surface);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-md);box-shadow:var(--shadow-md)}.graph-section{padding-bottom:var(--space-lg)}.graph-hero{flex:100%}.graph-hero .section__subtitle{margin-bottom:0}.graph-layout{gap:var(--space-md);flex-wrap:wrap;display:flex}.graph-main{gap:var(--space-md);flex-direction:column;flex:1;min-width:0;display:flex}.graph-canvas-playback-toolbar{bottom:var(--space-md);left:var(--space-sm);right:var(--space-sm);z-index:10;position:absolute}.graph-canvas-playback{align-items:center;gap:var(--space-xs);padding:0 var(--space-sm);height:var(--control-height);display:flex}.graph-canvas-playback__button{border-radius:var(--radius-sm);width:1.75rem;height:1.75rem;color:var(--color-text);flex:none;justify-content:center;align-items:center;display:flex}.graph-canvas-playback__button:hover:not(:disabled){background:var(--color-primary-light);color:var(--color-primary)}.graph-canvas-playback__button:disabled{opacity:.4;cursor:not-allowed}.graph-canvas-playback__button--primary{background:var(--color-primary);color:var(--color-text-inverse)}.graph-canvas-playback__button--primary:hover:not(:disabled){background:var(--color-primary-hover);color:var(--color-text-inverse)}.graph-canvas-playback__seek{flex:auto;min-width:60px}.graph-canvas-playback__position{font-size:var(--text-xs);color:var(--color-text-secondary);white-space:nowrap;flex:none}.graph-canvas-playback__speed{height:1.75rem;padding:0 var(--space-xs);font-size:var(--text-xs);cursor:pointer;background:0 0;border:none;flex:none}.graph-canvas-playback__speed:disabled,.graph-canvas-playback__seek:disabled{opacity:.4;cursor:not-allowed}.soko-section{padding-bottom:var(--space-lg)}.soko-hero__actions{align-items:center;gap:var(--space-md);flex-wrap:wrap;flex-shrink:0;display:flex}.soko-status{padding:var(--space-sm) var(--space-md);margin-bottom:var(--space-md);background:var(--color-primary-light);color:var(--color-primary);border-radius:var(--radius-md);font-size:var(--text-sm)}.soko-map-list__empty{color:var(--color-text-secondary)}.soko-map-list__items{gap:var(--space-sm);flex-direction:column;display:flex}.soko-map-list__item{justify-content:space-between;align-items:center;gap:var(--space-md);padding:var(--space-md);background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);flex-wrap:wrap;display:flex}.soko-map-list__item-info{gap:var(--space-xs);flex-direction:column;display:flex}.soko-map-list__item-name{font-weight:600}.soko-map-list__item-meta{font-size:var(--text-xs);color:var(--color-text-muted)}.soko-map-list__item-actions{gap:var(--space-xs);flex-wrap:wrap;display:flex}.soko-editor-layout{gap:var(--space-lg);flex-wrap:wrap;align-items:stretch;display:flex}.soko-toolbar{flex:280px;min-width:260px;max-width:320px;overflow-y:auto}.soko-editor-board{justify-content:center;align-items:center;display:flex}.soko-toolbar__row{align-items:center;gap:var(--space-sm);flex-wrap:wrap;display:flex}.soko-toolbar__name{flex:auto;min-width:0;font-weight:600}.soko-toolbar__size-field{align-items:center;gap:var(--space-xs);font-size:var(--text-xs);color:var(--color-text-secondary);display:flex}.soko-toolbar__size-field .input{width:4rem}.soko-toolbar__tools{gap:var(--space-xs);flex-wrap:wrap;display:flex}.soko-toolbar__actions{flex-flow:wrap}.soko-toolbar__solve-result{font-size:var(--text-sm);color:var(--color-text-secondary)}.soko-toolbar__solve-result--ok{color:var(--color-success);font-weight:600}@keyframes soko-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.soko-toolbar__solve-btn--spinning svg{animation:.8s linear infinite soko-spin}.soko-play-layout{gap:var(--space-md);flex-direction:column;align-items:center;display:flex}.soko-play-hud{gap:var(--space-sm);width:100%;max-width:var(--soko-board-max-width);flex-direction:column;display:flex}.soko-play-hud__row{align-items:center;gap:var(--space-sm);flex-wrap:wrap;display:flex}.soko-play-hud__title{flex:auto;font-weight:600}.soko-play-hud__moves{font-size:var(--text-sm);color:var(--color-text-secondary)}.soko-play-hud__hint{font-size:var(--text-xs);color:var(--color-text-muted)}.soko-play-hud__win{justify-content:space-between;align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-md);background:color-mix(in srgb, var(--color-success) 14%, var(--color-surface));border:2px solid var(--color-success);border-radius:var(--radius-md);color:var(--color-success);flex-wrap:wrap;font-weight:600;display:flex}.soko-grid{width:100%;max-width:var(--soko-board-max-width);background:var(--color-border-light);border-radius:var(--radius-md);gap:0;margin:0 auto;padding:2px;display:grid;position:relative;overflow:hidden}.soko-grid__entity{pointer-events:none;place-items:center;display:grid;position:absolute}.soko-cell{background:var(--color-bg-secondary);border-radius:var(--radius-sm);min-width:0;min-height:0;transition:border-radius var(--transition-fast), box-shadow var(--transition-fast), margin var(--transition-fast);place-items:center;margin:1px;display:grid;position:relative}.soko-cell>*{grid-area:1/1}button.soko-cell{cursor:pointer;transition:filter var(--transition-fast)}button.soko-cell:hover{filter:brightness(1.08)}.soko-cell--wall{background:var(--color-border-light);margin:0}.soko-cell--hole{background:#0a0c1447;margin:0}.soko-cell--ice{background:color-mix(in srgb, var(--color-accent) 12%, var(--color-surface));margin:0}.soko-cell__plate{border-radius:var(--radius-full);border:3px solid var(--color-primary);opacity:.85;width:55%;height:55%}.soko-cell__rail{color:var(--color-accent);opacity:.85;font-size:1.4rem;line-height:1}.soko-cell__box{border-radius:var(--radius-sm);background:var(--color-primary);width:72%;height:72%;box-shadow:var(--shadow-sm)}.soko-cell__box--multi{background-image:repeating-linear-gradient(45deg, var(--color-primary), var(--color-primary) 6px, var(--color-primary-hover) 6px, var(--color-primary-hover) 12px)}.soko-cell__player{border-radius:var(--radius-sm);border:4px solid var(--color-accent);background:color-mix(in srgb, var(--color-accent) 16%, transparent);width:82%;height:82%;box-shadow:var(--shadow-sm)}.turtle-section{padding-bottom:var(--space-lg)}.turtle-layout{gap:var(--space-lg);flex-wrap:wrap;align-items:stretch;display:flex}.turtle-controls{flex:0 260px;min-width:220px;max-width:280px;overflow-y:auto}.turtle-controls__field{gap:var(--space-xs);font-size:var(--text-sm);color:var(--color-text-secondary);flex-direction:column;display:flex}.control-panel__section:has(.turtle-controls__dsl){flex:1;min-height:0}.control-panel__section:has(.turtle-controls__dsl) .turtle-controls__field{flex:1;min-height:0}.turtle-controls__row{gap:var(--space-sm);display:flex}.turtle-controls__field--narrow{flex:1 1 0;min-width:0}.turtle-controls__field--narrow .input{width:100%}.turtle-controls__dsl{min-height:13.5rem;padding:var(--space-sm);font-family:var(--font-mono);font-size:var(--text-sm);resize:vertical;white-space:pre;flex:1;line-height:1.5;overflow-x:auto}.turtle-controls__seed-row{gap:var(--space-xs);display:flex}.turtle-controls__seed-row .input{flex:auto;min-width:0}.turtle-controls__preset-row{gap:var(--space-xs);display:flex}.turtle-controls__select{flex:auto;width:100%;min-width:0}.turtle-controls__stats{font-size:var(--text-sm);color:var(--color-text-secondary)}.turtle-controls__stats--warning{color:var(--color-error)}.turtle-canvas-panel{position:relative}.turtle-canvas-panel canvas{display:block}.turtle-scene__toolbar{top:var(--space-sm);right:var(--space-sm);gap:var(--space-xs);z-index:10;display:flex;position:absolute}.farkas-hero{align-items:flex-start;gap:var(--space-lg);flex-direction:column;max-width:42rem;display:flex}.farkas-error{color:var(--color-error);font-size:var(--text-sm)}.farkas-section{padding-top:var(--space-md)}.farkas-container{gap:var(--space-sm);flex-direction:column;display:flex}.farkas-toolbar{gap:var(--space-xs);flex-wrap:wrap;display:flex}.farkas-statusbar{justify-content:space-between;align-items:center;gap:var(--space-md);flex-wrap:wrap;display:flex}.farkas-phase{font-size:var(--text-sm);color:var(--color-text-secondary)}.farkas-method{border:2px solid var(--color-border);border-radius:var(--radius-md);margin:0;padding:0;display:flex;overflow:hidden}.farkas-method__option{padding:var(--space-xs) var(--space-md);background:var(--color-surface);font-size:var(--text-xs);color:var(--color-text-secondary);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);font-weight:600}.farkas-method__option+.farkas-method__option{border-left:2px solid var(--color-border)}.farkas-method__option:hover{color:var(--color-primary)}.farkas-method__option--active{background:var(--color-primary);color:var(--color-text-inverse)}.farkas-method__option--active:hover{background:var(--color-primary-hover);color:var(--color-text-inverse)}.farkas-phase--locked{color:var(--color-primary);font-weight:600}.farkas-layout{align-items:flex-start;gap:var(--space-lg);flex-wrap:wrap;display:flex}.farkas-stage{min-width:300px;max-height:calc(100vh - var(--header-height) - 8rem);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-secondary);flex:420px;justify-content:center;display:flex;overflow:hidden}.farkas-canvas{max-width:100%;max-height:calc(100vh - var(--header-height) - 8rem);touch-action:none;width:auto;height:auto;display:block}.farkas-sidebar{gap:var(--space-sm);flex-direction:column;flex:0 20rem;min-width:16rem;display:flex}.farkas-metrics,.farkas-adjust{gap:var(--space-lg)}.farkas-actions{gap:var(--space-xs);display:flex}.farkas-actions .btn{flex:1 1 0;justify-content:center}.farkas-adjust__label{justify-content:space-between;align-items:baseline;gap:var(--space-sm);font-size:var(--text-sm);font-weight:600;display:flex}.farkas-adjust__value{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted)}.farkas-adjust__slider{width:100%;accent-color:var(--color-primary);cursor:pointer}.farkas-adjust__nudges{gap:var(--space-xs);display:flex}.farkas-metrics__block{gap:var(--space-sm);flex-direction:column;display:flex}.farkas-metrics__title{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);font-weight:700}.farkas-metrics__hint,.farkas-metrics__empty{font-size:var(--text-xs);color:var(--color-text-muted)}.farkas-metrics__list{gap:var(--space-xs);flex-direction:column;list-style:none;display:flex}.farkas-metrics__row,.farkas-metrics__pair{justify-content:space-between;align-items:baseline;gap:var(--space-sm);padding:var(--space-xs) 0;border-bottom:1px solid var(--color-border-light);font-size:var(--text-sm);display:flex}.farkas-metrics__pair{border-bottom:none;border-top:2px solid var(--color-border);padding-top:var(--space-sm)}.farkas-metrics__label{flex-direction:column;display:flex}.farkas-metrics__span{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted)}.farkas-metrics__values{white-space:nowrap;flex-direction:column;align-items:flex-end;display:flex}.farkas-metrics__px{font-size:var(--text-xs);color:var(--color-text-muted)}.farkas-metrics__total{justify-content:space-between;gap:var(--space-sm);font-size:var(--text-sm);color:var(--color-text-secondary);display:flex}.farkas-metrics__chips{gap:var(--space-xs);flex-wrap:wrap;display:flex}.farkas-chip{min-width:2.5rem;padding:var(--space-xs) var(--space-sm);border:2px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-secondary);cursor:pointer;transition:border-color var(--transition-fast), color var(--transition-fast);font-weight:600}.farkas-chip:hover{border-color:var(--color-primary);color:var(--color-primary)}.farkas-chip--active{border-color:var(--color-accent);color:var(--color-accent);background:var(--color-primary-light)}.farkas-metrics__legend{gap:var(--space-xs);font-size:var(--text-xs);color:var(--color-text-secondary);flex-direction:column;list-style:none;display:flex}.farkas-metrics__legend li{gap:var(--space-sm);display:flex}.farkas-metrics__abbr{font-family:var(--font-mono);color:var(--color-text);flex:0 0 2.25rem;font-weight:700}@media (width<=768px){.farkas-sidebar{flex:100%}}
