:root{--ink:#3d304e;--purple:#7052b5;--paper:#fffaf2;--lavender:#eee5ff;--mint:#cbead8;--pink:#f7c4d5;--butter:#ffedac}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Trebuchet MS",Arial,sans-serif}button{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}a{color:inherit}button:focus-visible,a:focus-visible,.board:focus-visible{outline:3px solid var(--purple);outline-offset:5px}[hidden]{display:none!important}::selection{background:var(--butter)}.wrap{width:min(1140px,calc(100% - 64px));margin:auto}header{height:96px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:900;letter-spacing:-1px;text-decoration:none}.brand svg{width:35px;height:35px}.brand span{color:var(--purple)}.back{font-size:13px;font-weight:bold;text-underline-offset:6px}main{border-block:2px solid var(--ink);background-color:var(--lavender);background-image:linear-gradient(#b7a0d51c 1px,transparent 1px),linear-gradient(90deg,#b7a0d51c 1px,transparent 1px);background-size:36px 36px}.playground{padding-block:48px 56px;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:64px}.eyebrow{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;font-weight:bold;margin:0 0 20px}.eyebrow:before{content:"";display:inline-block;width:8px;height:8px;background:var(--purple);border-radius:50%;margin-right:9px}h1{font-size:70px;line-height:1.07;letter-spacing:-3.5px;margin:0 0 22px}h1 span{color:var(--purple)}.subtitle{font-size:18px;line-height:1.6;margin:0}.doodle{display:flex;align-items:center;gap:27px;margin:19px 0 25px;padding-left:12px;font-size:49px;line-height:1.3}.doodle span:nth-child(1){color:#8baf9c;transform:rotate(-12deg)}.doodle span:nth-child(2){color:#b56e8c;transform:rotate(12deg)}.doodle span:nth-child(3){color:var(--purple);transform:rotate(-12deg)}.doodle span:nth-child(4){color:#a78435;transform:rotate(12deg)}.how-to{background:var(--paper);border:2px solid var(--ink);padding:25px 23px 22px;border-radius:4px;transform:rotate(-2deg);position:relative;box-shadow:5px 5px 0 #c5aee3;max-width:410px}.tape{position:absolute;width:85px;height:25px;background:#f8c698db;left:calc(50% - 42px);top:-13px;transform:rotate(7deg);clip-path:polygon(0 0,100% 4%,96% 30%,100% 70%,97% 100%,0 97%,4% 70%,0 30%)}.how-to h2{font-size:17px;margin:0 0 15px}.how-to ol{padding-left:21px;margin:0;line-height:1.8;font-size:14px}.how-to li{padding-left:5px}.how-to p{font-size:12px;line-height:1.6;margin:15px 0 0;color:#665774}.handwritten{font-family:Georgia,serif;font-style:italic;color:var(--purple);font-size:17px;transform:rotate(-3deg);margin:25px 0 0;text-align:center;max-width:410px}.game{background:var(--paper);border:2px solid var(--ink);border-radius:25px;box-shadow:7px 7px 0 var(--ink);padding:24px 28px 22px;min-width:0}.scores{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:center}.scores>div{background:#f0e9f5;border:2px solid #e4d8ef;border-radius:12px;padding:11px 7px}.scores .best-score{background:var(--butter);border-color:var(--ink)}.scores>div>span{font-size:11px;font-weight:bold}.scores strong{display:block;font-size:28px;margin-top:5px}.scores strong small{font-size:12px;font-weight:normal;color:#665774}.status{text-align:center;font-size:17px;line-height:1.35;min-height:24px;margin:21px 0 6px}.hint{text-align:center;font-size:11px;line-height:1.5;margin:0 0 19px;min-height:17px;color:#665774}.board{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:12px;border:3px solid var(--ink);background:#e6d9f2;border-radius:50%;padding:13px;width:100%;max-width:373px;aspect-ratio:1;margin:auto;box-shadow:4px 5px 0 #c5aee3}.pad{border:2px solid var(--ink);min-width:0;position:relative;cursor:pointer;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:14px 4px;box-shadow:inset 0 -5px 0 #3d304e15;touch-action:manipulation}.mint{background:var(--mint);border-radius:100% 14px 14px 14px}.pink{background:var(--pink);border-radius:14px 100% 14px 14px}.lavender{background:#d5c5f2;border-radius:14px 14px 14px 100%}.butter{background:var(--butter);border-radius:14px 14px 100% 14px}.pad .shape{font-size:48px;line-height:1;pointer-events:none}.mint .shape,.pink .shape{margin-top:11px}.pad-label{display:flex;gap:5px;align-items:center;font-size:10px;font-weight:bold;pointer-events:none}.pad kbd{font:inherit;font-size:9px;border:1px solid #3d304e70;border-radius:4px;padding:1px 4px;background:#fffaf280}.pad[aria-disabled=true]{cursor:default}.your-turn .pad:hover{box-shadow:inset 0 0 0 4px #fffaf2a0}.pad.lit{background:#fffdf4;box-shadow:inset 0 0 0 7px var(--purple),0 0 16px #7052b54d}.pad.lit .shape{transform:scale(1.12)}.pad.wrong{background:#f1b5b9;box-shadow:inset 0 0 0 6px #8f4052}.center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:3px solid var(--ink);border-radius:50%;width:95px;height:95px;background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;box-shadow:0 3px 0 #3d304e20}.center>span{text-transform:uppercase;letter-spacing:1.2px;font-size:9px;font-weight:bold}.center strong{font-size:30px;line-height:1.05;color:var(--purple);margin-top:2px}.center small{font-size:9px;margin-top:2px}.progress{display:flex;justify-content:center;gap:7px;margin-top:23px}.level-dot{height:9px;width:9px;border-radius:50%;border:1.5px solid #a78ebe;background:#eee5ff}.level-dot.complete{background:var(--purple);border-color:var(--purple)}.level-dot.current{background:var(--butter);border-color:var(--ink)}.actions{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:22px;flex-wrap:wrap}.button{background:var(--butter);border:2px solid var(--ink);border-radius:11px;box-shadow:3px 3px 0 var(--ink);padding:13px 22px;font-size:14px;font-weight:bold;cursor:pointer;min-height:48px}.button:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--ink)}.button.resume{background:var(--mint)}.sound{background:none;border:none;text-decoration:underline;text-underline-offset:4px;font-size:12px;cursor:pointer;min-height:44px;padding:5px}.keyboard-note{text-align:center;font-size:10px;line-height:1.6;margin:17px 0 0;color:#665774}.storage-note{text-align:center;font-size:10px;line-height:1.6;margin:5px 0 0;color:#665774}.no-script{text-align:center;font-size:14px;color:var(--purple)}.won .board{background:var(--mint);box-shadow:4px 5px 0 #9fcfb0}.won .center{background:var(--butter)}footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-block:25px;font-size:12px}footer strong{font-size:15px}footer p{margin:0}
@media(max-width:950px){.playground{gap:35px}h1{font-size:56px}.game{padding:22px 20px}.how-to{padding:23px 18px}.pad .shape{font-size:42px}.center{width:85px;height:85px}.center strong{font-size:26px}}
@media(max-width:700px){.wrap{width:calc(100% - 36px)}header{height:80px}.brand{font-size:21px;gap:7px}.brand svg{width:29px}.back{font-size:11px}.playground{display:flex;flex-direction:column;gap:26px;padding-block:30px 38px}.intro{width:100%;text-align:center}.eyebrow{font-size:9px;margin-bottom:14px}h1{font-size:44px;letter-spacing:-2px;margin-bottom:14px}h1 br{display:none}h1 span{margin-left:.15em}.subtitle{font-size:14px}.doodle,.handwritten{display:none}.how-to{margin:20px auto 0;max-width:420px;padding:20px 18px 15px;transform:rotate(-1deg)}.how-to h2{font-size:14px;margin-bottom:9px}.how-to ol{font-size:12px;text-align:left;max-width:260px;margin:auto;line-height:1.65}.how-to p{font-size:11px;margin-top:9px}.game{width:100%;max-width:470px;padding:20px 18px}.status{font-size:15px;margin-top:18px}.hint{font-size:10px}.board{gap:10px;padding:10px}.pad .shape{font-size:38px}.pad-label{font-size:9px}.center{width:76px;height:76px}.center strong{font-size:23px}.center>span,.center small{font-size:8px}.progress{gap:6px}.level-dot{height:8px;width:8px}.actions{gap:13px}.button{padding:12px 17px;font-size:13px}.keyboard-note,.storage-note{font-size:9px}footer{font-size:10px}footer strong{font-size:12px}}
@media(prefers-reduced-motion:reduce){.pad.lit .shape{transform:none}}