:root{--color-bg: #f7f2fb;--color-bg-top: #faf4ff;--color-bg-bottom: #fdf8f5;--color-surface: #fffcfa;--color-surface-alt: #f3ebfa;--color-surface-muted: #faf6fd;--color-text: #3d3348;--color-heading: #5a4a6e;--color-muted: #7a7085;--color-border: #e4d8ef;--color-primary: #8b5fbf;--color-primary-hover: #7a4fad;--color-focus: #5b9fd4;--color-accent-warm: #f4e8ff;--shadow-soft: 0 2px 10px rgba(123, 79, 158, .08);--shadow-panel: 0 4px 16px rgba(123, 79, 158, .1);--shadow-panel-accent: 0 4px 20px rgba(123, 79, 158, .14);--shadow-button: 0 2px 6px rgba(61, 51, 72, .08);--shadow-button-hover: 0 4px 12px rgba(123, 79, 158, .16);--space-xs: .5rem;--space-sm: .75rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--radius: 14px;--radius-pill: 999px;--max-width: 680px;--transition-playful: .16s ease;--font-display: "Comfortaa", "Nunito", sans-serif;--font-body: "Nunito", "Segoe UI", system-ui, sans-serif;--shadow-button-primary: 0 3px 0 #6a4890, 0 5px 14px rgba(123, 79, 158, .32);--shadow-button-primary-hover: 0 4px 0 #6a4890, 0 8px 18px rgba(123, 79, 158, .38);--shadow-button-primary-active: 0 1px 0 #6a4890, 0 3px 8px rgba(123, 79, 158, .22)}body{background:linear-gradient(180deg,var(--color-bg-top) 0%,var(--color-bg-bottom) 55%,var(--color-bg) 100%);color:var(--color-text);min-height:100vh}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.screen{max-width:var(--max-width);margin:0 auto;padding:var(--space-md) var(--space-md) var(--space-xl)}.screen__title{margin:0 0 var(--space-sm);font-family:var(--font-display);font-size:clamp(1.5rem,4vw,2rem);font-weight:700;line-height:1.2}.screen__subtitle{margin:0;color:var(--color-muted);line-height:1.55;font-size:1rem}.screen__meta{margin:0;color:var(--color-muted);font-size:.9rem;text-align:center}.screen__actions,.game-actions{display:flex;flex-direction:column;gap:var(--space-sm);align-items:stretch}.screen__nav,.my-world-link{display:inline-block;margin-bottom:var(--space-md);color:var(--color-muted);font-size:.9rem}.section-heading{margin:0 0 var(--space-sm);font-family:var(--font-display);font-size:.95rem;font-weight:700;letter-spacing:.01em;text-transform:none;color:var(--color-heading)}.result-message,.empty-note{margin:0 0 var(--space-lg);color:var(--color-muted);line-height:1.6}.screen--start{display:flex;flex-direction:column;gap:var(--space-lg)}.start-header{text-align:center;padding:var(--space-md) var(--space-sm);border-radius:calc(var(--radius) + 2px);background:linear-gradient(165deg,var(--color-surface) 0%,var(--color-surface-alt) 100%);border:1px solid var(--color-border);box-shadow:var(--shadow-soft)}.start-header__title{margin:0 0 var(--space-md);font-family:var(--font-display);font-size:clamp(1.45rem,4.5vw,1.85rem);font-weight:700;line-height:1.15;color:var(--color-text)}.start-hero-ensemble{display:flex;flex-wrap:nowrap;justify-content:center;align-items:flex-end;gap:var(--space-xs) clamp(.25rem,1.2vw,.65rem);margin:0 auto var(--space-md);padding:0;max-width:100%;list-style:none}.start-hero-ensemble__item{display:flex;flex-direction:column;align-items:center;gap:.4rem;flex:0 1 auto;min-width:0;max-width:5.25rem}.start-hero-ensemble__figure{display:block;height:clamp(96px,13.5vw,118px);width:auto;max-width:100%;object-fit:contain;object-position:center bottom}.start-hero-ensemble__name{font-size:.72rem;font-weight:600;line-height:1.25;text-align:center;color:var(--color-text);overflow-wrap:anywhere}.start-header__subtitle{margin:0;max-width:28rem;margin-inline:auto;color:var(--color-muted);font-size:.95rem;line-height:1.55}.start-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-sm);margin:0;padding:0;list-style:none}.start-step{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-xs);border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);text-align:center;box-shadow:var(--shadow-soft)}.start-step__number{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:var(--radius-pill);background:color-mix(in srgb,var(--color-primary) 14%,var(--color-surface));border:1px solid color-mix(in srgb,var(--color-primary) 35%,var(--color-border));color:var(--color-primary);font-size:.85rem;font-weight:700;flex-shrink:0}.start-step__text{font-size:.82rem;font-weight:600;line-height:1.35;color:var(--color-text)}.start-legend{margin:0;padding:var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);box-shadow:var(--shadow-soft)}.start-legend .section-heading{margin-bottom:var(--space-sm)}.screen--start .feedback-legend--compact{flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--space-sm) var(--space-md);margin-bottom:var(--space-sm);padding:0;border-radius:0;background:transparent}.start-legend__note{margin:0;font-size:.78rem;line-height:1.45;color:var(--color-muted)}.start-actions{margin-top:auto}.screen--start .screen__nav{margin-bottom:0}.game-header{margin-bottom:var(--space-md)}.game-header__top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-sm);margin-bottom:var(--space-xs)}.game-header__title{margin:0;font-family:var(--font-display);font-size:1.15rem;font-weight:700}.game-header__nav{margin:0;font-size:.8rem;white-space:nowrap}.game-header__attempts{margin:0;color:var(--color-muted);font-size:.95rem}.game-section{margin-bottom:var(--space-lg)}.game-section--history{padding:var(--space-sm) var(--space-md);border-radius:var(--radius);background:color-mix(in srgb,var(--color-surface-muted) 88%,transparent);border:1px solid color-mix(in srgb,var(--color-border) 75%,transparent);box-shadow:none}.game-section--history .section-heading{font-size:.88rem;font-weight:600;color:var(--color-muted);margin-bottom:var(--space-xs)}.game-section--history .empty-note{margin-bottom:0;font-size:.88rem}.game-section--current{padding:var(--space-md);border:2px solid color-mix(in srgb,var(--color-primary) 28%,var(--color-border));border-radius:calc(var(--radius) + 2px);background:linear-gradient(180deg,var(--color-surface) 0%,var(--color-accent-warm) 100%);box-shadow:var(--shadow-panel-accent)}.game-section--palette{padding:var(--space-md);border:2px solid color-mix(in srgb,var(--color-primary) 16%,var(--color-border));border-radius:calc(var(--radius) + 2px);background:var(--color-surface);box-shadow:var(--shadow-panel)}.game-section--palette .section-heading{color:var(--color-heading)}.secret-slots{display:flex;gap:var(--space-sm);justify-content:center;margin-bottom:var(--space-lg)}.secret-slots__slot{position:relative;display:flex;align-items:center;justify-content:center;width:2.35rem;height:2.85rem;border-radius:10px;background:linear-gradient(165deg,#faf0ff,#eadcf8);border:1.5px dashed color-mix(in srgb,var(--color-primary) 38%,var(--color-border));box-shadow:inset 0 1px #ffffffa6}.secret-slots__symbol{--pony-tone: color-mix(in srgb, var(--color-primary) 62%, #fff);position:relative;display:block;width:1.15rem;height:1.05rem}.secret-slots__mane{position:absolute;left:-.02rem;top:.2rem;width:.34rem;height:.78rem;background:var(--pony-tone);border-radius:65% 22% 52% 38%;transform:rotate(-7deg)}.secret-slots__symbol:before{content:"";position:absolute;left:.2rem;top:.16rem;width:.74rem;height:.7rem;background:var(--pony-tone);border-radius:44% 40% 50% 46%;box-shadow:.1rem -.3rem 0 -.07rem var(--pony-tone),.28rem -.24rem 0 -.09rem var(--pony-tone)}.secret-slots__symbol:after{content:"";position:absolute;right:-.06rem;top:.46rem;width:.38rem;height:.28rem;background:var(--pony-tone);border-radius:18% 68% 62% 32%}.button{min-height:44px;padding:.75rem 1rem;border:1px solid var(--color-border);border-radius:calc(var(--radius) - 2px);background:var(--color-surface);color:var(--color-text);font:inherit;font-weight:700;cursor:pointer;box-shadow:var(--shadow-button);transition:transform var(--transition-playful),box-shadow var(--transition-playful),background var(--transition-playful),border-color var(--transition-playful)}.button:hover:not(:disabled){border-color:color-mix(in srgb,var(--color-primary) 45%,var(--color-border));transform:translateY(-1px);box-shadow:var(--shadow-button-hover)}.button:active:not(:disabled){transform:translateY(0) scale(.98)}.button:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.button--primary{position:relative;isolation:isolate;overflow:hidden;border:2px solid #6e4a96;border-radius:calc(var(--radius) + 4px);background:linear-gradient(180deg,#b794e8 0%,#a578dc 20%,#9468cc 48%,var(--color-primary) 78%,#734ba8 100%);color:#fff;text-shadow:0 1px 0 rgba(61,40,90,.22);box-shadow:inset 0 1px #ffffff57,var(--shadow-button-primary)}.button--primary:before{content:"";position:absolute;inset:3px 10px auto;height:44%;border-radius:calc(var(--radius) + 2px) calc(var(--radius) + 2px) 50% 50%;background:linear-gradient(180deg,#ffffff4d,#fff0);pointer-events:none}.button--primary:hover:not(:disabled){background:linear-gradient(180deg,#c4a2ef,#b088e4 20%,#9f74d4 48%,#9168c4 78%,#7d55ad);border-color:#7a5498;transform:translateY(-2px);box-shadow:inset 0 1px #ffffff5c,var(--shadow-button-primary-hover)}.button--primary:active:not(:disabled){background:linear-gradient(180deg,#9a74cc 0%,#8d66c0 35%,var(--color-primary-hover) 100%);transform:translateY(1px) scale(.99);box-shadow:inset 0 1px #ffffff29,var(--shadow-button-primary-active)}.character-card{display:block;flex-shrink:0}.character-card__frame{display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:8px;border:1px solid color-mix(in srgb,var(--token-color) 40%,var(--color-border));background:color-mix(in srgb,var(--token-color) 14%,var(--color-surface))}.character-card__image{display:block;width:100%;height:100%;object-fit:contain}.character-card--palette{width:100%}.character-card--palette .character-card__frame{width:100%;height:96px;padding:6px 8px 4px;border-radius:10px 10px 0 0;border:none;background:color-mix(in srgb,var(--token-color) 18%,var(--color-surface))}.character-card--palette .character-card__image{max-height:86px;width:auto;max-width:100%;object-position:center bottom;transform-origin:center center}.character-card--mirrored.character-card--palette .character-card__image{transform:scaleX(-1)}.character-card--guess,.character-card--history,.character-card--result{--card-framing-zoom: 1.62}.character-card--guess .character-card__frame,.character-card--result .character-card__frame{width:52px;height:64px;padding:0}.character-card--history .character-card__frame{width:38px;height:46px;padding:0;border-radius:6px}.character-card--guess .character-card__image,.character-card--history .character-card__image,.character-card--result .character-card__image{object-position:center center;transform-origin:center center;transform:scale(var(--card-framing-zoom))}.character-card--mirrored.character-card--guess .character-card__image,.character-card--mirrored.character-card--history .character-card__image,.character-card--mirrored.character-card--result .character-card__image{transform:scale(var(--card-framing-zoom)) scaleX(-1)}.character-token{display:inline-flex;flex-direction:column;align-items:center;gap:.25rem}.character-token--card-only{display:inline-block}.character-token__name{font-size:.72rem;font-weight:600;text-align:center;line-height:1.2;max-width:5.5rem}.character-palette{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-sm)}.character-palette__button{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding:0;overflow:hidden;border:1px solid color-mix(in srgb,var(--token-color) 45%,var(--color-border));border-radius:calc(var(--radius) - 2px);background:color-mix(in srgb,var(--token-color) 8%,var(--color-surface));color:var(--color-text);font:inherit;text-align:center;cursor:pointer;box-shadow:var(--shadow-soft);transition:transform var(--transition-playful),box-shadow var(--transition-playful),background var(--transition-playful),border-color var(--transition-playful)}.character-palette__button:hover:not(:disabled){background:color-mix(in srgb,var(--token-color) 14%,var(--color-surface));border-color:color-mix(in srgb,var(--token-color) 65%,var(--color-border));transform:translateY(-2px);box-shadow:var(--shadow-panel)}.character-palette__button:active:not(:disabled){transform:translateY(0) scale(.98)}.character-palette__button:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.character-palette__button:disabled{opacity:.45;cursor:not-allowed}.character-palette__name{padding:6px 6px 8px;font-size:.8rem;font-weight:600;line-height:1.2}.guess-history{margin:0;padding:0;list-style:none}.guess-row{display:flex;flex-wrap:nowrap;align-items:center;gap:.5rem;padding:.4rem 0;border-bottom:1px solid color-mix(in srgb,var(--color-border) 55%,transparent);min-height:52px}.guess-row__number{width:1.25rem;color:color-mix(in srgb,var(--color-muted) 85%,transparent);font-size:.82rem;font-weight:600;text-align:right;flex-shrink:0}.guess-row__pegs{display:flex;flex-wrap:nowrap;gap:.35rem;flex:0 1 auto;min-width:0}.guess-row__separator{width:1px;align-self:stretch;min-height:2.75rem;margin:0 .15rem;background:var(--color-border);flex-shrink:0}.feedback-group{display:flex;flex-wrap:nowrap;gap:.4rem;padding:.15rem 0;flex-shrink:0;margin-left:auto}.feedback-token{display:inline-block;flex-shrink:0;overflow:hidden;border-radius:var(--radius-pill);border:2.5px solid transparent;padding:0;background:transparent;line-height:0}.feedback-token--history{width:40px;height:40px}.feedback-token--legend{width:46px;height:46px}.feedback-token--smile{border-color:#27ae60}.feedback-token--wink{border-color:#d4ac0d}.feedback-token--oops{border-color:#e84393}.feedback-token__image{display:block;width:100%;height:100%;object-fit:cover}.feedback-legend{margin:0 0 var(--space-md);padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--space-xs)}.feedback-legend--compact{flex-direction:row;flex-wrap:wrap;gap:var(--space-sm) var(--space-md);margin-bottom:var(--space-lg);padding:var(--space-sm);border-radius:var(--radius);background:var(--color-surface-alt)}.feedback-legend__item{display:flex;align-items:center;gap:var(--space-sm);font-size:.88rem;color:var(--color-muted)}.feedback-legend--compact .feedback-legend__item{font-size:.78rem}.current-guess-header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-sm);margin-bottom:var(--space-sm)}.current-guess-header .section-heading{margin:0}.current-guess__counter{margin:0;font-size:.85rem;font-weight:600;color:var(--color-primary)}.current-guess{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-sm)}.current-guess__slot{display:flex;align-items:center;justify-content:center;min-height:68px;padding:4px;border:1.5px dashed color-mix(in srgb,var(--color-primary) 22%,var(--color-border));border-radius:calc(var(--radius) - 2px);background:color-mix(in srgb,var(--color-surface) 92%,var(--color-accent-warm))}.current-guess__slot:has(.character-card--guess){border-style:solid;border-color:color-mix(in srgb,var(--color-primary) 42%,var(--color-border));background:color-mix(in srgb,var(--color-primary) 8%,var(--color-surface));box-shadow:inset 0 0 0 1px #ffffff80}.current-guess__empty{color:var(--color-muted);font-size:.95rem;font-weight:600}.screen--result{display:flex;flex-direction:column;gap:var(--space-md)}.result-panel{padding:var(--space-lg) var(--space-md);border-radius:calc(var(--radius) + 4px);background:linear-gradient(180deg,var(--color-surface) 0%,var(--color-surface-alt) 100%);border:1px solid var(--color-border);box-shadow:var(--shadow-panel);text-align:center}.result-panel__title{text-align:center}.result-hero{width:4rem;height:4rem;margin:0 auto var(--space-md);border-radius:var(--radius-pill);background:radial-gradient(circle at 30% 30%,#f4e8ff,#c4a0e0);border:2px solid color-mix(in srgb,var(--color-primary) 40%,#fff);box-shadow:var(--shadow-soft)}.screen--result .result-message{text-align:center;margin-bottom:var(--space-md)}.result-secret__code{max-width:28rem;margin:0 auto}.result-panel__actions{align-items:center;margin-top:var(--space-md)}.screen--result .screen__nav{margin-bottom:0}@media(min-width:480px){.screen__actions,.game-actions{flex-direction:row;flex-wrap:wrap;align-items:center}.button{min-width:160px}.screen--start .screen__actions{flex-direction:column;align-items:stretch}.screen--start .button--primary{width:100%}}@media(max-width:479px){.start-steps{grid-template-columns:1fr}.start-step{flex-direction:row;align-items:center;text-align:left;gap:var(--space-sm)}}@media(max-width:420px){.start-hero-ensemble{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:var(--space-md) var(--space-xs)}.start-hero-ensemble__item{max-width:none}.start-hero-ensemble__figure{height:clamp(76px,24vw,92px);width:100%;margin-inline:auto}.start-hero-ensemble__name{font-size:.68rem;line-height:1.2;padding-inline:.1rem}.screen--start .feedback-legend--compact{flex-direction:column;align-items:flex-start}.character-palette{grid-template-columns:repeat(2,minmax(0,1fr))}.guess-row{flex-wrap:wrap}.guess-row__separator{display:none}.feedback-group{width:100%;justify-content:flex-start;margin-left:1.75rem}.game-header__nav{display:none}}@media(max-width:360px){.character-card--guess .character-card__frame,.character-card--result .character-card__frame{width:44px;height:56px}.character-card--history .character-card__frame{width:34px;height:42px}.feedback-token--history{width:36px;height:36px}}@media(prefers-reduced-motion:reduce){.button,.character-palette__button{transition:none}.button:hover:not(:disabled),.button:active:not(:disabled),.character-palette__button:hover:not(:disabled),.character-palette__button:active:not(:disabled){transform:none}}:root{--font-body: "Nunito", "Segoe UI", system-ui, sans-serif;--font-display: "Comfortaa", "Nunito", sans-serif;font-family:var(--font-body);line-height:1.5}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh}#root{min-height:100vh}button{font:inherit}