:root{
  --navy-950:#07111f;--navy-900:#0c1b31;--navy-800:#12233f;--navy-700:#1a3155;
  --ink:#122033;--muted:#6c7b91;--line:#dce3ec;--soft:#f3f6fa;--white:#fff;
  --orange:#ff8b38;--orange-deep:#e86c18;--teal:#16a6a1;--green:#16a36a;
  --red:#d84c4c;--yellow:#e2a72c;--blue:#3a78d4;
  --shadow:0 18px 48px rgba(13,30,53,.12);--shadow-sm:0 8px 24px rgba(13,30,53,.09);
  --radius:22px;--radius-sm:14px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:Inter,"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:var(--ink);background:radial-gradient(circle at 10% -5%,rgba(255,139,56,.12),transparent 27rem),linear-gradient(180deg,#edf2f8 0,#f8fafc 52%,#eef3f8 100%);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}img{max-width:100%;display:block}a{color:inherit}.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:30;height:68px;padding:0 max(18px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;color:#fff;background:rgba(7,17,31,.95);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.08)}.brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:.04em;cursor:pointer}.brand-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,var(--orange),#ffb56f);display:grid;place-items:center;box-shadow:0 7px 20px rgba(255,139,56,.28)}.brand-mark svg{width:22px;height:22px}.brand-sub{font-size:10px;font-weight:700;letter-spacing:.18em;color:#9fb0c7;display:block;margin-top:1px}.top-actions{display:flex;gap:8px;align-items:center}.icon-btn{width:42px;height:42px;border:0;border-radius:13px;background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;transition:.2s}.icon-btn:hover{background:rgba(255,255,255,.15)}.api-status{font-size:11px;display:flex;align-items:center;gap:6px;color:#c9d5e5;padding:8px 11px;border-radius:999px;background:rgba(255,255,255,.07)}.api-dot{width:8px;height:8px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 4px rgba(226,167,44,.13)}.api-status.online .api-dot{background:#43d69b;box-shadow:0 0 0 4px rgba(67,214,155,.13)}main{width:min(1240px,100%);margin:0 auto;flex:1;padding:26px 22px 112px}.screen{display:none;animation:fadeUp .28s ease both}.screen.active{display:block}@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.eyebrow{text-transform:uppercase;font-size:11px;font-weight:900;letter-spacing:.18em;color:var(--orange-deep);margin-bottom:8px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(30px,5vw,54px);line-height:1.06;letter-spacing:-.04em;margin-bottom:16px}h2{font-size:clamp(24px,3vw,34px);letter-spacing:-.025em;margin-bottom:10px}h3{font-size:18px;margin-bottom:8px}.lead{font-size:16px;line-height:1.85;color:var(--muted)}.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1.15fr .85fr;gap:28px;padding:34px;border-radius:30px;color:#fff;background:linear-gradient(135deg,var(--navy-950),var(--navy-700));box-shadow:var(--shadow)}.hero:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-180px;top:-190px;background:radial-gradient(circle,rgba(255,139,56,.34),rgba(255,139,56,0) 66%)}.hero-copy,.hero-panel{position:relative;z-index:1}.hero .lead{color:#c3d0e1;max-width:680px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.primary-btn,.secondary-btn,.ghost-btn,.danger-btn{border:0;border-radius:14px;min-height:50px;padding:0 20px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:.2s}.primary-btn{color:#fff;background:linear-gradient(135deg,var(--orange),var(--orange-deep));box-shadow:0 10px 24px rgba(232,108,24,.27)}.primary-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(232,108,24,.32)}.secondary-btn{color:var(--navy-800);background:#fff;box-shadow:var(--shadow-sm)}.ghost-btn{color:var(--navy-800);background:#edf2f7;border:1px solid #d8e0ea}.danger-btn{color:#fff;background:var(--red)}.hero .secondary-btn{color:#fff;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.15);box-shadow:none}.hero-panel{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:center}.hero-stat{min-height:112px;padding:18px;border-radius:18px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(8px)}.hero-stat .num{font-size:30px;font-weight:900;letter-spacing:-.04em}.hero-stat .label{font-size:12px;color:#b9c7d9;margin-top:3px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:34px 0 16px}.section-head p{margin:0;color:var(--muted)}.category-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.category-card{position:relative;border:1px solid rgba(22,42,70,.08);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow-sm);padding:22px;text-align:left;overflow:hidden;transition:.2s}.category-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.category-card:after{content:"";position:absolute;width:95px;height:95px;border-radius:50%;right:-25px;bottom:-35px;background:var(--card-glow,rgba(255,139,56,.13))}.cat-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:24px;background:var(--cat-bg,#fff2e9);margin-bottom:28px}.category-card p{font-size:13px;color:var(--muted);line-height:1.65;margin-bottom:0}.chevron{position:absolute;right:18px;top:18px;color:#9aa8ba}.panel,.recent-card{border-radius:var(--radius);background:#fff;border:1px solid rgba(22,42,70,.08);box-shadow:var(--shadow-sm)}.recent-card{padding:20px;display:flex;justify-content:space-between;align-items:center;gap:18px}.score-pill{min-width:74px;text-align:center;padding:11px 14px;border-radius:16px;background:#eef8f5;color:var(--green)}.score-pill strong{font-size:24px;display:block}.empty-state{text-align:center;padding:35px;color:var(--muted)}.avatar-strip{display:grid;grid-template-columns:repeat(10,1fr);gap:10px;overflow:auto;padding-bottom:5px;scrollbar-width:thin}.avatar-chip{min-width:88px;border:1px solid var(--line);background:#fff;border-radius:18px;padding:8px;box-shadow:var(--shadow-sm);text-align:center}.avatar-chip img{width:100%;aspect-ratio:.86/1;object-fit:cover;border-radius:12px}.avatar-chip strong{display:block;font-size:11px;margin-top:7px}.page-header{display:flex;align-items:center;gap:14px;margin-bottom:22px}.back-btn{width:46px;height:46px;border-radius:14px;border:1px solid var(--line);background:#fff;color:var(--ink);display:grid;place-items:center}.setup-layout{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:22px;align-items:start}.panel{padding:24px}.form-section+.form-section{border-top:1px solid var(--line);margin-top:24px;padding-top:24px}.label-row{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.label-row label,.field-label{font-weight:900;font-size:14px}.help-text{font-size:12px;color:var(--muted)}.option-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.option-card{border:1.5px solid var(--line);background:#fff;border-radius:15px;padding:14px;text-align:left;transition:.18s}.option-card strong{display:block;font-size:14px;margin-bottom:3px}.option-card span{font-size:12px;color:var(--muted)}.option-card.selected{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,139,56,.13);background:#fffaf6}.persona-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.persona-btn{border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:12px 7px;text-align:center;font-weight:800;font-size:12px}.persona-btn span{font-size:23px;display:block;margin-bottom:5px}.persona-btn.selected{border-color:var(--teal);background:#effbfa;box-shadow:0 0 0 3px rgba(22,166,161,.11)}.difficulty-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.diff-btn{border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:13px 8px;font-weight:900}.diff-btn small{display:block;font-weight:600;color:var(--muted);margin-top:4px}.diff-btn.selected{border-color:var(--blue);background:#f0f6ff;box-shadow:0 0 0 3px rgba(58,120,212,.1)}.field{display:flex;flex-direction:column;gap:8px;margin-top:14px}input,select,textarea{width:100%;border:1.5px solid var(--line);border-radius:13px;background:#fff;color:var(--ink);padding:13px 14px;outline:none;transition:.18s}input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(58,120,212,.1)}textarea{min-height:82px;resize:vertical}.avatar-gallery{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.avatar-card{position:relative;cursor:pointer;border:1.5px solid var(--line);border-radius:17px;background:#fff;overflow:hidden;text-align:left;transition:.18s}.avatar-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}.avatar-card.selected{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,139,56,.13)}.avatar-card img{width:100%;aspect-ratio:.86/1;object-fit:cover;background:var(--navy-900)}.avatar-card-body{display:block;padding:9px}.avatar-card strong{display:block;font-size:12px}.avatar-card small{display:block;color:var(--muted);font-size:10px;line-height:1.4;margin-top:2px}.avatar-recommended{position:absolute;top:7px;left:7px;border-radius:999px;background:rgba(255,139,56,.95);color:#fff;font-size:9px;font-weight:900;padding:5px 7px}.voice-preview{position:absolute;top:7px;right:7px;width:30px;height:30px;border:0;border-radius:10px;background:rgba(7,17,31,.78);color:#fff;display:grid;place-items:center}.summary-card{position:sticky;top:90px;padding:24px;border-radius:var(--radius);color:#fff;background:linear-gradient(145deg,var(--navy-900),var(--navy-700));box-shadow:var(--shadow)}.summary-avatar{display:flex;align-items:center;gap:13px;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid rgba(255,255,255,.12)}.summary-avatar img{width:64px;height:74px;object-fit:cover;border-radius:15px;background:#152c4d}.summary-line{display:flex;justify-content:space-between;gap:12px;margin:12px 0;font-size:13px;color:#b9c7d9}.summary-line strong{color:#fff;text-align:right}.summary-card .primary-btn{width:100%;margin-top:18px}.privacy-note{font-size:10px;line-height:1.6;color:#9fb0c7;margin:13px 0 0}.roleplay-shell{display:grid;grid-template-columns:350px minmax(0,1fr);gap:20px;min-height:calc(100vh - 130px)}.customer-panel{position:sticky;top:88px;align-self:start;border-radius:26px;overflow:hidden;color:#fff;background:linear-gradient(145deg,var(--navy-950),var(--navy-700));box-shadow:var(--shadow)}.customer-top{padding:20px 22px 0;display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.customer-name{font-size:17px;font-weight:900}.customer-role{font-size:11px;color:#b7c5d7;margin-top:3px}.timer{padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.1);font-weight:900}.avatar-stage{height:290px;position:relative;display:grid;place-items:end center;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.12),transparent 45%)}.avatar-stage:after{content:"";position:absolute;left:12%;right:12%;bottom:7px;height:18px;border-radius:50%;background:rgba(0,0,0,.25);filter:blur(8px)}#avatarImage{height:270px;width:auto;max-width:100%;position:relative;z-index:1;object-fit:cover;border-radius:18px 18px 0 0;filter:drop-shadow(0 15px 13px rgba(0,0,0,.2));transition:opacity .18s,transform .25s}.avatar-stage.speaking #avatarImage{animation:speakingBob .62s ease-in-out infinite alternate}@keyframes speakingBob{to{transform:translateY(-3px) rotate(.35deg)}}.emotion-label{position:absolute;z-index:2;right:18px;top:12px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.14);padding:8px 11px;border-radius:999px;font-size:11px;font-weight:800}.voice-state{position:absolute;z-index:3;left:18px;bottom:14px;display:flex;align-items:center;gap:8px;border-radius:999px;padding:8px 11px;background:rgba(7,17,31,.72);font-size:10px;font-weight:900}.voice-state-dot{width:8px;height:8px;border-radius:50%;background:#8fa0b5}.voice-state.listening .voice-state-dot{background:#ff6464;box-shadow:0 0 0 5px rgba(255,100,100,.15);animation:pulseDot 1.2s infinite}.voice-state.speaking .voice-state-dot{background:#59dfaa;box-shadow:0 0 0 5px rgba(89,223,170,.13)}@keyframes pulseDot{50%{transform:scale(.72)}}.meters{padding:18px 22px 22px;display:grid;gap:14px}.meter-row{display:grid;grid-template-columns:58px 1fr 34px;gap:9px;align-items:center;font-size:12px}.meter-row span:first-child{color:#c6d2e2}.meter-track{height:8px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}.meter-fill{height:100%;width:50%;border-radius:inherit;transition:width .45s ease}.trust-fill{background:#52d39e}.interest-fill{background:#f4b84c}.stress-fill{background:#ee6f6f}.conversation-panel{border-radius:26px;background:#fff;border:1px solid rgba(22,42,70,.08);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;min-width:0;overflow:hidden}.conversation-head{padding:17px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fbfcfe}.objective{font-size:12px;color:var(--muted)}.objective strong{color:var(--ink)}.phase-pills{display:flex;gap:6px;overflow:auto;padding-bottom:2px;scrollbar-width:none}.phase-pill{white-space:nowrap;font-size:10px;padding:6px 9px;border-radius:999px;background:#edf1f6;color:#8290a2;font-weight:800}.phase-pill.active{background:#fff0e5;color:var(--orange-deep)}.messages{height:calc(100vh - 385px);min-height:390px;overflow-y:auto;padding:22px;background:linear-gradient(180deg,#f9fbfd 0,#fff 100%);scroll-behavior:smooth}.message{display:flex;gap:10px;margin-bottom:17px;align-items:flex-end}.message.user{justify-content:flex-end}.bubble{max-width:min(78%,640px);padding:13px 15px;border-radius:17px;line-height:1.72;font-size:14px;box-shadow:0 4px 12px rgba(15,32,54,.05);white-space:pre-wrap;word-break:break-word}.message.ai .bubble{border-bottom-left-radius:5px;background:#fff;border:1px solid var(--line)}.message.user .bubble{border-bottom-right-radius:5px;color:#fff;background:linear-gradient(135deg,var(--navy-700),var(--navy-800))}.bubble-meta{font-size:10px;color:#9aa7b6;margin-top:5px}.typing{display:inline-flex;gap:4px;align-items:center}.typing i{width:6px;height:6px;border-radius:50%;background:#9cabbc;animation:typing 1s infinite ease-in-out}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}@keyframes typing{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}.hint-card{margin:0 22px 12px;padding:12px 14px;border-radius:14px;background:#fff8e8;border:1px solid #f0dfb6;color:#73581c;font-size:13px;display:none}.hint-card.visible{display:block;animation:fadeUp .2s ease}.voice-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 16px 10px;padding:12px 14px;border-radius:15px;background:#eff8f7;border:1px solid #d2ece8}.voice-banner strong{font-size:12px}.voice-banner span{font-size:10px;color:var(--muted);display:block;margin-top:2px}.voice-session-btn{border:0;border-radius:12px;padding:10px 13px;font-weight:900;color:#fff;background:var(--teal);white-space:nowrap}.voice-session-btn.active{background:var(--red)}.composer{padding:12px 16px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff}.composer-row{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;gap:9px;align-items:end}.mic-btn,.send-btn{height:48px;border:0;border-radius:14px;display:grid;place-items:center}.mic-btn{background:#edf2f7;color:var(--navy-700)}.mic-btn.listening{color:#fff;background:var(--red);animation:pulse 1.2s infinite}@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(216,76,76,.12)}}.send-btn{background:var(--orange);color:#fff}#messageInput{min-height:48px;max-height:120px;resize:none;padding:12px 14px}.composer-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:9px}.tool-buttons{display:flex;gap:7px;flex-wrap:wrap}.tool-btn{border:0;background:#f1f4f8;color:#53647a;border-radius:10px;padding:8px 10px;font-size:11px;font-weight:800}.end-btn{border:0;background:transparent;color:var(--red);font-size:12px;font-weight:900;padding:8px}.result-hero{display:grid;grid-template-columns:250px 1fr;gap:28px;align-items:center;padding:30px;border-radius:28px;color:#fff;background:linear-gradient(145deg,var(--navy-950),var(--navy-700));box-shadow:var(--shadow)}.score-ring{width:190px;height:190px;margin:auto;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(var(--orange) calc(var(--score)*1%),rgba(255,255,255,.12) 0)}.score-ring:before{content:"";position:absolute;inset:13px;border-radius:50%;background:var(--navy-900)}.score-value{position:relative;text-align:center}.score-value strong{font-size:58px;line-height:1;font-weight:900;letter-spacing:-.06em}.score-value span{font-size:13px;color:#b7c4d5;display:block}.rank-badge{display:inline-flex;align-items:center;gap:7px;border-radius:999px;background:rgba(255,255,255,.1);padding:8px 12px;font-weight:900;margin-bottom:12px}.result-hero p{color:#c6d2e2;line-height:1.7;margin-bottom:0}.result-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;margin-top:20px}.score-list{display:grid;gap:14px;margin-top:18px}.score-item{display:grid;grid-template-columns:105px 1fr 38px;gap:10px;align-items:center;font-size:13px}.score-bar{height:9px;border-radius:999px;background:#edf1f5;overflow:hidden}.score-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--teal),#4dc4be)}.feedback-stack{display:grid;gap:12px}.feedback-card{padding:17px;border-radius:16px;background:#f6f8fb;border:1px solid #e7ecf2}.feedback-card.good{background:#eef9f5;border-color:#d1eee1}.feedback-card.improve{background:#fff7ef;border-color:#f5ddc6}.feedback-card h3{font-size:14px;display:flex;gap:7px;align-items:center}.feedback-card p{margin:0;color:#53647a;line-height:1.7;font-size:13px}.result-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.transcript{max-height:360px;overflow:auto;margin-top:14px;border-top:1px solid var(--line);padding-top:8px}.transcript-line{display:grid;grid-template-columns:66px 1fr;gap:10px;padding:10px 0;border-bottom:1px dashed #e5e9ef;font-size:12px;line-height:1.6}.transcript-line strong{color:var(--muted)}.voice-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.voice-metric{padding:13px;border-radius:14px;background:#f5f8fb;text-align:center}.voice-metric strong{font-size:23px;display:block}.voice-metric span{font-size:10px;color:var(--muted)}.history-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px}.metric-card{padding:19px;border-radius:18px;background:#fff;border:1px solid rgba(22,42,70,.08);box-shadow:var(--shadow-sm)}.metric-card strong{display:block;font-size:28px;letter-spacing:-.04em;margin-top:7px}.metric-card span{font-size:12px;color:var(--muted)}.history-list{display:grid;gap:10px;margin-top:14px}.history-item{display:grid;grid-template-columns:56px 1fr auto;gap:14px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:15px}.history-item img{width:56px;height:62px;object-fit:cover;border-radius:11px}.history-item h3{font-size:14px;margin-bottom:5px}.history-item p{font-size:11px;color:var(--muted);margin:0}.history-score{font-size:24px;font-weight:900;color:var(--green)}.settings-grid{display:grid;gap:16px}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px;border:1px solid var(--line);border-radius:16px}.setting-row p{font-size:12px;color:var(--muted);margin:5px 0 0}.switch{width:48px;height:28px;border:0;border-radius:999px;background:#ccd5df;padding:3px;transition:.2s;flex:none}.switch:after{content:"";display:block;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 7px rgba(0,0,0,.18);transition:.2s}.switch.on{background:var(--teal)}.switch.on:after{transform:translateX(20px)}.range-wrap{display:flex;align-items:center;gap:10px;min-width:220px}.range-wrap input{padding:0;border:0;box-shadow:none}.setting-select{max-width:360px}.bottom-nav{position:fixed;z-index:40;bottom:0;left:50%;transform:translateX(-50%);width:min(660px,calc(100% - 24px));padding:8px 12px calc(8px + env(safe-area-inset-bottom));display:flex;justify-content:space-around;border:1px solid rgba(22,42,70,.1);border-bottom:0;border-radius:20px 20px 0 0;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);box-shadow:0 -10px 30px rgba(14,32,53,.11)}.nav-btn{border:0;background:transparent;color:#7d8a9a;min-width:72px;padding:6px 9px;border-radius:12px;font-size:10px;font-weight:800;display:grid;gap:3px;place-items:center}.nav-btn svg{width:20px;height:20px}.nav-btn.active{color:var(--orange-deep);background:#fff4eb}.toast{position:fixed;z-index:100;left:50%;bottom:96px;transform:translate(-50%,18px);opacity:0;pointer-events:none;min-width:220px;max-width:calc(100% - 30px);padding:12px 15px;border-radius:13px;color:#fff;background:var(--navy-900);box-shadow:var(--shadow);font-size:13px;text-align:center;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}.modal-backdrop{position:fixed;inset:0;z-index:80;background:rgba(3,10,20,.56);display:none;place-items:center;padding:20px;backdrop-filter:blur(5px)}.modal-backdrop.show{display:grid}.modal{width:min(430px,100%);background:#fff;border-radius:22px;padding:24px;box-shadow:var(--shadow)}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}.loading-overlay{position:fixed;inset:0;z-index:110;background:rgba(7,17,31,.78);display:none;place-items:center;color:#fff;backdrop-filter:blur(8px)}.loading-overlay.show{display:grid}.loading-box{text-align:center}.spinner{width:48px;height:48px;border:4px solid rgba(255,255,255,.18);border-top-color:var(--orange);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 16px}@keyframes spin{to{transform:rotate(360deg)}}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1050px){.avatar-gallery{grid-template-columns:repeat(4,1fr)}}
@media(max-width:920px){.category-grid{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr}.hero-panel{grid-template-columns:repeat(4,1fr)}.setup-layout{grid-template-columns:1fr}.summary-card{position:static}.roleplay-shell{grid-template-columns:1fr;display:block}.customer-panel{position:relative;top:auto;display:grid;grid-template-columns:270px 1fr;margin-bottom:14px}.avatar-stage{height:240px}.meters{align-content:center}.customer-top{position:absolute;left:0;right:0;z-index:4}.timer{background:rgba(7,17,31,.5)}.conversation-panel{min-height:630px}.messages{height:480px}.result-grid{grid-template-columns:1fr}.avatar-gallery{grid-template-columns:repeat(5,1fr)}}
@media(max-width:650px){.api-status{display:none}.brand-name{font-size:14px}main{padding:18px 14px 102px}.hero{padding:25px 20px;border-radius:24px}.hero-panel{grid-template-columns:1fr 1fr}.hero-stat{min-height:92px;padding:15px}.hero-stat .num{font-size:25px}.category-grid{gap:10px}.category-card{padding:16px;min-height:170px}.cat-icon{margin-bottom:20px}.category-card p{font-size:11px}.section-head{align-items:start;flex-direction:column;gap:4px}.option-grid{grid-template-columns:1fr}.persona-grid{grid-template-columns:repeat(2,1fr)}.difficulty-row{grid-template-columns:1fr}.panel{padding:18px}.avatar-gallery{grid-template-columns:repeat(2,1fr)}.customer-panel{display:block}.avatar-stage{height:215px}.avatar-stage #avatarImage{height:205px}.meters{padding-top:10px}.customer-top{position:relative}.roleplay-shell{min-height:0}.conversation-panel{min-height:620px;border-radius:22px}.conversation-head{display:block}.phase-pills{margin-top:10px}.messages{height:395px;min-height:340px;padding:16px}.bubble{max-width:88%;font-size:13px}.composer{padding:10px}.composer-tools{align-items:flex-start}.tool-buttons{max-width:75%}.voice-banner{align-items:flex-start;flex-direction:column}.voice-session-btn{width:100%}.result-hero{grid-template-columns:1fr;padding:24px 18px;text-align:center}.score-ring{width:160px;height:160px}.score-value strong{font-size:48px}.result-actions{justify-content:center}.history-grid{grid-template-columns:1fr}.score-item{grid-template-columns:90px 1fr 35px}.voice-metrics{grid-template-columns:1fr 1fr}.bottom-nav{width:100%;border-radius:18px 18px 0 0}.nav-btn{min-width:58px}.setting-row{align-items:flex-start;flex-direction:column}.setting-select,.range-wrap{width:100%;max-width:none}.avatar-strip{grid-template-columns:repeat(10,82px)}}

.hidden{display:none!important}
.kokoro-notice{display:flex;gap:10px;align-items:flex-start;padding:13px 14px;border:1px solid #dce5ef;border-radius:14px;background:#f6f8fb;color:#52657a}
.kokoro-notice.active{border-color:#cfe8e3;background:#eff9f7;color:#285f58}
.kokoro-notice strong{font-size:12px;white-space:nowrap}
.kokoro-notice span{font-size:11px;line-height:1.55}
.kokoro-model-row{align-items:center}
.kokoro-model-copy{flex:1;min-width:0}
.kokoro-model-action{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.kokoro-status-badge{display:inline-flex;align-items:center;justify-content:center;min-width:78px;padding:7px 10px;border-radius:999px;background:#edf2f7;color:#52657a;font-size:11px;font-weight:900}
.kokoro-progress{height:7px;margin-top:11px;border-radius:999px;overflow:hidden;background:#e7edf3}
.kokoro-progress i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--teal),#4dc4be);transition:width .25s ease}
.kokoro-progress.error i{background:var(--red)}
#kokoroLoadButton:disabled{opacity:.55;cursor:default}
@media(max-width:650px){.kokoro-model-action{width:100%;justify-content:space-between}.kokoro-status-badge{min-width:90px}}


/* GitHub Test Edition additions */
.setting-row-stack{align-items:stretch;flex-direction:column;gap:12px}
.endpoint-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;width:100%}
.setting-input{width:100%;min-height:44px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff;color:var(--text);font:inherit;box-sizing:border-box}
.setting-input:focus{outline:3px solid rgba(255,122,31,.16);border-color:var(--orange)}
.plan-preview-banner{margin:18px 0;padding:14px 16px;border:1px solid #f2c777;background:#fff8df;border-radius:14px;display:flex;gap:8px;flex-direction:column;color:#604512}
.plan-preview-banner[hidden]{display:none}
.free-plan-preview .premium-only{position:relative;filter:blur(4px);opacity:.48;pointer-events:none;user-select:none}
.free-plan-preview .premium-only::after{content:'プレミアム分析';position:absolute;inset:0;display:grid;place-items:center;font-size:22px;font-weight:900;color:#1a2638;filter:blur(0);opacity:1}
code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.92em;background:#f3f5f8;padding:2px 5px;border-radius:5px}
@media(max-width:680px){.endpoint-controls{grid-template-columns:1fr}.result-actions{align-items:stretch}.result-actions>*{width:100%;justify-content:center}}

.field-help{margin:-4px 0 16px;color:var(--muted);font-size:12px;line-height:1.7}

.setup-intro{display:flex;justify-content:space-between;gap:20px;margin-bottom:24px}.setup-intro h3{margin:4px 0}.setup-intro p,.advanced-head p{color:var(--muted)}.setup-count{white-space:nowrap;background:#e9f2ff;color:#1769aa;border-radius:999px;padding:7px 12px;font-weight:800}.quick-form-grid,.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.field-wide{grid-column:1/-1}.field label em{font-style:normal;color:#d64c4c;font-size:11px}.customer-avatar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.customer-avatar-card{position:relative;border:2px solid var(--border);background:var(--card);border-radius:16px;padding:10px;cursor:pointer;transition:.18s}.customer-avatar-card:hover{transform:translateY(-2px)}.customer-avatar-card.selected{border-color:var(--primary);background:#f2f8ff}.customer-avatar-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:11px}.customer-avatar-card strong{display:block;margin-top:8px;text-align:center}.customer-avatar-check{display:none;position:absolute;right:7px;top:7px;width:25px;height:25px;border-radius:50%;place-items:center;background:var(--primary);color:#fff}.customer-avatar-card.selected .customer-avatar-check{display:grid}.advanced-toggle{width:100%;display:flex;justify-content:space-between;margin-top:24px;padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--card);font-weight:800}.advanced-settings{margin-top:12px;padding:20px;border:1px solid var(--border);border-radius:16px}.common-details{border-top:1px solid var(--border);padding-top:18px;margin-top:18px}.setup-validation{padding:12px;margin-bottom:16px;border-radius:12px;background:#fff1f1;color:#a92323;font-weight:700}@media(max-width:700px){.setup-intro{display:block}.quick-form-grid,.detail-grid{grid-template-columns:1fr}.field-wide{grid-column:auto}.customer-avatar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

[hidden]{display:none!important}


/* Service, billing, and legal information */
.site-footer{width:min(1496px,calc(100% - 40px));margin:0 auto 92px;padding:24px 28px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow-sm);display:flex;justify-content:space-between;gap:22px;align-items:flex-start}.site-footer>div{display:grid;gap:5px}.site-footer>div span{font-size:12px;color:var(--muted)}.site-footer nav{display:flex;justify-content:flex-end;gap:8px 14px;flex-wrap:wrap}.site-footer button{border:0;background:transparent;padding:4px;color:#52657a;font:inherit;font-size:12px;font-weight:700;cursor:pointer}.site-footer button:hover,.site-footer button:focus{color:var(--orange-deep);text-decoration:underline}.information-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:20px;align-items:start}.info-nav{position:sticky;top:100px;display:grid;padding:10px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--shadow-sm)}.info-link{border:0;border-radius:11px;background:transparent;padding:12px 13px;text-align:left;color:#52657a;font:inherit;font-weight:800;cursor:pointer}.info-link:hover{background:#f5f8fb}.info-link.active{background:#fff1e8;color:var(--orange-deep)}.info-content{min-width:0}.info-section{padding:30px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow-sm)}.info-section h3{font-size:25px;margin-bottom:22px}.info-section h4{margin:25px 0 7px;font-size:16px}.info-section p{color:#52657a;line-height:1.9}.status-banner{display:grid;gap:4px;margin-bottom:24px;padding:15px 17px;border:1px solid #cfe8e3;border-radius:14px;background:#eff9f7;color:#285f58}.status-banner.caution{border-color:#f2d4a4;background:#fff8e8;color:#76510e}.status-banner span{font-size:12px}.pricing-card{max-width:420px;margin-bottom:22px;padding:22px;border-radius:18px;background:linear-gradient(145deg,#0b1b30,#173255);color:#fff}.pricing-card span{display:block;color:#c7d4e3;font-size:13px;font-weight:800}.pricing-card strong{display:block;margin:8px 0;font-size:40px}.pricing-card p{margin:0;color:#d9e2ed;font-size:12px}.legal-warning{padding:14px 16px;border-left:4px solid var(--orange);border-radius:8px;background:#fff7ef;color:#65442b!important}.legal-list{display:grid;margin:0}.legal-list>div{display:grid;grid-template-columns:minmax(160px,230px) 1fr;gap:18px;padding:15px 0;border-bottom:1px solid var(--line)}.legal-list dt{font-weight:900}.legal-list dd{margin:0;color:#52657a;line-height:1.75}.policy-date{font-size:12px}.reference-links a{color:#1769aa;font-weight:800}.inline-action{display:inline-flex;text-decoration:none}.info-section .primary-btn.inline-action{color:#fff}
@media(max-width:800px){.site-footer{width:calc(100% - 28px);display:grid;padding:20px;margin-bottom:98px}.site-footer nav{justify-content:flex-start}.information-layout{grid-template-columns:1fr}.info-nav{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.info-section{padding:21px 18px}.legal-list>div{grid-template-columns:1fr;gap:5px}.info-link{font-size:12px}.site-footer button{font-size:11px}}

/* Cloud AI / on-device Qwen mode */
.setup-mode-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:-4px 0 22px;padding:14px 16px;border:1px solid #dbe5ef;border-radius:15px;background:#f6f9fc}.setup-mode-banner>div{display:grid;gap:3px}.setup-mode-banner strong{font-size:13px}.setup-mode-banner span{font-size:11px;color:var(--muted)}.setup-mode-banner button{border:0;border-radius:10px;padding:8px 12px;background:#e8eef5;color:var(--navy-800);font-size:11px;font-weight:900}.ai-mode-section{display:grid;gap:16px;padding-bottom:20px;border-bottom:1px solid var(--line)}.ai-mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ai-mode-card{display:grid;grid-template-columns:44px 1fr;gap:4px 12px;align-items:center;padding:18px;border:2px solid var(--line);border-radius:18px;background:#fff;text-align:left;transition:.2s}.ai-mode-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}.ai-mode-card.selected{border-color:var(--orange);background:#fffaf6;box-shadow:0 0 0 4px rgba(255,139,56,.11)}.ai-mode-card .mode-icon{grid-row:1/4;font-size:28px}.ai-mode-card strong{font-size:16px}.ai-mode-card>span:not(.mode-icon){font-size:12px;line-height:1.6;color:var(--muted)}.ai-mode-card small{font-size:10px;color:#8a6a50}.local-ai-settings{display:grid;gap:14px;padding:18px;border:1px solid #cfe8e3;border-radius:18px;background:#f5fbfa}.local-mode-notice{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:#e6f7f3;color:#285f58}.local-mode-notice strong{white-space:nowrap}.local-mode-notice span{font-size:12px;line-height:1.7}.local-status-badge{display:inline-flex;align-items:center;justify-content:center;min-width:78px;padding:7px 10px;border-radius:999px;background:#e9f0f7;color:#52657a;font-size:11px;font-weight:900}.local-model-progress{height:9px;border-radius:999px;background:#dfe8ef;overflow:hidden}.local-model-progress i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--teal),#4dc4be);transition:width .2s}.local-model-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.compact-btn{min-height:42px;padding:0 15px;font-size:12px}.company-profile-input{min-height:180px}.local-only-note{margin:0!important;color:#9a5a33!important;font-size:11px!important}.local-ai-mode .cloud-voice-setting{display:none}.local-ai-mode #voiceBanner{display:none!important}.local-ai-mode #micButton{display:none!important}.local-ai-mode .api-status{background:rgba(26,166,140,.13)}
@media(max-width:700px){.ai-mode-grid{grid-template-columns:1fr}.ai-mode-card{padding:15px}.local-mode-notice{display:grid}.local-model-actions>*{width:100%}.setup-mode-banner{align-items:flex-start}}

.local-ai-mode .composer-row{grid-template-columns:minmax(0,1fr) 48px}

.billing-settings-row{align-items:center}.billing-setting-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.billing-status-badge{display:inline-flex;padding:7px 11px;border-radius:999px;background:#edf2f7;color:#53647a;font-size:11px;font-weight:900}.billing-status-badge.premium{background:#e7f8f1;color:#157554}.billing-settings-row .primary-btn{min-height:42px;padding:0 16px}.plan-preview-banner .primary-btn{align-self:flex-start;min-height:42px;margin-top:4px}.billing-action:disabled,.billing-settings-row button:disabled,.plan-preview-banner button:disabled{opacity:.55;cursor:not-allowed}


/* Hidden scenario design and discovery review */
.optional-tag{display:inline-flex;align-items:center;border-radius:999px;padding:3px 8px;background:#edf2f7;color:#63748a;font-size:10px;font-weight:800}.scenario-design{margin-top:24px;padding:20px;border:1px solid #dbe5f0;border-radius:18px;background:linear-gradient(145deg,#f8fbff,#fffaf6)}.scenario-design-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.scenario-design-head h3{margin-bottom:6px}.scenario-design-head p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}.private-badge{white-space:nowrap;border-radius:999px;padding:7px 11px;background:#122b4b;color:#fff;font-size:10px;font-weight:900}.scenario-mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}.scenario-mode-card{border:1.5px solid var(--line);border-radius:15px;background:#fff;padding:14px;text-align:left;transition:.18s}.scenario-mode-card strong{display:block;margin-bottom:5px;font-size:13px}.scenario-mode-card span{display:block;color:var(--muted);font-size:11px;line-height:1.55}.scenario-mode-card.selected{border-color:var(--orange);background:#fff8f1;box-shadow:0 0 0 3px rgba(255,139,56,.12)}.scenario-mode-note,.scenario-private-fields{margin-top:12px;padding:14px;border-radius:14px;background:#edf5ff;color:#3d5876;font-size:12px;line-height:1.7}.scenario-private-fields{background:#fff;border:1px dashed #cfdbe8;color:inherit}.scenario-private-fields .field:first-child{margin-top:0}.discovery-live-note{display:block;margin-top:5px;color:#6b7d92;font-size:10px}.discovery-card{background:#eef5ff;border-color:#d7e5f7}.discovery-score-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.discovery-score-head h3{margin:0}.discovery-score-head>strong{font-size:22px;color:var(--blue)}.discovery-progress{height:9px;margin:11px 0 13px;border-radius:999px;background:#dfe8f3;overflow:hidden}.discovery-progress i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--teal));transition:width .45s ease}.missed-feedback{margin-top:9px!important;padding-top:9px;border-top:1px dashed #c9d8e9;color:#805d30!important}
@media(max-width:700px){.scenario-design-head{display:block}.private-badge{display:inline-flex;margin-top:10px}.scenario-mode-grid{grid-template-columns:1fr}}

.fixed-field{background:#f1f4f8;color:#53647a;font-weight:800;cursor:default}


/* Compact mobile roleplay: avatar, messages, and composer remain visible together. */
@media(max-width:650px){
  body.roleplay-active{height:100dvh;overflow:hidden}
  body.roleplay-active main{height:calc(100dvh - 68px);overflow:hidden;padding:8px 8px calc(76px + env(safe-area-inset-bottom))}
  body.roleplay-active #screen-roleplay{height:100%}
  body.roleplay-active .site-footer{display:none}
  body.roleplay-active .roleplay-shell{display:grid;grid-template-rows:124px minmax(0,1fr);gap:8px;height:100%;min-height:0}
  body.roleplay-active .customer-panel{position:relative;top:auto;display:grid;grid-template-columns:112px minmax(0,1fr);grid-template-rows:46px minmax(0,1fr);height:124px;margin:0;border-radius:16px}
  body.roleplay-active .customer-top{position:static;grid-column:2;grid-row:1;padding:8px 10px 0;align-items:flex-start}
  body.roleplay-active .customer-name{font-size:13px;line-height:1.2}
  body.roleplay-active .customer-role{font-size:9px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.roleplay-active .timer{padding:6px 7px;border-radius:9px;font-size:11px}
  body.roleplay-active .avatar-stage{grid-column:1;grid-row:1/3;height:124px;align-self:stretch}
  body.roleplay-active .avatar-stage #avatarImage{width:100%;height:120px;object-fit:cover;object-position:50% 18%;border-radius:12px 12px 0 0}
  body.roleplay-active .emotion-label{top:5px;right:4px;max-width:104px;padding:5px 7px;font-size:8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  body.roleplay-active .voice-state{display:none}
  body.roleplay-active .meters{grid-column:2;grid-row:2;padding:3px 10px 8px;gap:4px;align-content:center}
  body.roleplay-active .meter-row{grid-template-columns:30px 1fr 22px;gap:5px;font-size:9px}
  body.roleplay-active .meter-track{height:5px}
  body.roleplay-active .conversation-panel{height:100%;min-height:0;border-radius:16px}
  body.roleplay-active .conversation-head{display:block;flex:none;padding:7px 10px}
  body.roleplay-active .objective{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.roleplay-active .phase-pills{display:none}
  body.roleplay-active .messages{flex:1;height:auto;min-height:0;padding:8px 10px}
  body.roleplay-active .message{margin-bottom:8px}
  body.roleplay-active .bubble{max-width:92%;padding:8px 10px;border-radius:12px;font-size:12px;line-height:1.5}
  body.roleplay-active .bubble-meta{margin-top:2px;font-size:8px}
  body.roleplay-active .hint-card{margin:0 8px 5px;padding:7px 9px;font-size:10px}
  body.roleplay-active .voice-banner{flex-direction:row;align-items:center;margin:0 8px 5px;padding:5px 7px;border-radius:10px}
  body.roleplay-active .voice-banner strong{font-size:10px}
  body.roleplay-active .voice-banner span{display:none}
  body.roleplay-active .voice-session-btn{width:auto;padding:6px 8px;border-radius:8px;font-size:9px}
  body.roleplay-active .composer{flex:none;padding:6px 7px calc(6px + env(safe-area-inset-bottom))}
  body.roleplay-active .composer-row{grid-template-columns:42px minmax(0,1fr) 42px;gap:6px}
  body.roleplay-active .mic-btn,body.roleplay-active .send-btn{height:42px;border-radius:11px}
  body.roleplay-active #messageInput{min-height:42px;max-height:76px;padding:9px 10px;font-size:16px}
  body.roleplay-active .composer-tools{gap:6px;margin-top:5px;align-items:center}
  body.roleplay-active .tool-buttons{max-width:calc(100% - 84px);flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  body.roleplay-active .tool-btn{flex:none;padding:6px 8px;font-size:9px}
  body.roleplay-active .end-btn{flex:none;padding:6px 2px;font-size:9px;white-space:nowrap}
  .ai-mode-grid.cloud-only{grid-template-columns:minmax(0,520px)}
  .ai-mode-card.static{cursor:default}
  .ai-mode-card.static:hover{transform:none;box-shadow:none}
}
@media(max-width:650px) and (max-height:600px){
  body.roleplay-active .roleplay-shell{grid-template-rows:92px minmax(0,1fr)}
  body.roleplay-active .customer-panel{grid-template-columns:88px minmax(0,1fr);grid-template-rows:40px minmax(0,1fr);height:92px}
  body.roleplay-active .avatar-stage{height:92px}
  body.roleplay-active .avatar-stage #avatarImage{height:90px}
  body.roleplay-active .meters{padding-bottom:5px}
  body.roleplay-active .voice-banner{display:none}
}

/* Keep the single online-AI option aligned with the full settings column. */
.settings-grid .ai-mode-grid.cloud-only{grid-template-columns:1fr;width:100%}
.settings-grid .ai-mode-grid.cloud-only .ai-mode-card{width:100%}


/* Clear, user-controlled roleplay ending flow. */
body.roleplay-active .composer{position:sticky;bottom:0;z-index:5}
body.roleplay-active .composer-tools{align-items:center}
body.roleplay-active .end-btn{margin-left:auto;border:1px solid #efb8b8;border-radius:10px;background:#fff3f3;color:#c93f3f;padding:8px 12px;box-shadow:0 3px 10px rgba(201,63,63,.08);white-space:nowrap}
body.roleplay-active .end-btn:hover{background:#ffe8e8;border-color:#df8888}
.end-modal{width:min(520px,100%);padding:26px}
.end-modal-eyebrow{margin:0 0 7px;color:var(--orange-deep);font-size:10px;font-weight:900;letter-spacing:.16em}
.end-modal h3{font-size:22px;line-height:1.45;margin-bottom:16px}
.end-progress{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:14px;background:var(--navy-900);color:#fff}
.end-progress strong{font-size:17px}
.end-progress span{font-size:10px;color:#b9c7d9}
.end-goal,.end-condition{display:grid;gap:5px;margin-top:11px;padding:13px 15px;border:1px solid var(--line);border-radius:13px;background:#f8fafc}
.end-goal span,.end-condition span{color:var(--muted);font-size:10px;font-weight:800}
.end-goal strong,.end-condition strong{font-size:13px;line-height:1.6}
.end-condition{background:#fff8ee;border-color:#f3dfc9}
.end-modal-note{margin:13px 1px 0;color:var(--muted);font-size:11px;line-height:1.7}
.end-modal-actions{justify-content:stretch}
.end-modal-actions button{flex:1}
@media(max-width:650px){
  body.roleplay-active .end-btn{padding:7px 9px;font-size:10px}
  .end-modal{padding:20px 17px}
  .end-modal h3{font-size:18px}
  .end-progress{align-items:flex-start;flex-direction:column;gap:3px}
  .end-progress strong{font-size:15px}
  .end-modal-actions{display:grid;grid-template-columns:1fr}
  .end-modal-actions button{width:100%}
}


/* YouTube lecture library and practice handoff. */
.lecture-home-banner{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:20px;align-items:center;margin:26px 0 34px;padding:24px 26px;border:1px solid #d8e4f0;border-radius:24px;background:linear-gradient(135deg,#f3f8ff 0%,#fff8f1 100%);box-shadow:var(--shadow-sm)}
.lecture-home-icon{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--orange),var(--orange-deep));box-shadow:0 12px 24px rgba(255,139,56,.24);font-size:22px;padding-left:3px}
.lecture-home-banner h2{margin:4px 0 5px;font-size:21px}.lecture-home-banner p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}.lecture-home-banner .primary-btn{white-space:nowrap}
.lecture-hero{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:28px;align-items:center;padding:30px;border-radius:28px;color:#fff;background:linear-gradient(135deg,var(--navy-950),#193b64);box-shadow:var(--shadow)}
.lecture-hero-kicker{display:inline-flex;margin-bottom:9px;color:#ffb37c;font-size:11px;font-weight:900;letter-spacing:.1em}.lecture-hero h2{margin:0 0 9px;font-size:28px;line-height:1.4}.lecture-hero p{max-width:680px;margin:0;color:#c5d3e4;font-size:13px;line-height:1.8}
.lecture-progress-card{padding:20px;border:1px solid rgba(255,255,255,.13);border-radius:20px;background:rgba(255,255,255,.08)}.lecture-progress-card>strong{display:block;font-size:36px;line-height:1}.lecture-progress-card>strong small{margin-left:4px;color:#aebdd0;font-size:14px}.lecture-progress-card>span{display:block;margin:7px 0 12px;color:#c5d3e4;font-size:11px}.lecture-progress-track{height:8px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}.lecture-progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--orange),#ffc06f);transition:width .35s ease}
.lecture-category-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:20px 0}.lecture-category-tab{display:grid;grid-template-columns:34px 1fr;gap:1px 9px;align-items:center;padding:13px 14px;border:1.5px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);text-align:left;transition:.18s}.lecture-category-tab:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}.lecture-category-tab>span{grid-row:1/3;font-size:23px}.lecture-category-tab strong{font-size:12px}.lecture-category-tab small{color:var(--muted);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lecture-category-tab.active{border-color:var(--orange);background:#fff8f1;box-shadow:0 0 0 3px rgba(255,139,56,.11)}
.lecture-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.lecture-card{overflow:hidden;border:1px solid rgba(22,42,70,.1);border-radius:22px;background:#fff;box-shadow:var(--shadow-sm);transition:.2s}.lecture-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.lecture-card.watched{border-color:#b9e5d5}.lecture-thumbnail-button{position:relative;width:100%;aspect-ratio:16/9;padding:0;border:0;overflow:hidden;background:#0b1728}.lecture-thumbnail-button img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.lecture-thumbnail-button:hover img{transform:scale(1.025)}.lecture-thumbnail-button:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(4,12,24,.56))}.lecture-play-mark{position:absolute;z-index:2;left:50%;top:50%;width:54px;height:54px;transform:translate(-50%,-50%);display:grid;place-items:center;padding-left:4px;border-radius:50%;color:#fff;background:rgba(255,111,28,.94);box-shadow:0 8px 24px rgba(0,0,0,.26);font-size:19px}.lecture-duration{position:absolute;z-index:2;right:10px;bottom:9px;padding:5px 8px;border-radius:8px;color:#fff;background:rgba(5,13,25,.78);font-size:9px;font-weight:900}.lecture-card-body{padding:18px}.lecture-card-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;color:var(--orange-deep);font-size:9px;font-weight:900;letter-spacing:.1em}.lecture-watched-badge{padding:5px 8px;border-radius:999px;background:#edf2f7;color:#718096;letter-spacing:0}.lecture-card.watched .lecture-watched-badge{background:#e8f8f2;color:#18815d}.lecture-card h3{margin:0 0 8px;font-size:17px;line-height:1.5}.lecture-card p{min-height:42px;margin:0;color:var(--muted);font-size:11px;line-height:1.75}.lecture-card-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px}.lecture-card-actions .ghost-btn{min-height:40px;padding:0 14px;font-size:11px}.lecture-practice-link{border:0;background:transparent;color:var(--orange-deep);font-size:11px;font-weight:900}
.lecture-modal-backdrop{z-index:90;padding:16px}.lecture-modal{width:min(900px,100%);max-height:calc(100dvh - 32px);overflow:auto;padding:22px}.lecture-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:15px}.lecture-modal-head h2{margin:5px 0 0;font-size:24px;line-height:1.4}.lecture-modal-category{color:var(--orange-deep);font-size:10px;font-weight:900;letter-spacing:.08em}.lecture-modal-close{width:40px;height:40px;flex:none;border:0;border-radius:12px;background:#edf2f7;color:var(--ink);font-size:24px}.lecture-player{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:18px;background:#07111f}.lecture-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.lecture-modal-description{margin:15px 2px 0;color:var(--muted);font-size:12px;line-height:1.75}.lecture-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:17px}.lecture-modal-actions button{min-height:45px}.lecture-modal-actions .lecture-complete{border-color:#9ed9c5;background:#eaf8f3;color:#187557}.lecture-youtube-note{margin:11px 2px 0;color:#8b98a8;font-size:9px;text-align:right}.lecture-modal-open{overflow:hidden}.bottom-nav{width:min(760px,calc(100% - 24px))}.nav-btn{min-width:64px}
@media(max-width:820px){.lecture-category-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.lecture-grid{grid-template-columns:1fr}.lecture-hero{grid-template-columns:1fr 180px}}
@media(max-width:650px){.lecture-home-banner{grid-template-columns:48px minmax(0,1fr);gap:13px;padding:18px}.lecture-home-icon{width:48px;height:48px;border-radius:15px;font-size:17px}.lecture-home-banner h2{font-size:17px}.lecture-home-banner .primary-btn{grid-column:1/-1;width:100%}.lecture-hero{display:block;padding:23px 19px;border-radius:22px}.lecture-hero h2{font-size:21px}.lecture-progress-card{margin-top:18px;padding:15px}.lecture-progress-card>strong{font-size:30px}.lecture-category-tabs{display:flex;overflow-x:auto;margin:15px -14px;padding:0 14px 4px;scrollbar-width:none}.lecture-category-tab{min-width:180px}.lecture-grid{gap:13px}.lecture-card{border-radius:18px}.lecture-card-body{padding:15px}.lecture-card h3{font-size:15px}.lecture-card p{min-height:0}.lecture-modal-backdrop{align-items:end;padding:0}.lecture-modal{width:100%;max-height:94dvh;border-radius:22px 22px 0 0;padding:15px 14px calc(18px + env(safe-area-inset-bottom))}.lecture-modal-head h2{font-size:18px}.lecture-player{border-radius:13px}.lecture-modal-actions{display:grid;grid-template-columns:1fr}.lecture-modal-actions button{width:100%}.bottom-nav{width:100%}.nav-btn{min-width:0;padding:6px 5px}}

/* Production billing */
.status-banner.success{border-color:#b8e8d5;background:#eefaf5;color:#155f49}
.pricing-card.featured{border-color:#ff9c53;background:linear-gradient(145deg,#fff8f1,#fff);box-shadow:0 12px 28px rgba(255,125,36,.12)}
.pricing-card.featured .primary-btn{margin-top:14px;min-height:46px}
.contact-address{margin:14px 0;padding:14px 16px;border-radius:12px;background:#eef6ff;font-weight:800;overflow-wrap:anywhere}
.billing-action[aria-busy="true"]{cursor:progress}
@media(max-width:700px){.pricing-card.featured .primary-btn{width:100%}}

/* Keep the mobile roleplay composer inside the visible viewport. */
@media(max-width:650px){
  body.roleplay-active{
    height:var(--roleplay-viewport-height,100dvh);
    min-height:0;
    overflow:hidden;
  }
  body.roleplay-active main{
    height:calc(var(--roleplay-viewport-height,100dvh) - 68px);
    min-height:0;
    padding:8px 8px max(8px,env(safe-area-inset-bottom));
  }
  body.roleplay-active #screen-roleplay,
  body.roleplay-active .roleplay-shell,
  body.roleplay-active .conversation-panel{
    min-height:0;
    overflow:hidden;
  }
  body.roleplay-active .conversation-panel{
    display:flex;
    flex-direction:column;
  }
  body.roleplay-active .messages{
    flex:1 1 0;
    height:0;
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  body.roleplay-active .composer{
    position:relative;
    bottom:auto;
    flex:0 0 auto;
  }
  body.roleplay-active .bottom-nav{display:none}
}

/* Premium access, app sharing, and plan-aware lecture states. */
.feature-plan-badge{display:inline-flex;margin-left:7px;padding:3px 7px;border-radius:999px;background:#fff0e5;color:var(--orange-deep);font-size:9px;font-weight:900;vertical-align:middle}
.advanced-toggle.is-locked{border-color:#ead8c7;background:#fffaf5;color:#7a5a42}
.advanced-toggle.is-locked:hover{border-color:var(--orange);background:#fff6ed}
.advanced-toggle.is-loading{cursor:progress;opacity:.72}
.lecture-card.premium-locked{border-color:#e5d9cf;background:#fffdfb}
.lecture-card.premium-locked .lecture-thumbnail-button img{filter:grayscale(.35) brightness(.55)}
.lecture-card.premium-locked .lecture-play-mark{padding-left:0;background:rgba(7,17,31,.86);font-size:20px}
.lecture-card.premium-locked .lecture-watched-badge{background:#fff0e5;color:var(--orange-deep)}
.share-home-card{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 0 34px;padding:22px 26px;border:1px solid #d9e4ef;border-radius:22px;background:#fff;box-shadow:var(--shadow-sm)}
.share-home-card h2{margin:3px 0 5px;font-size:20px}.share-home-card p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}.share-home-card .secondary-btn{white-space:nowrap;background:#eef4fb}
.premium-upsell-modal,.share-modal{position:relative;width:min(500px,100%)}
.modal-corner-close{position:absolute;right:14px;top:14px;width:38px;height:38px;border:0;border-radius:12px;background:#edf2f7;color:var(--ink);font-size:22px}
.premium-upsell-icon{display:grid;place-items:center;width:58px;height:58px;margin-bottom:15px;border-radius:18px;background:#fff2e8;font-size:26px}
.premium-upsell-modal h3,.share-modal h3{padding-right:38px;font-size:22px}.premium-upsell-modal>p,.share-modal>p{color:var(--muted);line-height:1.7}
.premium-upsell-list{display:grid;gap:8px;margin:17px 0;padding:16px 16px 16px 38px;border-radius:15px;background:#f7f9fc;color:#3f5064;font-size:12px;line-height:1.5}
.share-qr-wrap{width:244px;max-width:100%;margin:18px auto;padding:12px;border:1px solid var(--line);border-radius:18px;background:#fff}.share-qr-wrap img{width:220px;aspect-ratio:1;margin:auto;border-radius:8px;background:#f2f5f8}
.share-link-field{display:grid;gap:7px;color:var(--muted);font-size:10px;font-weight:800}.share-link-field input{font-size:12px;background:#f7f9fb}
.share-privacy-note{margin:13px 0 0!important;font-size:9px!important;text-align:center}
.monetization-placement{margin:0 0 30px}.monetization-placement[hidden]{display:none}.monetization-card{position:relative;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(220px,.8fr) auto;gap:24px;align-items:center;padding:25px 28px;border:1px solid #dbe8e6;border-radius:22px;background:linear-gradient(135deg,#f3fbf9,#fff8ef);box-shadow:0 16px 34px rgba(17,48,66,.08);overflow:hidden}.monetization-card:after{content:"";position:absolute;right:-48px;bottom:-70px;width:180px;height:180px;border-radius:50%;background:rgba(244,127,38,.09);pointer-events:none}.monetization-copy{position:relative;z-index:1}.monetization-copy .eyebrow{margin:6px 0 7px}.monetization-copy h2{margin:0;font-size:clamp(20px,2.5vw,28px);letter-spacing:-.03em}.monetization-copy p{margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.75}.monetization-disclosure{display:inline-flex;padding:4px 8px;border:1px solid #d5e0e5;border-radius:999px;background:rgba(255,255,255,.78);color:#728197;font-size:8px;font-weight:900;letter-spacing:.08em}.monetization-benefits{position:relative;z-index:1;display:grid;gap:8px;margin:0;padding:0;list-style:none}.monetization-benefits li{display:flex;align-items:center;gap:7px;color:#354b5e;font-size:11px;font-weight:800}.monetization-benefits li:before{content:"✓";display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#dff5ee;color:#14795c;font-size:10px}.monetization-cta{position:relative;z-index:1;white-space:nowrap;text-decoration:none}.monetization-card.is-sponsor{border-color:#d9e3f2;background:linear-gradient(135deg,#f4f7ff,#fff)}.monetization-card.is-affiliate{border-color:#f1ddc4;background:linear-gradient(135deg,#fff9f0,#fff)}@media(max-width:760px){.monetization-card{grid-template-columns:1fr;gap:17px;padding:22px 20px}.monetization-benefits{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.monetization-benefits li{align-items:flex-start;font-size:9px}.monetization-cta{width:100%;text-align:center}}@media(max-width:430px){.monetization-benefits{grid-template-columns:1fr}}
@media(max-width:650px){
  .share-home-card{align-items:flex-start;flex-direction:column;padding:18px}.share-home-card .secondary-btn{width:100%}
  .premium-upsell-modal,.share-modal{max-height:calc(100dvh - 28px);overflow:auto;padding:20px 17px calc(20px + env(safe-area-inset-bottom))}
  .premium-upsell-modal .modal-actions,.share-modal-actions{display:grid;grid-template-columns:1fr}.premium-upsell-modal .modal-actions button,.share-modal-actions button{width:100%}
  .hero-actions .primary-btn,.hero-actions .secondary-btn{flex:1 1 150px}
}

/* Temporary server-authorized developer preview. Remove after the trial period. */
.developer-preview-panel{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.85fr);gap:18px 28px;align-items:center;margin:-7px 0 28px;padding:20px 22px;border:1px dashed #74869a;border-radius:20px;background:linear-gradient(135deg,#f7f9fc,#eef4fb);box-shadow:var(--shadow-sm)}
.developer-preview-panel[hidden]{display:none}
.developer-preview-panel:before{content:"ADMIN";position:absolute;right:16px;top:-10px;padding:4px 9px;border-radius:999px;background:#35465a;color:#fff;font-size:8px;font-weight:900;letter-spacing:.16em}
.developer-preview-panel.is-active{border-style:solid;border-color:#e2a15e;background:linear-gradient(135deg,#fff9f1,#f6f9fc)}
.developer-preview-panel.is-premium{border-color:#b88aef;background:linear-gradient(135deg,#fbf7ff,#f3f7ff)}
.developer-preview-copy h2{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:3px 0 5px;font-size:18px}.developer-preview-copy p{margin:0;color:var(--muted);font-size:11px;line-height:1.65}
.developer-preview-badge{display:inline-flex;padding:5px 8px;border-radius:999px;background:#e7edf4;color:#3d5168;font-size:9px;font-weight:900}.developer-preview-panel.is-active .developer-preview-badge{background:#fff0df;color:#a95513}.developer-preview-panel.is-premium .developer-preview-badge{background:#eee4ff;color:#6d3eb4}
.developer-preview-controls{display:grid;gap:9px}.developer-preview-controls label{display:grid;gap:5px;color:#526479;font-size:9px;font-weight:900}.developer-preview-controls input{width:100%;min-height:42px;padding:0 12px;border:1px solid #cfd9e5;border-radius:11px;background:#fff;font-size:13px}
.developer-preview-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.developer-preview-actions button{min-height:38px;padding:0 9px;border:1px solid #cbd6e2;border-radius:10px;background:#fff;color:#3c5068;font-size:10px;font-weight:900}.developer-preview-actions button:hover,.developer-preview-actions button.selected{border-color:#ff9a4f;background:#fff3e8;color:#a94d0c}.developer-preview-actions button:disabled{cursor:progress;opacity:.6}
.developer-preview-status{margin:0;color:#9a531a;font-size:10px;font-weight:800}.developer-preview-warning{grid-column:1/-1;margin:0;padding-top:10px;border-top:1px solid rgba(87,107,132,.15);color:#738195;font-size:9px;line-height:1.6}
@media(max-width:760px){.developer-preview-panel{grid-template-columns:1fr;margin:0 0 24px;padding:18px}.developer-preview-warning{grid-column:auto}.developer-preview-actions{grid-template-columns:1fr}.developer-preview-actions button{min-height:42px}}
.admin-menu-button{min-height:38px;padding:0 12px;border:1px solid rgba(255,174,91,.45);border-radius:11px;color:#ffd2aa;background:rgba(255,139,56,.12);font-size:11px;font-weight:900}.admin-menu-button:hover,.admin-menu-button.is-active{color:#fff;background:#d86d20}.admin-menu-button[hidden]{display:none}
@media(max-width:600px){.admin-menu-button{width:40px;padding:0;font-size:0}.admin-menu-button:after{content:'管理';font-size:10px}}

/* Mobile conversation view: prioritize the message history like a messaging app. */
@media(max-width:650px){
  body.roleplay-active .roleplay-shell{grid-template-rows:64px minmax(0,1fr);gap:6px}
  body.roleplay-active .customer-panel{grid-template-columns:58px minmax(0,1fr);grid-template-rows:32px 32px;height:64px;border-radius:14px}
  body.roleplay-active .customer-top{grid-column:2;grid-row:1;padding:7px 9px 0;align-items:center}
  body.roleplay-active .customer-role{display:none}
  body.roleplay-active .avatar-stage{height:64px}
  body.roleplay-active .avatar-stage #avatarImage{height:62px;border-radius:9px 9px 0 0}
  body.roleplay-active .emotion-label,body.roleplay-active .meters .meter-row:nth-child(n+2){display:none}
  body.roleplay-active .meters{grid-column:2;grid-row:2;padding:1px 9px 7px;gap:0}
  body.roleplay-active .meter-row{grid-template-columns:30px 1fr 22px}
  body.roleplay-active .conversation-panel{border-radius:14px;background:#8fb7c8}
  body.roleplay-active .conversation-head{padding:6px 10px;background:#f7fafb;border-bottom-color:rgba(22,42,70,.12)}
  body.roleplay-active .messages{padding:12px 9px 18px;background:linear-gradient(180deg,#91b9c9 0,#a9c8d2 100%);scroll-padding-bottom:16px}
  body.roleplay-active .message{margin-bottom:10px}
  body.roleplay-active .message>div{max-width:88%}
  body.roleplay-active .bubble{max-width:100%;padding:9px 12px;border:0;border-radius:16px;font-size:13px;line-height:1.55;box-shadow:0 1px 3px rgba(23,48,62,.18)}
  body.roleplay-active .message.ai .bubble{border:0;border-bottom-left-radius:4px;background:#fff}
  body.roleplay-active .message.user .bubble{border-bottom-right-radius:4px;color:#183143;background:#9bea72}
  body.roleplay-active .bubble-meta{color:#3e6171;text-align:right;font-size:9px}
  body.roleplay-active .voice-banner{display:none}
  body.roleplay-active .composer{padding:7px 8px max(7px,env(safe-area-inset-bottom));background:#f7f8f9}
  body.roleplay-active .composer-tools{display:none}
  body.roleplay-active .composer-row{grid-template-columns:40px minmax(0,1fr) 40px;gap:7px;align-items:end}
  body.roleplay-active .mic-btn,body.roleplay-active .send-btn{height:40px;border-radius:50%}
  body.roleplay-active #messageInput{min-height:40px;max-height:96px;border:0;border-radius:20px;padding:9px 13px;background:#fff;box-shadow:inset 0 0 0 1px #d9e1e5;font-size:16px}
}
@media(max-width:650px){
  body.roleplay-active main{display:flex;flex-direction:column}
  body.roleplay-active #screen-roleplay{flex:1 1 0;height:auto}
  body.roleplay-active .roleplay-shell{height:100%}
}

/* Keep the conversation controls reachable on desktop and above mobile keyboards. */
.conversation-head-actions{display:flex;align-items:center;gap:10px;min-width:0}
.roleplay-end-header{flex:none;border:1px solid #efb8b8;border-radius:10px;background:#fff3f3;color:#b93434;padding:8px 12px;font-size:11px;font-weight:900;white-space:nowrap}
.roleplay-end-header:hover{background:#ffe8e8;border-color:#df8888}

@media(max-width:650px){
  body.roleplay-active{
    position:fixed;
    top:var(--roleplay-viewport-offset-top,0px);
    right:0;
    bottom:auto;
    left:0;
    width:100%;
    height:var(--roleplay-viewport-height,100dvh);
  }
  body.roleplay-active main{
    height:calc(var(--roleplay-viewport-height,100dvh) - 68px);
    padding-bottom:0;
  }
  body.roleplay-active .conversation-panel{background:#fff}
  body.roleplay-active .conversation-head{display:flex;gap:8px;padding:7px 9px;background:#fbfcfe}
  body.roleplay-active .conversation-head-actions{margin-left:auto}
  body.roleplay-active .phase-pills{display:none}
  body.roleplay-active .roleplay-end-header{padding:7px 9px;font-size:10px}
  body.roleplay-active .messages{padding:12px 10px 16px;background:linear-gradient(180deg,#f4f7fa 0,#fff 100%);scroll-padding-bottom:12px}
  body.roleplay-active .message.user .bubble{color:#fff;background:linear-gradient(135deg,var(--navy-700),var(--navy-800))}
  body.roleplay-active .bubble-meta{color:#8290a2}
  body.roleplay-active .composer{
    position:sticky;
    bottom:0;
    z-index:10;
    flex:0 0 auto;
    padding:8px 8px max(8px,env(safe-area-inset-bottom));
    background:#fff;
    box-shadow:0 -5px 18px rgba(15,32,54,.08);
  }
  body.roleplay-active #messageInput{border:1px solid #d9e1e5;box-shadow:none;background:#fff}
  body.roleplay-active.roleplay-keyboard-open .roleplay-shell{grid-template-rows:minmax(0,1fr);gap:0}
  body.roleplay-active.roleplay-keyboard-open .customer-panel{display:none}
  body.roleplay-active.roleplay-keyboard-open .conversation-panel{border-radius:12px}
  body.roleplay-active.roleplay-keyboard-open .conversation-head{padding-block:5px}
}

/* Time-limit wrap-up controls. */
.time-limit-action{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px;padding:9px 10px;border:1px solid #f0c889;border-radius:12px;background:#fff8e8;color:#765219;font-size:11px;font-weight:800}
.time-limit-action[hidden]{display:none}
.time-limit-action button{flex:none;border:0;border-radius:9px;background:var(--red);color:#fff;padding:8px 11px;font-size:11px;font-weight:900}
@media(max-width:650px){body.roleplay-active .time-limit-action{align-items:stretch;flex-direction:column}body.roleplay-active .time-limit-action button{min-height:40px;width:100%}}

/* iOS Chrome/Safari: anchor the whole roleplay workspace to the visual viewport.
   Keeping the header outside this fixed workspace can push the composer below the
   keyboard when browser toolbars resize or offset the visual viewport. */
@supports (-webkit-touch-callout:none){
  @media(max-width:650px){
    body.roleplay-active{position:static;width:auto;height:auto;overflow:hidden}
    body.roleplay-active .topbar{display:none}
    body.roleplay-active main{
      position:fixed;
      z-index:40;
      top:var(--roleplay-viewport-offset-top,0px);
      right:0;
      bottom:auto;
      left:0;
      width:100%;
      height:var(--roleplay-viewport-height,100dvh);
      padding:6px 6px max(6px,env(safe-area-inset-bottom));
      overflow:hidden;
    }
    body.roleplay-active #screen-roleplay,
    body.roleplay-active .roleplay-shell,
    body.roleplay-active .conversation-panel{height:100%;min-height:0}
    body.roleplay-active .composer{
      display:block!important;
      position:relative!important;
      inset:auto!important;
      flex:0 0 auto;
      visibility:visible!important;
      opacity:1!important;
      pointer-events:auto!important;
    }
    body.roleplay-active .composer-row{display:grid!important}
    body.roleplay-active .mic-btn,
    body.roleplay-active #messageInput,
    body.roleplay-active .send-btn{visibility:visible!important;opacity:1!important;pointer-events:auto!important}
  }
}
.brand-name-short{display:none}
@media(max-width:720px){.brand-name-full{display:none}.brand-name-short{display:inline}.brand-name{font-size:14px;letter-spacing:.01em}}
.info-plan-table{margin:22px 0}.info-plan-table+.plan-comparison-actions{margin:20px 0}.info-section .plan-comparison-row strong{font-size:13px}
@media(max-width:520px){.info-section .plan-comparison-actions{flex-direction:column}.info-section .plan-comparison-actions button{width:100%}}


/* AI business dialogue advisor */
.advisor-home-card{display:grid;grid-template-columns:104px minmax(0,1fr) auto;gap:22px;align-items:center;margin:28px 0 8px;padding:22px 24px;border:1px solid rgba(22,166,161,.2);border-radius:24px;background:linear-gradient(135deg,#effbfa,#fff 58%,#fff7ed);box-shadow:var(--shadow-sm)}
.advisor-home-avatar{width:104px;height:104px;border-radius:22px;object-fit:cover;border:4px solid #fff;box-shadow:0 10px 28px rgba(18,83,92,.16)}
.advisor-home-copy h2{font-size:clamp(20px,2.4vw,29px);margin-bottom:7px}.advisor-home-copy p{margin:0;color:var(--muted);line-height:1.7}.learning-cycle{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:13px}.learning-cycle span{padding:6px 9px;border-radius:999px;background:#fff;color:#35536a;border:1px solid #dce9ea;font-size:10px;font-weight:900}.learning-cycle b{color:var(--teal);font-size:11px}
.advisor-page{width:min(980px,100%);margin:0 auto}.advisor-page-header{width:min(980px,100%);margin-left:auto;margin-right:auto}.advisor-clear{margin-left:auto;min-height:42px;padding-inline:14px;font-size:11px}
.advisor-intro-card{display:grid;grid-template-columns:92px minmax(0,1fr);gap:18px;align-items:center;padding:20px;border-radius:24px;color:#fff;background:linear-gradient(135deg,var(--navy-950),#15445b);box-shadow:var(--shadow)}.advisor-intro-card img{width:92px;height:92px;border-radius:20px;object-fit:cover;border:3px solid rgba(255,255,255,.75)}.advisor-intro-card h3{font-size:20px;margin-bottom:6px}.advisor-intro-card p{margin:0;color:#c7d9e4;line-height:1.7}.advisor-intro-card span{display:block;margin-top:8px;color:#77d8d2;font-size:10px;font-weight:900}
.advisor-example-area{margin:18px 0 12px}.advisor-example-area>strong{display:block;margin-bottom:9px;font-size:12px}.advisor-chips{display:flex;gap:8px;overflow-x:auto;padding:2px 1px 7px;scrollbar-width:thin}.advisor-chip{flex:0 0 auto;max-width:330px;padding:9px 12px;border:1px solid #d8e5e7;border-radius:999px;background:#fff;color:#365064;font-size:11px;font-weight:800;text-align:left}.advisor-chip:hover{border-color:var(--teal);background:#effbfa}
.advisor-messages{min-height:400px;max-height:650px;overflow-y:auto;padding:22px;border:1px solid var(--line);border-radius:24px 24px 0 0;background:linear-gradient(180deg,#f4f9fa,#fff);scroll-behavior:smooth}.advisor-message{display:flex;gap:11px;align-items:flex-start;margin-bottom:18px}.advisor-message.assistant>img{flex:none;width:48px;height:48px;border-radius:14px;object-fit:cover;box-shadow:0 5px 14px rgba(18,62,74,.14)}.advisor-message.assistant>div{width:min(760px,calc(100% - 59px))}.advisor-message.user{justify-content:flex-end}.advisor-user-bubble{max-width:min(78%,660px);padding:13px 16px;border-radius:18px 18px 5px 18px;color:#fff;background:linear-gradient(135deg,var(--navy-700),var(--navy-900));line-height:1.7;white-space:pre-wrap;word-break:break-word}
.advisor-response-card{overflow:hidden;border:1px solid #dce6eb;border-radius:5px 18px 18px 18px;background:#fff;box-shadow:0 6px 18px rgba(13,47,62,.07)}.advisor-response-card section{padding:14px 16px}.advisor-response-card section+section{border-top:1px solid #e8eef2}.advisor-response-card h4{margin:0 0 7px;color:#315167;font-size:11px;letter-spacing:.03em}.advisor-response-card p{margin:0;line-height:1.75;white-space:pre-wrap}.advisor-response-card ul{display:grid;gap:6px;margin:0;padding-left:20px;line-height:1.65}.advisor-example{background:#effaf7}.advisor-example p{font-weight:800;color:#184e46}.advisor-avoid{background:#fff8ef}.advisor-avoid p{color:#805325}.advisor-follow-up{margin:0!important;padding:12px 16px;border-top:1px solid #e8eef2;color:#5f6f80;font-size:12px}.advisor-practice-btn{width:100%;min-height:48px;border:0;border-top:1px solid #dfeaed;background:#eaf7f6;color:#176e69;font-weight:900}.advisor-practice-btn:hover{background:#daf1ef}
.advisor-thinking{display:flex;align-items:center;gap:5px;padding:14px 16px;border:1px solid #dce6eb;border-radius:5px 18px 18px 18px;background:#fff}.advisor-thinking i{width:7px;height:7px;border-radius:50%;background:var(--teal);animation:typing 1s infinite ease-in-out}.advisor-thinking i:nth-child(2){animation-delay:.15s}.advisor-thinking i:nth-child(3){animation-delay:.3s}.advisor-thinking span{margin-left:6px;color:var(--muted);font-size:11px}
.advisor-composer{position:relative;padding:16px;border:1px solid var(--line);border-top:0;border-radius:0 0 24px 24px;background:#fff;box-shadow:var(--shadow-sm)}.advisor-composer label{display:block;margin-bottom:8px;font-size:12px;font-weight:900}.advisor-composer textarea{min-height:104px;font-size:16px;line-height:1.6}.advisor-composer-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}.advisor-composer-footer>span{color:var(--muted);font-size:10px}.advisor-composer-footer .primary-btn{min-width:156px;min-height:46px}.advisor-composer>p{margin:10px 0 0;color:#7b8898;font-size:9px;line-height:1.6}
.bottom-nav{width:min(900px,calc(100% - 24px))}
@media(max-width:760px){.advisor-home-card{grid-template-columns:76px minmax(0,1fr);padding:18px}.advisor-home-avatar{width:76px;height:76px;border-radius:18px}.advisor-home-card>.primary-btn{grid-column:1/-1;width:100%}.learning-cycle{gap:5px}.learning-cycle span{font-size:9px}}
@media(max-width:650px){.advisor-page-header{align-items:flex-start}.advisor-page-header .advisor-clear{min-height:38px;padding:0 10px}.advisor-intro-card{grid-template-columns:68px minmax(0,1fr);gap:13px;padding:16px;border-radius:19px}.advisor-intro-card img{width:68px;height:68px;border-radius:16px}.advisor-intro-card h3{font-size:16px}.advisor-intro-card p{font-size:11px}.advisor-example-area{margin-inline:-14px;padding-inline:14px}.advisor-chips{scrollbar-width:none}.advisor-chip{max-width:280px}.advisor-messages{min-height:48vh;max-height:none;margin:0 -8px;padding:15px 9px;border-radius:17px 17px 0 0}.advisor-message.assistant>img{width:38px;height:38px;border-radius:11px}.advisor-message.assistant>div{width:calc(100% - 49px)}.advisor-response-card section{padding:12px 13px}.advisor-response-card p,.advisor-response-card li{font-size:13px}.advisor-user-bubble{max-width:88%;font-size:13px}.advisor-composer{position:sticky;z-index:18;bottom:72px;margin:0 -8px;padding:10px 9px calc(10px + env(safe-area-inset-bottom));border-radius:0;background:#fff}.advisor-composer textarea{min-height:78px;max-height:130px}.advisor-composer-footer .primary-btn{min-width:140px}.bottom-nav{width:100%}.bottom-nav .nav-btn{min-width:0;padding-inline:2px;font-size:9px}.bottom-nav .nav-btn svg{width:19px;height:19px}}

.admax-card{display:grid;justify-items:center;gap:7px;width:min(100%,340px);margin:0 auto;padding:14px 12px 18px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--shadow-sm);overflow:hidden}.admax-disclosure{color:var(--muted);font-size:9px;letter-spacing:.12em}.admax-ads{max-width:300px;overflow:hidden;background:#f5f7fa}.admax-card.is-unavailable .admax-ads:empty:after{content:'広告を読み込めませんでした';display:grid;place-items:center;width:300px;height:250px;color:var(--muted);font-size:11px}

.advisor-quota{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px;padding:10px 12px;border:1px solid #dbe6f2;border-radius:12px;background:#f5f8fc;color:#43566d;font-size:11px;font-weight:800}.advisor-quota button{border:0;background:transparent;color:var(--orange-deep);font-size:10px;font-weight:900;white-space:nowrap}.advisor-quota.is-premium{border-color:#cce9df;background:#effaf6;color:#176b52}.advisor-quota.is-exhausted{border-color:#f1d2ce;background:#fff3f1;color:#9d342e}@media(max-width:520px){.advisor-quota{align-items:flex-start;flex-direction:column}.advisor-quota button{padding:0}}