*{box-sizing:border-box} :root{color-scheme:light;--ink:#222c2d;--muted:#66706d;--gold:#a77736;--line:#d8d7d0}body{margin:0;background:#f5f4ef;color:var(--ink);font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;font-size:16px}button,input{font:inherit}button,a,input,summary{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid var(--line);color:inherit;background:transparent;min-height:46px;border-radius:5px}button:hover:not(:disabled){border-color:#8d6839;background:#e9e5db}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible,summary:focus-visible{outline:3px solid #b77d32;outline-offset:4px}button:disabled{opacity:.4;cursor:default}header{max-width:1320px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:24px 42px;border-bottom:1px solid var(--line)}header a{font-family:serif;font-size:20px;letter-spacing:.16em;color:inherit;text-decoration:none}header span{font-size:14px;color:var(--muted)}main{max-width:1220px;margin:auto;padding:34px 32px 0}.intro{margin-bottom:30px}.eyebrow{font-size:12px;letter-spacing:.2em;color:#8b6635;margin:0 0 12px}h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:36px;font-weight:500;letter-spacing:.12em;margin:0}h1 span{display:inline-block;font-family:sans-serif;font-size:12px;letter-spacing:.14em;color:var(--muted);margin-left:18px}.intro-lead{font-size:16px;color:var(--muted);line-height:1.85;margin:16px 0 0}.wallpaper-note{font-size:15px;font-weight:600;line-height:1.7;margin:10px 0 0;color:#5b482d}.start-button{display:inline-flex;align-items:center;justify-content:center;margin-top:18px;min-width:150px;min-height:48px;padding:0 24px;border-radius:5px;background:#203c3e;border:1px solid #203c3e;color:#fff;text-decoration:none;letter-spacing:.08em}.start-button:hover{background:#315453}.start-button:focus-visible{outline:3px solid #b77d32;outline-offset:4px}.workspace{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);gap:44px}.stage{position:relative;background:#10272b;aspect-ratio:1;border-radius:8px;overflow:hidden;box-shadow:0 18px 45px #20363618}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}#hint{pointer-events:none;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#f1e5ca;background:#071f2520;text-shadow:0 2px 8px #000;font-size:17px}#hint span{margin-top:64%;background:#0b242cdc;padding:12px 18px;border-radius:5px}#hint small{font-size:14px;margin-top:8px}.corner{position:absolute;top:28px;right:24px;writing-mode:vertical-rl;font-family:serif;letter-spacing:.4em;color:#dbbb7880;font-size:14px;pointer-events:none}.stage-bottom{position:absolute;bottom:20px;left:24px;right:24px;display:flex;justify-content:space-between;color:#cbbd9b;font-size:13px;pointer-events:none;letter-spacing:.08em}.canvas-tools{display:flex;align-items:center;gap:10px;padding-top:15px}.canvas-tools button{padding:0 17px;font-size:14px}.canvas-tools>span{font-size:13px;color:var(--muted);margin-left:auto}aside{padding-top:3px}.control-group{margin-bottom:29px}h2{font-size:17px;font-weight:500;margin:0 0 14px}h2>span{font-family:Georgia,serif;color:#9f793e;font-size:14px;margin-right:10px}.choices{display:flex;gap:8px}.choices button{flex:1;font-size:15px;min-height:49px}.choices button.active{background:#e6e0d1;border-color:#9e8155;color:#68491f}.note{font-size:13px;color:var(--muted);line-height:1.7;margin:9px 0 0}.colors button{font-size:14px}.colors i{display:inline-block;width:13px;height:13px;border-radius:50%;margin-right:6px;vertical-align:-1px}.gold{background:#bb9454}.silver{background:#8d9da4}.ink{background:#223435}input{width:100%;border:0;border-bottom:1px solid #a7aaa2;background:transparent;padding:12px 0;font-family:serif;font-size:23px;color:var(--ink);border-radius:0}.name-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:7px}.name-tools span{color:var(--muted);font-size:12px}.name-tools button{border:0;font-size:13px;text-decoration:underline;min-height:36px;padding:0}.finish{display:grid;gap:10px}.primary{background:#203c3e;color:white;border-color:#203c3e;min-height:54px;letter-spacing:.08em}.primary:hover:not(:disabled){background:#315453;color:white}.secondary{min-height:49px;background:#fff8}.secondary span{float:right;margin-right:14px}.finish p{font-size:12px;color:var(--muted);text-align:center;line-height:1.8;margin:0}.how{border-top:1px solid var(--line);margin-top:23px;padding-top:18px}h3{font-size:15px;margin:0 0 8px;font-weight:500}.how p,.how summary{font-size:13px;color:var(--muted);line-height:1.9;margin:0}.how details{margin-top:8px}footer{display:flex;justify-content:space-between;align-items:center;gap:22px;border-top:1px solid var(--line);margin-top:38px;padding:20px 0 25px;color:var(--muted);font-size:12px;line-height:1.8}footer span{white-space:nowrap;font-family:serif}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#173536;color:white;padding:13px 22px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90vw;font-size:14px;z-index:10}#toast.visible{opacity:1}@media(max-width:800px){header{padding:18px 20px}header span{display:none}main{padding:25px 18px 0}.intro{margin-bottom:22px}h1{font-size:clamp(20px,6.2vw,29px);line-height:1.35;letter-spacing:.05em;white-space:nowrap}h1 span{display:block;font-size:10px;letter-spacing:.14em;margin:7px 0 0;white-space:normal}.intro-lead{font-size:14px;margin-top:12px}.wallpaper-note{font-size:14px}.start-button{width:100%;margin-top:16px}.workspace{grid-template-columns:1fr;gap:28px}.stage{max-width:620px;margin:auto}.canvas-tools>span{font-size:12px}.canvas-tools button{padding:0 12px}aside{display:grid;grid-template-columns:1fr 1fr;gap:20px}.control-group{margin:0}.naming,.finish,.how{grid-column:1/-1}.how{margin-top:0}.choices{gap:5px}.choices button{font-size:14px}.colors button{font-size:12px}.colors i{width:10px;height:10px;margin-right:3px}footer{display:block}#hint{font-size:15px}.corner{top:22px;right:18px}}@media(max-width:380px){aside{display:block}.control-group{margin-bottom:24px}.canvas-tools>span{display:none}h1 span{display:block;margin:7px 0 0}}
.lapis{background:linear-gradient(135deg,#58d8d2 0 50%,#efc46a 50%)}.lotus{background:linear-gradient(135deg,#ff719e 0 50%,#ffc76f 50%)}.kohaku{background:linear-gradient(135deg,#e8a54f 0 50%,#f5d98a 50%)}.finish-effects button{min-height:58px;padding:7px 6px;font-size:13px;line-height:1.35}.finish-effects button.active{background:#253f40;border-color:#253f40;color:#fff;box-shadow:inset 0 0 0 2px #d6b66f}.secondary.working{cursor:wait;opacity:.72}.naming input[readonly]{cursor:default}.naming.named input{color:#8a5d20;border-bottom-color:#a77736}.name-button{display:block;width:100%;min-height:54px;margin-top:12px;padding:10px 18px;background:#a77736;border-color:#8d642e;color:#fff;font-weight:600;letter-spacing:.06em;box-shadow:0 5px 14px #79551f26}.name-button:hover:not(:disabled){background:#865d29;border-color:#704b20;color:#fff}.name-button:disabled{opacity:.48}.rare-note{font-size:11px;color:var(--muted);margin:7px 0 0;text-align:center}

canvas.locked{cursor:default}.stage.completed:after{content:'完成作品';position:absolute;top:18px;left:20px;padding:6px 10px;border:1px solid #e6d2a566;border-radius:999px;background:#0d2529bb;color:#ead7ab;font-family:"Yu Mincho",serif;font-size:12px;letter-spacing:.12em;pointer-events:none}.stage.completed canvas{pointer-events:none}.control-group button:disabled.active{opacity:.68}

.completion-lock-note{font-size:12px;color:var(--muted);margin:8px 0 0;text-align:center;line-height:1.7}