@font-face{font-family:Plex;src:url("assets/fonts/IBMPlexSansJP-Regular.ttf");font-weight:400;font-display:swap}@font-face{font-family:Plex;src:url("assets/fonts/IBMPlexSansJP-Bold.ttf");font-weight:700;font-display:swap}
:root{--ink:#111;--paper:#f9f8f3;--line:#a9a9a6;--red:#f1380b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.55 Plex,"Hiragino Sans",sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:wait}[hidden]{display:none!important}.shell{max-width:1050px;margin:auto;padding:0 28px}.header{height:92px;border-bottom:1px solid #858585;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{text-decoration:none;color:inherit;font-size:21px;font-weight:700;white-space:nowrap}.brand-icon{font-size:28px;letter-spacing:-.25em;padding-right:12px}.review-badge{color:#666;font-size:11px}.eyebrow{font-size:15px;font-weight:700}.small{font-size:13px;color:#565656;line-height:1.7}.center{text-align:center}.primary,.outline{min-height:58px;border-radius:7px;padding:13px 22px;font-size:17px;font-weight:700}.primary{color:white;background:#101010;border:1px solid #101010;display:flex;align-items:center;justify-content:space-between;gap:28px}.primary:hover{background:#333}.outline{color:#111;background:transparent;border:1px solid #333}.outline:hover{background:#eee}.landing{padding:42px 0 72px}.landing-copy{max-width:780px;margin:auto}.landing h1{font-size:clamp(46px,7vw,79px);letter-spacing:-.065em;line-height:1.21;margin:26px 0 14px}.intro{font-size:clamp(18px,2.7vw,26px);line-height:1.6;margin:0 0 28px}.hero-art{height:410px;overflow:hidden;border:10px solid white;box-shadow:0 7px 25px #0002;transform:rotate(-2deg);margin:0 8px 28px;background:var(--red)}.theater{position:relative;width:100%;height:100%;background:radial-gradient(ellipse at 50% 12%,#ff6633,var(--red) 60%,#b5220a)}.curtain{position:absolute;inset:0 auto 0 0;width:18%;background:repeating-linear-gradient(88deg,#180b08 0 9px,#e43008 11px 17px,#130b09 20px 28px);clip-path:polygon(0 0,100% 0,70% 100%,0 100%)}.seats{position:absolute;inset:31% -5% -18% 11%;background:repeating-radial-gradient(ellipse at 20% 65%,#f7dec1 0 20px,#180f0e 22px 28px,#e64315 30px 39px,#1a0a09 40px 47px);transform:perspective(450px) rotateX(22deg) rotate(-4deg);border-top:7px solid #190a08}.hero-characters{position:absolute;left:34%;bottom:11%;display:flex;align-items:end;gap:12px;filter:drop-shadow(3px 8px 0 #100a08)}.triangle{display:block;width:82px;height:92px;background:#17893f;clip-path:polygon(0 100%,26% 0,100% 82%);position:relative}.triangle:after{content:"••";position:absolute;left:33%;top:46%;color:#fff1d3;font-size:30px;letter-spacing:3px;transform:rotate(-7deg)}.friend{display:block;width:70px;height:86px;background:#fae7c5;border-radius:48% 48% 30% 30%;position:relative}.friend:after{content:"⌣  ⌣";position:absolute;left:15px;top:25px;font-size:15px}.value-row{border-top:1px solid #888;margin:22px 0 23px}.value-row span{display:block;border-bottom:1px solid #aaa;padding:13px 4px;font-size:18px;font-weight:700}.landing .primary{width:100%;font-size:22px}.landing .small{margin:14px 0 0}
#wizard{max-width:760px;margin:auto;padding:35px 0 70px}.progress{display:flex;align-items:center;gap:18px;border-bottom:1px solid #777;padding-bottom:17px;font-size:13px;font-weight:700}.progress button{border:0;background:none;font-size:30px;padding:0 8px}.progress span:last-child{margin-left:auto}.question-top{display:flex;align-items:center;gap:24px;margin-top:32px}.question-top .eyebrow{border-bottom:1px solid;padding-bottom:6px}.peek{display:block;width:48px;height:50px;overflow:hidden;border-left:7px solid var(--red)}.triangle.tiny{width:39px;height:40px;margin-left:-10px}#questionTitle{font-size:clamp(34px,6vw,54px);line-height:1.25;letter-spacing:-.05em;margin:11px 0 7px}#questionHelp{font-size:17px;margin:0 0 30px}.step-panel{border-top:1px solid #aaa;padding:24px 0}.step-panel label:first-child,.step-panel legend{font-size:17px;font-weight:700;display:block;margin-bottom:10px}.field{display:block;margin:0 0 24px}.field>span:first-child{display:block;font-size:17px;font-weight:700;margin-bottom:9px}.field small{font-size:12px;font-weight:400;color:#666}.field input,.field select{width:100%;min-height:57px;padding:10px 14px;border:1px solid #999;background:#fff;border-radius:6px;font-size:18px;color:#111}.field input[type=number]{font-size:23px;font-weight:700}.field input:disabled{background:#eee;color:#777}.radio-line{display:flex;flex-wrap:wrap;gap:12px 21px;margin:10px 0 20px}.radio-line label{display:flex;align-items:center;gap:8px;font-size:16px}.radio-line input,.check-line input{accent-color:#111;width:22px;height:22px;flex:none}.check-line{display:flex;align-items:center;gap:10px;margin:12px 0;font-size:17px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:15px}.three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.hint{font-size:13px;color:#666}.mini-options{border:1px solid #aaa;padding:17px;margin:16px 0}.mini-options h3{font-size:17px;margin:0 0 12px}.mini-options .two-col{gap:12px}.mini-options label{font-size:14px}.mini-options select,.mini-options input{min-height:45px;font-size:15px}.remove-option{border:0;background:none;text-decoration:underline}.text-button{border:0;background:none;text-decoration:underline;font-size:15px;padding:10px}.step-actions{display:grid;gap:8px}.step-actions .primary{width:100%}#formError{background:#ffece4;border:1px solid var(--red);padding:12px}
#result{padding:40px 0 80px}.result-stage{background:var(--red);border:10px solid #fff;box-shadow:0 6px 20px #0002}.result-stage-copy{padding:30px 30px 8px}.stage-kicker{font-size:13px;font-weight:700}.result-stage h2{font-size:clamp(39px,7vw,73px);letter-spacing:-.06em;line-height:1.15;margin:6px 0 12px}.result-stage p{font-size:17px;font-weight:700;margin:0}.art-window{height:450px;position:relative;overflow:hidden}.art-window img{position:absolute;width:100%;height:auto;top:-36%;left:0}.result-note{font-size:12px;color:#555;margin:16px 0}.result-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 45px}.compare-section{border-top:2px solid #111;padding:35px 0}.compare-head h2{font-size:42px;line-height:1.2;margin:8px 0}.compare-head p{font-size:16px}.plan-card{background:#fff;border:1px solid #aaa;margin:13px 0;padding:20px 22px}.plan-card h3{font-size:24px;margin:3px 0}.plan-card .plan-meta{font-size:13px;color:#555}.plan-card .price{font-size:27px;font-weight:700;margin:8px 0}.plan-card .price small{font-size:12px;font-weight:400}.plan-card .status{font-weight:700;color:#8e310e}.plan-card p{margin:6px 0;font-size:14px}.plan-card ul{padding-left:1.2em;margin:8px 0;font-size:13px}.plan-card a{font-weight:700;color:#161616;text-underline-offset:3px}.plan-card.incompatible{opacity:.78}.current-card{border:2px solid #111}.comparison-note{background:#f1eee8;padding:17px;font-size:14px}.compare-section>.small{margin-top:24px}footer{border-top:1px solid #aaa;padding:25px 0;color:#666;font-size:12px}
dialog{border:0;border-radius:8px;padding:0;width:min(580px,calc(100vw - 24px));max-height:calc(100vh - 25px);overflow:auto}dialog::backdrop{background:#0009}.dialog-content{padding:24px}.dialog-close{float:right;border:0;background:none;font-size:30px}.dialog-content h2{font-size:25px}.dialog-content p{font-size:14px}.dialog-content img{display:block;max-width:280px;max-height:390px;object-fit:contain;margin:18px auto;box-shadow:0 4px 16px #0002}.dialog-actions{display:flex;gap:9px}.dialog-actions>*{flex:1;font-size:14px}
@media(max-width:600px){.shell{padding:0 18px}.header{height:68px}.brand{font-size:15px}.brand-icon{font-size:20px}.review-badge{font-size:9px}.landing{padding-top:28px}.landing h1{margin-top:13px}.hero-art{height:290px;margin:0 2px 25px}.hero-characters{left:29%}.value-row span{font-size:14px}.landing .primary{font-size:17px}.two-col,.three-col{grid-template-columns:1fr}.question-help{font-size:15px}.art-window{height:300px}.art-window img{top:-25%}.result-stage-copy{padding:22px 18px 5px}.result-stage p{font-size:13px}.result-actions>*{width:100%}.compare-head h2{font-size:34px}.dialog-actions{display:grid;grid-template-columns:1fr 1fr}}

.hero-art{position:relative}.hero-art img{display:block;width:100%;height:auto;transform:translateY(-34%)}.art-window img{top:0;transform:translateY(-45%)}

.mobile-break{display:none}.art-window{height:530px}.art-window img{width:160%;left:-30%;transform:translateY(-53%)}@media(max-width:600px){.mobile-break{display:block}.landing h1{font-size:45px}.hero-art img{width:130%;max-width:none;margin-left:-15%;transform:translateY(-37%)}.art-window{height:300px}}

.art-window.unknown{height:300px}.art-window.unknown img{width:130%;left:-15%;transform:translateY(-37%)}@media(max-width:600px){.art-window.unknown{height:230px}}
.triangle.tiny:after{content:'● ●';left:17px;top:15px;font-size:6px;letter-spacing:1px;transform:none;color:#fff4d7}

/* モック原画の小さなカメオだけを表示。質問文・入力欄はHTMLのまま。 */
.cameo{display:inline-block;flex:none;pointer-events:none;background-repeat:no-repeat;background-size:426.5px 922px;image-rendering:auto}
.cameo-contract{width:49px;height:68px;background-image:url("assets/art/cameo-contract-source.png");background-position:-114px -76px}
.cameo-calls{width:65px;height:69px;background-image:url("assets/art/cameo-calls-source.png");background-position:-101px -107px}
.cameo-profile{width:67px;height:72px;background-image:url("assets/art/cameo-profile-source.png");background-position:-149px -96px}
.question-top{gap:12px;min-height:74px;align-items:center}

@media(min-width:801px){#wizard[data-step="5"] #questionTitle{font-size:42px}}
footer a{color:#111;text-underline-offset:2px}
#openUsageGuide{width:100%;font-size:15px;text-align:left;line-height:1.4}
#guide{max-width:760px;margin:auto;padding:48px 0 80px}
#guide h2{font-size:clamp(31px,6vw,48px);line-height:1.2;margin:8px 0 20px}
#guideText{font-size:17px}
#guideBack{margin:18px 0 24px}
#guideLinks details{border-top:1px solid #aaa;padding:14px 0}
#guideLinks details:last-child{border-bottom:1px solid #aaa}
#guideLinks summary{cursor:pointer;font-weight:700}
#guideLinks p{font-size:14px;margin:10px 0}

/* v6 UX: keep the primary result action tied to the comparison below. */
#compareSection{scroll-margin-top:16px}.start-note{max-width:54ch;margin-inline:auto}.result-actions .text-button{align-self:center}

/* Keep the complete result artwork, including its embedded text, in view. */
.art-window,.art-window.unknown{height:auto;max-width:480px;margin-inline:auto}
.art-window img,.art-window.unknown img{position:static;display:block;width:100%;height:auto;left:auto;top:auto;transform:none}