@charset "UTF-8";
:root{--paper:#f9f8f2;--white:#fffefa;--ink:#284a3e;--muted:#7c8177;--line:#e5e7dc;--green:#2b503f;--orange:#e68f65;--body-font:"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body-font);font-size:14px;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default}button,input,textarea{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #9f774b}button{color:inherit}svg.icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.site-header{height:102px;max-width:1256px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 48px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:10px;align-items:center;font-size:27px;font-weight:800;letter-spacing:-1.5px;text-decoration:none;color:var(--ink)}.brand-logo{width:37px;height:37px}.brand-dot{color:var(--orange);padding-left:1px}.help-button{display:flex;align-items:center;gap:8px;background:none;border:0;font-size:12px;font-weight:600;padding:10px 0 10px 14px}.help-icon{display:inline-flex;align-items:center;justify-content:center;border:1.3px solid #6d7b6b;width:18px;height:18px;border-radius:50%;font-size:11px}.help-button:hover{color:#ae623f}main{max-width:1160px;margin:0 auto;padding:0 32px}.intro{text-align:center;padding:45px 0 34px}.eyebrow{font-size:11px;letter-spacing:1.1px;display:flex;justify-content:center;align-items:center;gap:8px}.eyebrow>span{width:6px;height:6px;border-radius:50%;background:var(--orange)}h1{margin:16px 0 17px;font-size:43px;font-weight:800;letter-spacing:1px;line-height:1.6}.title-accent{position:relative;display:inline-block}.title-accent svg{position:absolute;left:0;bottom:-4px;width:100%;height:12px;fill:none;stroke:#edb46d;stroke-width:6;stroke-linecap:round;z-index:-1}.intro p{font-size:12px;color:#747d72;line-height:1.95;letter-spacing:.3px;margin:0}.mobile-break{display:none}.app-layout{display:grid;grid-template-columns:minmax(0,1.21fr) minmax(0,1fr);gap:56px;align-items:start;max-width:1020px;margin:0 auto}.wheel-panel{text-align:center;position:relative;padding:4px 0 0}.wheel-heading{font-size:12px;letter-spacing:1px;display:flex;justify-content:center;align-items:center;gap:17px}.mini-spark{font-size:13px;color:#cba263}.wheel-stage{position:relative;width:100%;max-width:478px;margin:9px auto 0;aspect-ratio:1}.wheel-stage>svg{width:100%;height:100%;display:block;overflow:visible}.pointer{position:absolute;width:33px;height:39px;top:0;left:50%;transform:translateX(-50%);z-index:2;filter:drop-shadow(0 3px 1px #00000012)}.pointer svg{width:100%;height:100%;fill:var(--ink);stroke:var(--white);stroke-width:2}.decoration{position:absolute;z-index:1;color:#e1b367}.star-one{font-size:32px;left:3%;top:10%;transform:rotate(13deg)}.star-two{font-size:37px;right:0;bottom:13%;color:#97ab8e}.dot-one{height:7px;width:7px;border-radius:50%;background:#efb09b;left:1%;bottom:22%}.spin-controls{max-width:326px;margin:10px auto 0}.spin-button{display:flex;justify-content:space-between;align-items:center;gap:14px;width:100%;height:60px;padding:0 27px;color:#fffef8;background:var(--green);border:1px solid var(--green);border-radius:14px;font-size:18px;font-weight:700;letter-spacing:2px;box-shadow:0 4px 0 #203c30;transition:background .2s,transform .2s,box-shadow .2s}.spin-button:hover:not(:disabled){background:#38624d;transform:translateY(-2px);box-shadow:0 6px 0 #203c30}.spin-button:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 #203c30}.spin-button:disabled{background:#a2afa4;border-color:#a2afa4;box-shadow:0 4px 0 #89998a}.spin-button.spinning{background:var(--green);border-color:var(--green)}.spin-button.spinning>.icon:first-child{animation:turn 2s linear infinite}.spin-button .icon:first-child{width:24px;height:24px}.spin-hint{font-size:10px;color:var(--muted);margin:15px 0 18px;letter-spacing:.3px}.result-card{min-height:80px;padding:16px 20px;border:1px dashed #d6d9c9;border-radius:13px;display:flex;align-items:center;text-align:left;gap:15px;max-width:396px;margin:0 auto;transition:background .3s,border .3s}.result-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#eeefe4;border-radius:50%;font-size:27px;color:#8f9c7c;flex:none}.result-caption{font-size:9px;letter-spacing:1px;color:#838a78}.result-card p{font-size:13px;margin:5px 0 0;overflow-wrap:anywhere;line-height:1.5}.result-card.has-result{background:#f0f1dd;border:1px solid #dce2bb}.has-result .result-icon{background:#e2e8c6;color:#627741}.has-result p{font-size:19px;font-weight:700}.editor-panel{padding:27px 27px 0;background:var(--white);border:1px solid #e5e6dc;border-radius:21px;box-shadow:0 8px 25px #404a3010;position:relative;margin-top:5px;overflow:hidden}.editor-heading{display:flex;align-items:center;justify-content:space-between}.section-step{font-size:9px;letter-spacing:1.6px;color:#899380;font-weight:600}h2{font-size:19px;margin:9px 0 0;font-weight:700;letter-spacing:.4px}.count{display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;margin-left:8px;min-width:27px;height:25px;padding:0 7px;border-radius:8px;background:#edf0e4;color:#758266;font-size:12px;letter-spacing:0;font-weight:600}.pencil-mark{font-family:Georgia,serif;font-size:38px;color:#c4bd9b;transform:rotate(-13deg);margin-right:3px}.editor-description{font-size:11px;color:var(--muted);margin:13px 0 21px;letter-spacing:.1px}.add-form{display:flex;gap:8px;align-items:stretch}.add-form input{width:0;flex:1;min-width:0;border:1px solid #dedfd4;border-radius:9px;background:#fffefb;padding:12px 11px;font-size:11px;height:45px;color:var(--ink)}input::placeholder,textarea::placeholder{color:#a4a79c}input:disabled{opacity:.65}.add-button{width:45px;flex:none;background:var(--green);color:#fffefa;border:0;border-radius:9px;display:flex;align-items:center;justify-content:center;transition:background .2s}.add-button:hover:not(:disabled){background:#3e6951}.add-button:disabled{background:#bcc5b8}.list-toolbar{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#959a8a;margin:24px 0 10px}.text-button{font-size:10px;border:0;background:none;padding:4px 0;text-underline-offset:3px}.text-button:hover:not(:disabled){text-decoration:underline}.text-button:disabled{opacity:.4}.list-toolbar .text-button{color:#7c8d74;font-size:10px}.list-toolbar .text-button span{font-size:13px;margin-left:3px}.item-list{list-style:none;margin:0;padding:0;max-height:392px;min-height:166px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#d8dfcf transparent}.item-row{display:flex;align-items:center;gap:11px;border:1px solid #e7e8df;border-radius:9px;min-height:43px;padding:0 8px 0 12px;margin:0 0 7px;background:#fffefb}.item-swatch{width:10px;height:10px;border-radius:3px;flex:none}.item-name{min-width:0;flex:1;width:0;background:transparent;border:1px solid transparent;padding:8px 2px;font-size:12px;color:#425141;font-weight:500;border-radius:3px;text-overflow:ellipsis}.item-name:hover:not(:disabled){border-bottom-color:#d5dacb}.item-name:focus{border-color:#bec9b4;outline:none;background:white}.delete-button{border:0;background:none;width:30px;height:34px;color:#a6ac9e;display:flex;align-items:center;justify-content:center;flex:none;border-radius:5px}.delete-button .icon{width:16px;height:16px;stroke-width:1.6}.delete-button:hover:not(:disabled){background:#f9ebe5;color:#a96b56}.delete-button:disabled{opacity:.4}.editor-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:13px 0 20px;margin-top:5px}.probability{font-size:9px;color:#8d9584;display:flex;align-items:center;gap:6px}.equal-sign{border:1px solid #a5b393;width:14px;height:14px;line-height:11px;text-align:center;border-radius:50%;color:#8b9b77;font-size:11px}.reset-button{font-size:9px;color:#979b8e}.little-note{display:flex;align-items:center;justify-content:center;gap:6px;margin:0 -27px;background:#f5f6ee;border-top:1px solid #e8eadf;font-size:9px;color:#909b85;padding:14px 10px}.little-note .icon{width:13px;height:13px;stroke-width:1.5}.list-empty{font-size:12px;color:var(--muted);line-height:2;text-align:center;padding:38px 0}.how-it-works{max-width:1020px;margin:40px auto 0;padding:23px 28px;display:flex;align-items:center;justify-content:center;gap:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.how-label{font-size:10px;color:#9c9e90}.how-it-works>div{display:flex;align-items:center;gap:10px;font-size:10px;color:#79846d;white-space:nowrap}.step-number{display:inline-flex;align-items:center;justify-content:center;background:#eeeee3;color:#7b8a6c;border-radius:50%;width:22px;height:22px;font-family:Georgia,serif;font-size:12px;font-style:italic}.step-arrow{padding:0 12px;color:#c1c5b2}.tiny-star{font-size:18px;color:#c9a66f;margin-left:10px}.site-footer{max-width:1160px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:23px 32px 28px;font-size:9px;color:#a2a797;letter-spacing:.2px}.site-footer>span:last-child{font-family:Georgia,serif;font-style:italic;font-size:11px;letter-spacing:.3px}.site-footer>span:last-child>span{color:#b3baa1;font-style:normal;font-size:17px;margin-left:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}dialog{border:1px solid var(--line);border-radius:19px;padding:26px;background:var(--white);color:var(--ink);width:min(480px,calc(100% - 32px));box-shadow:0 22px 80px #233a3530}dialog::backdrop{background:#263c3459;backdrop-filter:blur(4px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.dialog-heading h2{font-size:18px;margin:0;line-height:1.6}.icon-button{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border:0;background:#eff0e7;border-radius:50%;flex:none}.icon-button:hover{background:#e6e9da}.help-steps{padding-left:24px;line-height:1.7}.help-steps li{padding-left:5px;margin-bottom:19px}.help-steps li::marker{color:#b68d55;font-weight:700}.help-steps strong{font-size:14px}.help-steps p,.dialog-note{color:#7c8575;font-size:12px;line-height:1.9}.help-steps p{margin:6px 0}.dialog-note{margin:0 0 20px}.primary-button,.secondary-button{border-radius:9px;padding:13px 18px;border:1px solid var(--green);font-size:13px;font-weight:600;min-height:44px}.primary-button{background:var(--green);color:#fffef8}.primary-button:hover{background:#3b634c}.secondary-button{background:transparent;border-color:#d7ddcc}.full-width{width:100%}textarea{border:1px solid #d7ddcc;background:#fffefb;color:var(--ink);width:100%;padding:12px;border-radius:8px;line-height:1.8;resize:vertical}.dialog-actions{display:flex;justify-content:flex-end;gap:9px}.field-error{font-size:12px;color:#ad5c42;line-height:1.7}.empty-wheel{position:absolute;inset:17%;display:flex;flex-direction:column;justify-content:center;align-items:center;border:2px dashed #d4dbc8;border-radius:50%;background:#f5f5ea}.empty-wheel>span{font-size:40px;color:#b6bf9d;margin-bottom:14px}.empty-wheel strong{font-size:18px}.empty-wheel p{font-size:11px;color:var(--muted);line-height:1.9;margin-top:12px}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);background:var(--ink);color:white;font-size:12px;padding:13px 20px;border-radius:10px;z-index:20;box-shadow:0 5px 20px #0002;line-height:1.6}.confetti-layer{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:25}.confetti-piece{position:absolute;top:-20px;width:8px;height:13px;border-radius:2px;animation:confetti-fall var(--duration) var(--delay) cubic-bezier(.12,.65,.52,1) both}.result-card.celebrate{animation:result-pop .55s ease-out}@keyframes turn{to{transform:rotate(360deg)}}@keyframes confetti-fall{0%{transform:translateY(-20px) rotate(0);opacity:0}8%{opacity:1}85%{opacity:1}100%{transform:translate(var(--drift),100vh) rotate(var(--rotation));opacity:0}}@keyframes result-pop{0%{transform:scale(.97)}50%{transform:scale(1.025)}100%{transform:scale(1)}}
@media(min-width:1400px){.intro{padding-top:52px;padding-bottom:42px}.app-layout{gap:70px}.wheel-stage{max-width:485px}.how-it-works{margin-top:42px}}
@media(max-width:900px){.site-header{padding:0 32px;height:88px}.app-layout{gap:28px;grid-template-columns:1.05fr 1fr}.editor-panel{padding:23px 20px 0}.little-note{margin-left:-20px;margin-right:-20px;font-size:8px}.intro{padding-top:35px}.intro h1{font-size:37px}.wheel-stage{margin-top:18px}.spin-controls{max-width:290px}.result-card{max-width:330px}.how-it-works{gap:20px;padding-left:0;padding-right:0}.step-arrow{padding:0 5px}.item-name{font-size:11px}.editor-description{font-size:10px}.add-form input{font-size:10px;padding-left:9px}.editor-bottom{flex-wrap:wrap}.probability{font-size:8px}.site-footer{padding-top:20px}}
@media(max-width:680px){.site-header{height:75px;margin:0 20px;padding:0}.brand{font-size:23px;gap:8px}.brand-logo{width:31px;height:31px}.help-button{font-size:11px}main{padding:0 21px}.intro{padding:29px 0 24px}.eyebrow{font-size:9px;letter-spacing:.8px}h1,.intro h1{font-size:30px;letter-spacing:0;margin:13px 0 17px}.intro p{font-size:10px;line-height:2}.mobile-break{display:block}.app-layout{display:flex;flex-direction:column;gap:26px;max-width:440px}.wheel-panel{width:100%;padding-top:0}.wheel-heading{font-size:10px}.wheel-stage{width:min(100%,380px);margin-top:10px}.pointer{width:29px;height:35px}.spin-controls{max-width:300px;margin-top:8px}.spin-button{height:55px;font-size:16px;border-radius:12px}.spin-hint{font-size:9px;margin:13px 0 15px}.result-card{max-width:340px;min-height:72px;padding:13px 16px}.result-card p{font-size:12px}.has-result p{font-size:18px}.result-caption{font-size:9px}.result-icon{width:35px;height:35px;font-size:25px}.editor-panel{width:100%;margin-top:0;padding:24px 22px 0;border-radius:17px}.section-step{font-size:9px}.editor-heading h2{font-size:19px}.editor-description{font-size:11px;margin-bottom:18px}.add-form input{font-size:11px;height:46px}.add-button{width:46px}.item-list{max-height:350px;min-height:80px}.item-row{min-height:45px;margin-bottom:8px}.item-name{font-size:12px;min-height:43px}.delete-button{height:42px;width:40px}.little-note{margin-left:-22px;margin-right:-22px;font-size:9px}.editor-bottom{padding-bottom:18px}.probability{font-size:9px}.list-toolbar{margin-top:21px}.how-it-works{margin-top:27px;padding:21px 0;flex-direction:column;gap:15px}.how-it-works>div{font-size:9px;gap:6px}.how-label{font-size:10px}.step-arrow{padding:0 4px}.step-number{width:20px;height:20px}.tiny-star{margin-left:0;font-size:14px}.site-footer{padding:20px 22px 25px;justify-content:center}.site-footer>span:first-child{font-size:9px}.site-footer>span:last-child{display:none}.decoration.star-one{font-size:25px}.decoration.star-two{font-size:30px}dialog{padding:23px}.dialog-heading h2{font-size:16px}}
@media(max-width:680px){.add-form input,.item-name,textarea{font-size:16px}.add-form input::placeholder{font-size:11px}}
.header-actions{display:flex;align-items:center;gap:20px}.sound-button{display:flex;align-items:center;gap:7px;min-height:38px;padding:7px 11px;border:1px solid #dce2d2;border-radius:9px;background:#f0f3e8;font-size:11px;font-weight:600;white-space:nowrap}.sound-button .icon{width:18px;height:18px;stroke-width:1.6}.sound-button:hover{background:#e6ecd9}.sound-button[aria-pressed="false"]{background:transparent;color:#8b9583}.header-actions .help-button{padding-left:0}@media(max-width:680px){.header-actions{gap:13px}.sound-button{font-size:10px;padding:7px 9px;gap:5px;min-height:37px}.sound-button .icon{width:17px;height:17px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.spin-button{transition:none}}
