:root{--paper:#f6f5f1;--ink:#243751;--muted:#8794a4;--lime:#d9f4a0;--border:#dfe4e9}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;touch-action:manipulation;background:#e6e9ec;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;-webkit-font-smoothing:antialiased}
button,a{touch-action:manipulation}
button,.home-screen,.game-screen,.choice-sheet,.gallery-screen,.publish-dialog,.article-toolbar,.article-bottom-bar,.replay-link{-webkit-user-select:none;user-select:none}
button,.choice-options{-webkit-touch-callout:none}
input,textarea{-webkit-user-select:text;user-select:text}
button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #93afdb;outline-offset:2px}
.is-hidden{display:none!important}.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.app-shell{position:relative;width:100%;max-width:480px;min-height:100dvh;margin:auto;background:var(--paper);box-shadow:0 12px 60px #14223a12}
.screen{min-height:100dvh}

.home-inner{min-height:100dvh;display:flex;flex-direction:column;padding:27px 26px max(25px,env(safe-area-inset-bottom))}
.brandline{display:flex;align-items:center;gap:8px;font-size:17px;letter-spacing:-.06em;font-weight:900}.accent-dot{color:#89a94c}
.home-content{flex:1;display:flex;flex-direction:column;justify-content:center;padding:24px 0 12px}.overline{margin:0 0 16px;color:#8390a1;font-size:10px;font-weight:900;letter-spacing:.15em}
.home-content h1{font-size:clamp(32px,8.4vw,45px);letter-spacing:-.085em;line-height:1.4;margin:0 0 15px;font-weight:900}.home-content h1 span{color:#7b9473}
.home-lead{font-size:12.2px;font-weight:650;line-height:2;color:#64738a;margin:0 0 30px}
.home-chat-demo{padding:22px 13px;border:1px solid #dde3e8;border-radius:19px;background:#ffffffbd;box-shadow:0 8px 24px #20334d06}
.demo-int,.demo-you{display:flex;align-items:flex-end;gap:8px}.demo-you{justify-content:flex-end;margin-top:18px}
.mini-avatar{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;border-radius:10px;background:#e0e6ed;font-size:16px}.mini-you{background:var(--ink);font-size:16px}
.demo-bubble{max-width:81%;padding:12px 13px;font-size:11px;line-height:1.9;font-weight:700;border-radius:13px}.demo-bubble-int{border:1px solid var(--border);background:#fff}.demo-bubble-you{background:var(--ink);color:white}
.home-actions{padding-top:24px}.primary-button,.next-button{border:0;border-radius:13px;background:var(--ink);color:#fff;min-height:56px;width:100%;padding:12px 18px;font-size:14px;font-weight:900;display:flex;justify-content:space-between;align-items:center}.primary-button span,.next-button span{font-size:24px;color:var(--lime);font-weight:500;line-height:1}

.game-screen{height:100dvh;min-height:0;display:flex;flex-direction:column}
.chat-messages{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:max(29px,env(safe-area-inset-top)) 17px 22px;scrollbar-width:thin;scrollbar-color:#cbd3de transparent}
.message{display:flex;align-items:flex-start;gap:10px;margin-bottom:28px;animation:popin .2s ease both}.message.player{flex-direction:row-reverse}.avatar{width:36px;height:36px;flex:0 0 36px;border-radius:13px;display:flex;justify-content:center;align-items:center;font-size:21px}.avatar.interviewer{background:#e0e6ed}.avatar.player{background:var(--ink)}
.message-body{display:flex;flex-direction:column;align-items:flex-start;flex:1;min-width:0}.message.player .message-body{align-items:flex-end}
.message-name{font-size:10px;font-weight:800;color:#8794a4;margin:2px 0 9px;overflow-wrap:anywhere;max-width:100%}
.message-bubble{border-radius:16px;background:#fff;border:1px solid #dce2e9;padding:14px 16px;font-size:12.5px;line-height:2.03;max-width:100%;width:fit-content;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:0 1px 1px #24375105;direction:ltr;text-align:left}
.message.player .message-bubble{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:740;line-height:2.12}
.message-bubble.is-typing::after{content:'▍';color:var(--lime);animation:blink .7s steps(1) infinite;margin-left:2px}.message-bubble.link-bubble{width:min(100%,330px);background:#fff;box-shadow:0 8px 25px #25385010}
.message-link-card{border:1px solid #dbe1e6;border-radius:12px;overflow:hidden;margin-top:13px;display:block;width:100%;padding:0;background:#fff;text-align:left;color:var(--ink)}.link-card-head{background:#263a53;padding:17px 17px 18px;display:block;color:white}.link-card-kicker{font-size:9px;color:#afc3d5;font-weight:850;letter-spacing:.14em}.link-card-title{font-size:14px;font-weight:850;line-height:1.6;margin-top:9px;display:block}.link-card-foot{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;color:#334b62;font-weight:850;font-size:12px}.link-card-foot strong{font-size:18px}
@keyframes popin{from{transform:translateY(7px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes blink{50%{opacity:0}}
.chat-footer{background:#faf9f6;border-top:1px solid #e5e7eb;padding:13px 17px max(19px,env(safe-area-inset-bottom));flex:0 0 auto}.next-button{justify-content:center;gap:9px;min-height:51px}.next-button:disabled{opacity:.55}.name-form{display:flex;gap:8px;align-items:stretch}.name-input{min-width:0;flex:1;border:1px solid #d8e0e7;background:#fff;border-radius:12px;font-size:16px;color:var(--ink);padding:0 14px;height:51px}.name-submit{flex:0 0 auto;background:var(--ink);border:0;color:#fff;border-radius:12px;padding:0 15px;font-size:13px;font-weight:900}.name-submit span{color:var(--lime);font-size:22px;vertical-align:-2px}

.overlay{position:fixed;z-index:20;inset:0;display:flex;justify-content:center;align-items:flex-end;background:#10203990}.choice-sheet{background:var(--paper);width:min(100%,480px);border-radius:23px 23px 0 0;padding:11px 23px max(26px,env(safe-area-inset-bottom));max-height:96dvh;overflow-y:auto;box-shadow:0 -20px 60px #10203928;animation:sheetin .22s ease}.choice-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.choice-eyebrow{font-size:11px;color:#78899a;font-weight:900}.choice-count{font-size:11px;color:#8391a1;font-weight:850;font-variant-numeric:tabular-nums}.choice-progress{display:flex;gap:4px;margin:13px 0 28px}.choice-progress span{height:4px;flex:1;background:#dde2e7;border-radius:8px}.choice-progress span.done{background:#86a387}.choice-progress span.current{background:var(--ink)}.choice-title{font-size:clamp(18px,5.4vw,23px);font-weight:900;line-height:1.55;letter-spacing:-.05em;margin:0 0 8px}.choice-desc{margin:0 0 24px;font-size:12px;color:#8793a0}.choice-options{display:grid;gap:11px}.choice-option{width:100%;border:1px solid #d6dfe7;background:white;border-radius:14px;min-height:70px;padding:13px 12px;display:flex;align-items:center;gap:13px;text-align:left;color:var(--ink)}.choice-option:active{background:#f0f4ef}.option-index{width:32px;height:32px;flex:none;display:grid;place-items:center;color:#7d8997;background:#eff1f3;font-size:12px;font-weight:900;border-radius:10px}.option-text{font-size:13px;font-weight:850;line-height:1.6;flex:1;overflow-wrap:anywhere}.option-chevron{font-size:22px;color:#9ca7b4}.choice-tip{font-size:10px;line-height:1.7;text-align:center;color:#a0aab5;margin:23px 0 0}@keyframes sheetin{from{transform:translateY(20px);opacity:.8}to{transform:translateY(0);opacity:1}}

.article-screen{min-height:100dvh;background:#e8e8e5;padding-bottom:max(32px,env(safe-area-inset-bottom))}
.article-toolbar{height:61px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#f6f5f1;border-bottom:1px solid #e0e4e8}.toolbar-back,.toolbar-change{border:0;background:none;color:#3d5068;font-weight:800;font-size:12px}.toolbar-back{font-size:27px;display:flex;align-items:center;gap:5px}.toolbar-back span{font-size:12px}.toolbar-change{background:#fff;border:1px solid #d9e1e7;border-radius:9px;padding:10px 12px;white-space:nowrap}
.article-area{padding:15px 0 0}
.article-bottom-bar{padding:15px 12px 0;display:grid;grid-template-columns:1fr;gap:10px}.article-action{min-height:49px;border-radius:12px;border:1px solid #d4dde3;background:#fff;color:#2e4159;font-weight:900;font-size:12px}.article-action span{font-size:17px;margin-right:3px}.article-action-primary{background:#243751;color:white;border-color:#243751}.article-notice{text-align:center;color:#8c989f;font-size:10px;margin:17px 10px 0}.replay-link{display:block;margin:24px auto 0;border:0;background:none;color:#65788a;text-decoration:underline;text-underline-offset:4px;font-size:12px;font-weight:850;padding:10px}

.toast{position:fixed;z-index:50;bottom:24px;left:50%;transform:translate(-50%,12px);background:#243751;color:#fff;border-radius:12px;padding:12px 17px;font-size:12px;max-width:calc(100% - 32px);opacity:0;pointer-events:none;transition:.2s;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:600px){.app-shell{margin:23px auto;min-height:calc(100dvh - 46px);border-radius:22px;overflow:hidden}.home-inner,.screen{min-height:calc(100dvh - 46px)}.game-screen{height:calc(100dvh - 46px)}.overlay{align-items:center;padding:20px}.choice-sheet{border-radius:22px;padding-bottom:25px}}
@media(max-height:680px){.home-content{padding-top:8px}.home-chat-demo{padding:13px}.home-lead{margin-bottom:15px}.choice-progress{margin-bottom:18px}.choice-desc{margin-bottom:13px}.choice-option{min-height:57px}.choice-tip{margin-top:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important}}



.publish-status{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;margin-top:13px;flex-wrap:wrap}
.publish-status:empty{display:none}.publish-status a{color:#253a54;text-decoration:underline;text-underline-offset:3px;font-size:12px;font-weight:800}.publish-status button{border:1px solid #cbd5e1;border-radius:8px;background:white;padding:10px;font-size:12px;font-weight:800;color:#243751}
.primary-button:disabled{opacity:.6;cursor:wait}

.home-info-links,.article-info-links{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding-top:16px;font-size:11px;color:#a1aab4}
.home-info-links a,.article-info-links a{color:#738295;text-decoration:none;border-bottom:1px solid #cbd2db;padding-bottom:2px}
.home-info-links a:hover,.article-info-links a:hover{color:#243751;border-bottom-color:#243751}
.home-info-links a:focus-visible,.article-info-links a:focus-visible{outline:3px solid #93afdb;outline-offset:3px;border-radius:2px}
.article-info-links{margin-top:48px;padding:0 14px 32px}

.publish-overlay{position:fixed;z-index:40;inset:0;display:flex;align-items:center;justify-content:center;padding:18px max(14px,env(safe-area-inset-left)) 18px max(14px,env(safe-area-inset-right));background:#14233baf;overscroll-behavior:contain}
.publish-dialog{width:min(100%,448px);max-height:calc(100dvh - 36px);overflow-y:auto;overscroll-behavior:contain;border:1px solid #e2e7ec;border-radius:20px;background:#f9f9f7;padding:26px 23px 22px;box-shadow:0 25px 90px #08192b42;color:var(--ink);animation:popin .18s ease}
.publish-dialog-kicker{margin:0 0 9px;font-size:10px;font-weight:900;letter-spacing:.15em;color:#7b8d9c}
.publish-dialog h2{margin:0;font-size:21px;font-weight:900;letter-spacing:-.055em;line-height:1.5}
.publish-dialog-lead{margin:9px 0 20px;color:#63748a;font-size:12px;line-height:1.95}
.publish-dialog-notes{border:1px solid #e1e6eb;border-radius:14px;background:#fff;padding:3px 15px;margin-bottom:18px}
.publish-dialog-note{display:flex;align-items:flex-start;gap:12px;padding:15px 0}
.publish-dialog-note+.publish-dialog-note{border-top:1px solid #edf0f2}
.publish-dialog-icon{flex:0 0 27px;width:27px;height:27px;display:grid;place-items:center;background:#eef3e7;color:#667e43;border-radius:8px;font-size:10px;font-weight:900;font-variant-numeric:tabular-nums}
.publish-dialog-note h3{font-size:12px;line-height:1.65;margin:0 0 3px;font-weight:900}
.publish-dialog-note p{font-size:11px;line-height:1.85;color:#647489;margin:0;overflow-wrap:anywhere}
.publish-dialog-note strong{color:#243751;overflow-wrap:anywhere}
.publish-dialog-error{font-size:12px;font-weight:700;line-height:1.6;margin:0 0 12px;color:#9f3434;background:#fff0ed;border-radius:8px;padding:10px 12px}
.publish-dialog-actions{display:grid;grid-template-columns:1fr 1.45fr;gap:9px}
.publish-dialog-actions button{min-height:49px;border-radius:11px;font-size:12px;font-weight:900;padding:10px 8px}
.publish-dialog-cancel{border:1px solid #d2dae2;background:#fff;color:#56667a}
.publish-dialog-confirm{border:1px solid var(--ink);background:var(--ink);color:#fff;display:flex;justify-content:center;align-items:center;gap:9px}
.publish-dialog-confirm span{color:var(--lime);font-size:20px;line-height:1}
.publish-dialog-actions button:disabled{opacity:.65;cursor:wait}
.publish-dialog-actions button:focus-visible{outline:3px solid #93afdb;outline-offset:2px}
@media(max-width:380px){.publish-dialog{padding:21px 17px 18px}.publish-dialog h2{font-size:19px}.publish-dialog-lead{margin-bottom:14px}.publish-dialog-note{padding:11px 0}.publish-dialog-notes{padding:2px 12px}}
