*{box-sizing:border-box}body{margin:0;background:#f6eedf;color:#4f4737;font-family:"Hiragino Maru Gothic ProN",system-ui,sans-serif;background-image:radial-gradient(#cfbf9b55 1px,transparent 1px);background-size:20px 20px}header{display:flex;justify-content:space-between;align-items:center;padding:20px 6vw;border-bottom:1px solid #d5c7aa;font-size:12px}a{color:#6e8262;font-weight:800}button{font:inherit;font-weight:800;padding:12px 20px;border:1px solid #bcad89;border-radius:14px;background:#fffcf4;color:#554936;cursor:pointer}button:disabled{opacity:.4}button:active{transform:translateY(1px)}.primary{background:#e7b44c;border-color:#bb8b32;color:#493919;touch-action:none;user-select:none}main{max-width:1100px;margin:50px auto;display:grid;grid-template-columns:.8fr 1.2fr;gap:55px;padding:0 25px}.intro{padding-top:35px}.intro small{letter-spacing:.18em;font-size:10px;color:#8a8f72}h1{font-size:65px;letter-spacing:.06em;margin:18px 0;color:#656345}h1 span{color:#b69249}.intro>p{font-size:17px;line-height:2}details{margin-top:40px;font-size:13px;line-height:1.9;padding:18px;border:1px solid #d1c4a7;border-radius:12px;background:#fff9ec}summary{cursor:pointer;font-weight:800}#record{margin-top:20px;font-size:13px;line-height:2;color:#7d795c}.studio{padding:25px;background:#fffaf0;border:2px solid #d7c5a2;border-radius:28px;box-shadow:0 12px 0 #d6c6a755}.step{display:flex;gap:14px;align-items:center;font-size:13px}.step span{color:#ad996e;font-size:10px}.step button{margin-left:auto;padding:6px 10px;font-size:10px}canvas{display:block;width:100%;height:320px;touch-action:none}#hint{min-height:50px;font-size:13px;text-align:center;line-height:1.8;color:#7e7055}#controls{display:grid;gap:12px}input{width:100%;accent-color:#d69b35}.heat-labels{display:flex;justify-content:space-between;font-size:12px}.heat-labels span{margin:8px}#result{text-align:center}#score{font-size:60px;color:#ad8934;font-weight:900}#comment{font-size:14px;line-height:1.9}#parts{display:grid;grid-template-columns:repeat(4,1fr);font-size:11px;gap:6px;margin:20px 0}#parts span{background:#ede8d5;padding:12px 3px;border-radius:12px}#parts b{display:block;font-size:20px}footer{text-align:center;font-size:11px;color:#9c9278;padding:20px}[hidden]{display:none!important}@media(max-width:700px){main{grid-template-columns:1fr;gap:20px;margin:18px auto;padding:0 14px}.intro{padding:0}.intro h1{font-size:37px;margin:8px 0}.intro>p{font-size:13px;margin:6px 0}details{margin-top:12px;padding:10px}.studio{padding:18px}canvas{height:280px}header{padding:13px 20px}#record{margin-top:8px}}

main{max-width:1220px;grid-template-columns:.68fr 1.32fr;gap:40px;margin:35px auto}.studio{background:linear-gradient(155deg,#fffdf5,#f9efd9);box-shadow:0 15px 35px #7b67431c,0 8px 0 #d5c29755}.studio canvas{height:380px;max-height:45dvh;min-height:280px}.process-strip{display:flex;gap:4px;margin:17px 0 0;justify-content:space-between}.process-strip span{font-size:10px;padding:7px 5px;border-radius:7px;color:#a99b7d;background:#eee6d6;flex:1;text-align:center}.process-strip span.active{background:#e3b455;color:#493719;font-weight:900}.process-strip span.done{background:#dce4ce;color:#64704a}.observation{padding:13px 18px;background:#fffcf5;border:1px solid #dbcba8;border-radius:15px;min-height:95px}.observation>span{display:block;font-size:10px;color:#a58c5c;letter-spacing:.1em;margin-bottom:5px}.observation strong{display:block;font-size:16px;color:#655539}.visual-progress{height:6px;border-radius:8px;background:#eee7d8;margin:10px 0 7px;overflow:hidden}.visual-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#b6c18a,#e1b74d);transition:width .15s}.observation small{font-size:11px;color:#988970}#hint{min-height:0;margin:13px 0}.primary{min-height:50px}.intro details{margin-top:25px}@media(max-width:700px){main{display:block;margin:15px auto}.intro{margin-bottom:20px}.studio{padding:15px}.studio canvas{height:320px;max-height:none;min-height:280px}.process-strip span{font-size:8px;padding:6px 2px}.observation strong{font-size:14px}}

#hint,.observation{display:none!important}.judge-label{display:block;margin:12px auto;color:#9c552d;font-weight:900;font-size:13px}.review-note{font-size:12px!important;line-height:1.8!important;color:#958366}.process-strip{margin-bottom:8px}