:root{font-family:ui-rounded,system-ui,sans-serif;color:#2c2052;background:#f5f2fc}*{box-sizing:border-box}body{margin:0}main{max-width:1440px;margin:auto;padding:24px 40px}header{display:flex;justify-content:space-between;align-items:center}a{font-size:14px;font-weight:800;color:#554297;text-decoration:none}nav{display:flex;gap:8px}button{font:inherit;font-size:12px;font-weight:800;padding:10px 14px;border:1px solid #d8cfea;border-radius:12px;color:#4c367f;background:white;cursor:pointer}button:hover{background:#e9e0ff}button:focus-visible,a:focus-visible{outline:3px solid #f88d47;outline-offset:3px}.intro{display:flex;justify-content:space-between;align-items:center;padding:32px 0 26px}.eyebrow{font-size:10px;font-weight:900;letter-spacing:1.8px;color:#82739f;margin:0 0 10px}h1{font-size:clamp(38px,5vw,62px);line-height:1.1;letter-spacing:-3px;margin:0 0 12px}h1 span{color:#ff937e;font-size:35px;padding-left:14px}.intro p:last-child{font-size:15px;color:#78638e;margin:0}.sticker{background:#ffde72;transform:rotate(8deg);padding:18px 20px;border-radius:20px;font-size:11px;line-height:1.6;letter-spacing:1px;font-weight:900}.layout{display:grid;grid-template-columns:minmax(0,1fr) 245px;gap:26px}.world-wrap{height:560px;border-radius:24px;overflow:hidden;position:relative;background:#d7c8ef;border:1px solid #b7a5d5;box-shadow:0 16px 30px #5a37721a}#world{width:100%;height:100%;touch-action:none}canvas{display:block;width:100%;height:100%;outline:none}.hud{position:absolute;z-index:2;top:16px;left:16px;right:16px;display:flex;gap:8px;pointer-events:none}.hud span{padding:9px 13px;background:#ffffffeb;font-size:12px;border-radius:10px;font-weight:850}.hud span:last-child{margin-left:auto;color:#7d658e}.prompt{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);background:#523381ed;color:white;width:max-content;max-width:92%;font-size:12px;line-height:1.5;font-weight:750;text-align:center;border-radius:28px;padding:10px 16px;pointer-events:none}.touch{position:absolute;bottom:18px;left:18px;right:18px;display:flex;justify-content:space-between;gap:8px}.touch>div{display:flex;gap:6px}.touch button{min-width:45px;height:48px;touch-action:none;user-select:none;background:#ffffffeb;font-size:16px}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#44235b50;backdrop-filter:blur(5px);padding:24px;z-index:4}.overlay.hidden{display:none}.card{max-width:430px;background:#fffcff;padding:30px;border-radius:24px;border:1px solid white;box-shadow:0 15px 70px #341c6633}.card .eyebrow{font-size:9px}.card h2{font-size:31px;letter-spacing:-1px;line-height:1.15;margin:12px 0 17px}.card p{font-size:14px;line-height:1.6}.card #controlHelp{font-size:12px;color:#84729b;padding-top:13px;border-top:1px solid #e1dbea}.primary{width:100%;background:#754dd4;color:white;border:0;padding:14px;font-size:15px;margin-top:8px}.primary:hover{background:#5c36b4}aside{padding:16px 0}.trial{display:flex;gap:12px;padding:23px 0;border-bottom:1px solid #ded5eb}.trial>b{flex-shrink:0;width:31px;height:31px;border-radius:9px;background:#e6dcf8;display:grid;place-items:center;font-size:11px;color:#8c75b2}.trial h2{font-size:16px;margin:5px 0 8px}.trial p{font-size:12px;line-height:1.65;color:#877497;margin:0}.trial.done>b{background:#754dd4;color:white}.tip{font-size:12px;background:#ece4f9;padding:18px;border-radius:17px;line-height:1.7;margin-top:22px}.tip p{color:#867097;margin:7px 0 0}footer{font-size:12px;line-height:1.9;color:#7e6d90;margin-top:20px}footer span{font-size:11px;color:#9b8aa9}@media(max-width:1000px){main{padding:20px}.layout{grid-template-columns:1fr}.world-wrap{height:530px}aside{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}aside>.eyebrow{display:none}.tip{grid-column:1/-1;margin:0}.trial{padding:12px 0}}@media(max-width:600px){main{padding:15px 12px}nav{gap:4px}nav button{font-size:10px;padding:9px 7px}a{font-size:11px}.intro{padding:26px 0 22px}.intro p:last-child{font-size:12px}.intro .eyebrow{font-size:8px;letter-spacing:1px}h1{font-size:36px;letter-spacing:-2px}h1 span{font-size:23px;padding-left:8px}.sticker{font-size:8px;padding:12px;border-radius:14px}.world-wrap{height:525px;border-radius:18px}.hud{left:10px;right:10px;top:10px}.hud span{font-size:10px;padding:8px}.hud span:last-child{display:none}.touch{left:9px;right:9px;bottom:15px;gap:6px}.touch>div{gap:5px}.touch button{min-width:37px;padding:8px;font-size:14px}.prompt{font-size:11px;bottom:79px}.overlay{padding:16px}.card{padding:23px}.card h2{font-size:28px}.card p{font-size:13px}aside{grid-template-columns:1fr;gap:0}.trial{padding:15px 0}.tip{margin-top:18px}.layout{gap:15px}}