*{box-sizing:border-box}body{margin:0;background:#f2efe6;color:#233f3c;font-family:Arial,sans-serif}main{max-width:1220px;padding:24px 40px;margin:auto}button,select,summary{font:inherit}button,select{border:1px solid #aebbb0;border-radius:7px;padding:11px 14px;background:#fbfaf6;color:#233f3c}button{cursor:pointer}button:hover:not(:disabled){background:#e5eadf}button:disabled{opacity:.4;cursor:default}button:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #c76e39;outline-offset:3px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #c8ccbd;padding-bottom:17px}.brand{font:bold 24px Georgia;color:inherit;text-decoration:none}.brand span{font:10px Arial;letter-spacing:2px;margin-left:18px}.hero{display:flex;align-items:center;justify-content:space-between;padding:40px 20px 30px}.eyebrow{font-size:11px;letter-spacing:3px;color:#6e7971}h1{font:76px/1 Georgia;margin:12px 0 18px;font-weight:normal}h1 em{color:#b06b42}.intro{font-size:16px;line-height:1.65;color:#5c6e64}.sculpture{position:relative;width:290px;height:180px;transform:rotate(-8deg)}.sculpture i{position:absolute;width:65px;height:65px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#fcf8e9,#d3c6a7 65%,#a39070);box-shadow:10px 22px 20px #536c5830}.sculpture i:nth-child(1){left:30px;top:100px}.sculpture i:nth-child(2){left:98px;top:100px;background:radial-gradient(circle at 30% 20%,#80aca0,#2d675d 65%,#143e37)}.sculpture i:nth-child(3){left:166px;top:100px}.sculpture i:nth-child(4){left:64px;top:49px}.sculpture i:nth-child(5){left:132px;top:49px}.sculpture i:nth-child(6){left:98px;top:0;background:radial-gradient(circle at 30% 20%,#80aca0,#2d675d 65%,#143e37)}.toolbar{display:flex;align-items:end;gap:14px;padding:20px 0;border-top:1px solid #c8ccbd}label{font-size:11px;letter-spacing:1px;display:grid;gap:7px}select{font-size:13px;letter-spacing:0;max-width:100%}.table{display:grid;grid-template-columns:200px 1fr;background:#e3e8dd;border:1px solid #c9d0c2;border-radius:14px;overflow:hidden}.rail{padding:24px;border-right:1px solid #c7cebf}.player{padding:15px 0}.player span{display:block;font-size:10px;letter-spacing:1px}.player strong{font:44px Georgia;display:block;margin:6px 0}.player small{font-size:11px;color:#637367}.teal{color:#20685c}.action{display:grid;gap:8px;margin-top:20px}.action button{font-size:12px}#tip{font-size:12px;line-height:1.6;color:#647467}.record{font-size:11px;line-height:1.6}.play{padding:24px}.turnline{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1px}#stage{color:#7e8a7b;font-size:10px}#message{min-height:40px;line-height:1.4;font-size:14px}#layers{display:grid;grid-template-columns:1.4fr 1fr;gap:15px}.layer{padding:15px;background:#eff1e8;border:1px solid #d0d6c8;border-radius:10px}.layer h2{font-size:10px;font-weight:normal;letter-spacing:2px;margin:0 0 15px;color:#75836f}.grid{display:grid;gap:7px;max-width:300px;margin:auto;aspect-ratio:1}.cell{border-radius:50%;padding:0;min-width:0;aspect-ratio:1;position:relative;background:#dce2d3;border:1px dashed #bbc6b0;box-shadow:inset 0 2px 5px #52674e12}.cell.available{border:2px solid #93aa8b;background:#f7f6eb}.cell.p1{background:radial-gradient(circle at 32% 25%,#fffef5,#daceaf 65%,#a99677);border:1px solid #beac8e;box-shadow:1px 5px 5px #344a3933}.cell.p2{background:radial-gradient(circle at 32% 25%,#90b8a7,#367c6a 60%,#1e5144);border:1px solid #376f60;box-shadow:1px 5px 5px #344a3944}.cell.selected{outline:3px solid #bd6c3e;outline-offset:2px}.cell.blocked::after{content:'·';font-size:28px;color:#566d55}.cell.p1.blocked::after,.cell.p2.blocked::after{content:'•';color:#fff8;font-size:15px}.cell.hint{outline:3px solid #bd6c3e;outline-offset:2px}.layer:nth-child(2) .grid{max-width:200px}.layer:nth-child(3) .grid{max-width:130px}.layer:nth-child(4) .grid{max-width:65px}.legend{display:flex;gap:15px;font-size:10px;color:#75836f;margin-bottom:0;flex-wrap:wrap}details{margin:24px 0;border-top:1px solid #c8ccbd;border-bottom:1px solid #c8ccbd;padding:19px 0}summary{cursor:pointer;font:21px Georgia}.guide{max-width:800px;font-size:14px;line-height:1.75}.guide a,a{color:#376c59}footer{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#7b8377;padding-bottom:20px}footer a{letter-spacing:0}@media(max-width:700px){main{padding:16px}.hero{padding:28px 0 18px}h1{font-size:60px}.sculpture{display:none}.toolbar{flex-wrap:wrap}.toolbar label{flex:1;min-width:145px}.toolbar button{width:100%}.table{grid-template-columns:1fr}.rail{border-right:0;border-bottom:1px solid #c7cebf;padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.player{padding:0}.player strong{font-size:32px}.action{grid-column:1/-1;display:flex;flex-wrap:wrap;margin:4px 0}.action button{flex:1;padding:9px}#tip{grid-column:1/-1;margin:0}.record{grid-column:1/-1;margin:0}.play{padding:16px}#layers{gap:8px}.layer{padding:9px}.grid{gap:5px}.layer h2{font-size:9px;letter-spacing:1px}.brand span{font-size:8px;margin-left:8px}.turnline{font-size:11px}footer{font-size:8px;gap:10px}}
@media(max-width:700px){.toolbar{display:grid;grid-template-columns:1fr;gap:10px}.toolbar label{min-width:0}.toolbar select{width:100%;min-width:0}.hero{padding-top:18px}.hero h1{font-size:52px}.intro{font-size:14px}.eyebrow{font-size:9px;letter-spacing:2px}}