.sudoku-experience,.sudoku-experience *{box-sizing:border-box}
.experience-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:54px;align-items:start;padding:30px 0 50px}.experience-hero h1{font-size:clamp(2rem,3.7vw,2.7rem);line-height:1.7}.experience-hero em{color:var(--blue);font-style:normal}.experience-hero .lead{max-width:480px}.hero-actions{display:flex;flex-wrap:wrap;gap:20px;align-items:center}.hero-actions>a:not(.button){font-size:.9rem}.path-nav{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:15px 0 50px}.path-nav a{padding:24px;color:var(--ink);text-decoration:none;border-right:1px solid var(--line)}.path-nav a:last-child{border-right:0}.path-nav a:hover{background:var(--pale)}.path-nav b{display:block;margin-bottom:9px}.path-nav span{font-size:.85rem;color:var(--muted)}.brain-intro{background:var(--pale);padding:30px;border-radius:10px;margin:40px 0}.brain-intro p{margin:18px 0;max-width:800px}.experience-article{max-width:780px;margin:35px auto}.experience-article>p{margin:18px 0}.experience-article .sudoku-experience{max-width:550px;margin:28px auto}
.sudoku-experience{--xp-blue:#166a9b;--xp-ink:#20374b;--xp-pale:#e9f3f8;--xp-line:#c6d1d9;color:var(--xp-ink);background:#fff;border:1px solid #d6e0e6;border-radius:12px;padding:20px;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;text-align:left;line-height:1.7;min-width:0}.sudoku-experience p{color:var(--xp-ink);font-size:.9rem;text-align:left;line-height:1.8;margin:12px 0}.sudoku-experience .xp-caption{font-size:.8rem;font-weight:700;color:var(--xp-blue);margin:0 0 12px}.sudoku-experience .xp-stage{position:relative;max-width:510px;margin:auto}.sudoku-experience .experience-grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));grid-template-rows:repeat(9,minmax(0,1fr));aspect-ratio:1;width:100%;border:2px solid #263746;background:white}.sudoku-experience .xp-cell{padding:0;min-width:0;min-height:0;border:0;border-right:1px solid var(--xp-line);border-bottom:1px solid var(--xp-line);border-radius:0;background:#fafafa;display:grid;place-items:center;color:#1976d2;font-size:clamp(1.1rem,2vw,1.6rem);font-family:inherit;line-height:1;position:relative;opacity:1;touch-action:manipulation}.sudoku-experience .xp-cell.xp-given{background:#eee;color:#222;font-weight:600}.sudoku-experience .xp-cell.xp-related{background:#e9eff8}.sudoku-experience .xp-cell.xp-selected{background:#bbdefb;box-shadow:inset 0 0 0 2px #1976d2;z-index:1}.sudoku-experience .xp-cell:nth-child(3n){border-right:2px solid #263746}.sudoku-experience .xp-cell:nth-child(9n){border-right:0}.sudoku-experience .xp-cell:nth-child(n+19):nth-child(-n+27),.sudoku-experience .xp-cell:nth-child(n+46):nth-child(-n+54){border-bottom:2px solid #263746}.sudoku-experience .xp-cell:nth-child(n+73){border-bottom:0}.sudoku-experience .xp-cell:focus-visible{outline:3px solid #bf6e16;outline-offset:-4px}.sudoku-experience .xp-notes{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));padding:2px;color:#3a546a;font-size:.65rem}.sudoku-experience .xp-notes span{display:grid;place-items:center}.sudoku-experience .xp-status{font-size:.85rem;padding:12px;background:var(--xp-pale);border-left:3px solid var(--xp-blue);min-height:90px;margin:14px 0;line-height:1.8}.sudoku-experience .xp-controls{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.sudoku-experience .xp-button{background:var(--xp-blue);color:white;border:1px solid var(--xp-blue);border-radius:5px;padding:9px 13px;font-family:inherit;font-size:.8rem;line-height:1.5;min-height:44px;cursor:pointer}.sudoku-experience .xp-button.xp-secondary{background:white;color:var(--xp-blue)}.sudoku-experience .xp-button:disabled{opacity:.5;cursor:default}.sudoku-experience .xp-options{display:flex;flex-wrap:wrap;gap:10px 15px;font-size:.75rem;align-items:center;margin:14px 0}.sudoku-experience .xp-options label{display:flex;gap:6px;align-items:center;min-height:40px}.sudoku-experience select{font:inherit;background:#fff;color:var(--xp-ink);border:1px solid var(--xp-line);border-radius:4px;padding:6px 4px;min-height:40px}.sudoku-experience input[type=checkbox]{width:18px;height:18px}.sudoku-experience .xp-small{font-size:.72rem;color:#536b7a;margin-bottom:0}.sudoku-experience .xp-keypad{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:5px;margin:15px 0}.sudoku-experience .xp-keypad button{min-height:44px;border:1px solid var(--xp-line);border-radius:4px;font:inherit;font-size:1.1rem;background:white;color:var(--xp-ink);padding:4px;cursor:pointer}.sudoku-experience .xp-keypad button:disabled{opacity:.45;cursor:default}.sudoku-experience .xp-clear{border:1px solid #7eaf98;background:#edf7f0;padding:20px;margin-top:20px}.sudoku-experience .xp-clear h2{font-size:1.15rem;line-height:1.7;margin:0;color:#25624b}.sudoku-experience .xp-effects{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:3}.sudoku-experience .xp-burst{position:absolute;left:var(--x);top:var(--y);width:0;height:0;--duration:480ms}.sudoku-experience .xp-ring{position:absolute;border:2px solid var(--ring-color);width:var(--ring-size);height:var(--ring-size);border-radius:50%;left:calc(var(--ring-size) / -2);top:calc(var(--ring-size) / -2);animation:xp-ring var(--duration) cubic-bezier(.22,.61,.36,1) both}.sudoku-experience .xp-spark{position:absolute;left:-2px;top:-2px;width:5px;height:5px;border-radius:1px;animation:xp-spark var(--duration) cubic-bezier(.22,.61,.36,1) both}.sudoku-experience .xp-effect-label{position:absolute;left:0;top:0;white-space:nowrap;transform:translate(-50%,-50%);border:2px solid white;border-radius:999px;background:linear-gradient(135deg,#ffc107,#ff6d00);color:white;font-weight:900;padding:5px 14px;font-size:1rem;text-shadow:0 1px 2px #0004;box-shadow:0 0 15px #ffc10780;animation:xp-label var(--duration) ease-out both}.sudoku-experience[data-style=sparkle] .xp-spark{clip-path:polygon(50% 0,62% 35%,100% 50%,62% 65%,50% 100%,38% 65%,0 50%,38% 35%);width:10px;height:10px}.sudoku-experience[data-style=sparkle] .xp-effect-label{background:linear-gradient(135deg,#ffd54f,#ec407a)}.sudoku-experience[data-style=neon] .xp-ring{border-width:3px;box-shadow:0 0 10px #00e5ff,inset 0 0 8px #7c4dff}.sudoku-experience[data-style=neon] .xp-effect-label{background:linear-gradient(135deg,#00a1b5,#7c4dff)}.sudoku-experience[data-style=zen] .xp-spark{border-radius:80% 10% 80% 10%;width:8px;height:6px}.sudoku-experience[data-style=zen] .xp-ring{border-width:1px}.sudoku-experience[data-style=zen] .xp-effect-label{background:linear-gradient(135deg,#527e79,#7986cb)}.sudoku-experience .xp-pop{animation:xp-pop 620ms cubic-bezier(.22,.61,.36,1)}.sudoku-experience .xp-unit-complete{animation:xp-unit 1150ms ease-out}.sudoku-experience .xp-error{animation:xp-error 400ms ease-out}.sudoku-experience .xp-board-complete{border-color:#2b8b64}.xp-game{max-width:600px;margin:24px auto!important}#learning .xp-demo{max-width:430px;margin:25px auto}#learning .xp-demo h2{border:0}#learning .xp-demo p{font-size:.85rem}#learning .xp-demo .xp-small{font-size:.72rem}
@keyframes xp-pop{0%{transform:scale(.76);color:#ff6d00}55%{transform:scale(1.12)}100%{transform:scale(1)}}@keyframes xp-unit{0%{background:#fff0aa}100%{background:#e9f3f8}}@keyframes xp-error{0%,60%{background:#ffcdd2}20%{transform:translateX(-2px)}40%{transform:translateX(2px)}100%{transform:translateX(0)}}@keyframes xp-ring{0%{opacity:.85;transform:scale(.1)}100%{opacity:0;transform:scale(1)}}@keyframes xp-spark{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--turn))}}@keyframes xp-label{0%{opacity:0;transform:translate(-50%,-50%) scale(.72)}20%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}70%{opacity:1}100%{opacity:0;transform:translate(-50%,-65%) scale(1)}}
@media(max-width:900px){.experience-hero{gap:25px}.experience-hero h1{font-size:2rem}.experience-hero .lead{font-size:.95rem}.sudoku-experience{padding:14px}.path-nav a{padding:16px}}@media(max-width:700px){.experience-hero{grid-template-columns:1fr;padding-top:20px}.experience-hero .xp-demo{max-width:460px;width:100%;margin:auto}.experience-hero h1{font-size:clamp(1.65rem,6vw,2.4rem)}.experience-hero h1 em{display:block}.experience-hero .lead{margin:18px 0}.path-nav{grid-template-columns:1fr;margin:15px 0 35px}.path-nav a{border-right:0;border-bottom:1px solid var(--line)}.path-nav a:last-child{border-bottom:0}.path-nav b{margin-bottom:4px}.brain-intro{padding:22px}.sudoku-experience .xp-cell{font-size:clamp(1rem,4.8vw,1.7rem)}.sudoku-experience .xp-status{min-height:110px}.sudoku-experience .xp-options{gap:8px 12px}.sudoku-experience .xp-notes{font-size:clamp(.55rem,2.25vw,.7rem);padding:1px}.sudoku-experience .xp-keypad{gap:3px}.sudoku-experience .xp-keypad button{min-height:44px;padding:2px;font-size:1rem}.sudoku-experience .xp-button{padding:9px 10px}.hero-actions{gap:15px}.experience-article{margin-top:25px}}@media(prefers-reduced-motion:reduce){.sudoku-experience .xp-pop,.sudoku-experience .xp-unit-complete,.sudoku-experience .xp-error,.sudoku-experience .xp-ring,.sudoku-experience .xp-spark,.sudoku-experience .xp-effect-label{animation:none!important}.sudoku-experience .xp-effects{display:none}}

.experience-hero>div:first-child{padding-top:35px}.experience-hero .xp-demo{max-width:430px;justify-self:end}.experience-hero .xp-stage{max-width:360px}@media(max-width:700px){.experience-hero>div:first-child{padding-top:0}.experience-hero .xp-demo{justify-self:center}}