*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#080a10;color:#f4f1ea;font-family:"Hiragino Mincho ProN","Yu Mincho",YuMincho,"Noto Serif JP",serif}button{font:inherit}.hidden{display:none!important}.app{min-height:100dvh}.screen{min-height:100dvh;position:relative;overflow:hidden}.title-screen{display:grid;place-items:center;background:radial-gradient(circle at 62% 18%,rgba(73,82,112,.22),transparent 34%),linear-gradient(180deg,#10131d 0%,#090b11 55%,#050609 100%)}.title-bg,.story-bg{position:absolute;inset:0;pointer-events:none}.title-bg:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 49.7%,rgba(255,255,255,.035) 49.9% 50.1%,transparent 50.3%),linear-gradient(180deg,transparent 0 67%,rgba(255,255,255,.018) 67.2% 67.4%,transparent 67.6%);opacity:.55}.title-inner{position:relative;z-index:1;width:min(760px,88vw);text-align:center;padding:56px 0}.title-date{font-size:13px;letter-spacing:.18em;opacity:.65;margin-bottom:14px}.title-time{font-size:clamp(42px,8vw,84px);font-weight:300;letter-spacing:.08em;margin-bottom:14px}.title-inner h1{font-size:clamp(28px,5vw,54px);font-weight:500;letter-spacing:.08em;margin:0}.title-lead{margin:20px auto 34px;max-width:540px;font-size:15px;line-height:2;color:rgba(244,241,234,.72)}.title-actions{display:flex;flex-direction:column;gap:11px;align-items:center}.main-btn,.sub-btn,.text-btn,.choice-btn{border:0;cursor:pointer;transition:.18s ease}.main-btn{min-width:260px;padding:16px 26px;border-radius:999px;background:#f3efe5;color:#171a22;font-weight:700;box-shadow:0 9px 28px rgba(0,0,0,.28)}.main-btn:hover{transform:translateY(-1px)}.sub-btn{min-width:260px;padding:14px 22px;border-radius:999px;background:rgba(255,255,255,.07);color:#f5f1e8;border:1px solid rgba(255,255,255,.13)}.text-btn{margin-top:4px;background:none;color:rgba(244,241,234,.46);padding:8px 14px;font-size:13px}.story-screen{background:#0a0d13}.story-bg{background:radial-gradient(circle at 70% 18%,rgba(52,72,104,.25),transparent 38%),linear-gradient(180deg,#111621 0%,#0a0d13 58%,#06080c 100%);transition:background .5s ease}.story-screen[data-tone="morning"] .story-bg{background:radial-gradient(circle at 72% 22%,rgba(193,173,137,.22),transparent 36%),linear-gradient(180deg,#575e67 0%,#343a43 58%,#1d2229 100%)}.story-screen[data-tone="station-day"] .story-bg{background:linear-gradient(180deg,#7f8790 0%,#535a63 44%,#232933 100%)}.story-screen[data-tone="station-night"] .story-bg{background:radial-gradient(circle at 70% 23%,rgba(161,126,74,.16),transparent 20%),linear-gradient(180deg,#131a25 0%,#0c1119 58%,#05070b 100%)}.story-screen[data-tone="phone"] .story-bg{background:radial-gradient(circle at 50% 38%,rgba(85,103,136,.24),transparent 24%),linear-gradient(180deg,#0e121b 0%,#080b11 100%)}.story-topbar{position:relative;z-index:2;display:grid;grid-template-columns:52px 1fr 52px;align-items:center;padding:max(14px,env(safe-area-inset-top)) 14px 8px}.scene-date{text-align:center;font-size:12px;letter-spacing:.1em;color:rgba(244,241,234,.58)}.icon-btn{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.22);color:#fff;font-size:30px;line-height:1;cursor:pointer}.record-icon{font-size:17px}.story-stage{position:relative;z-index:1;min-height:calc(100dvh - 66px);display:flex;align-items:flex-end;justify-content:center;padding:28px 18px max(28px,env(safe-area-inset-bottom))}.story-card{width:min(780px,100%);background:linear-gradient(180deg,rgba(8,11,17,.65),rgba(8,10,15,.86));border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(12px);border-radius:24px;padding:24px;box-shadow:0 20px 60px rgba(0,0,0,.28)}.story-text{font-size:clamp(16px,2.5vw,20px);line-height:2.05;letter-spacing:.03em}.story-text p{margin:0 0 1em}.story-text .strong{font-size:1.12em;font-weight:700;letter-spacing:.08em}.story-text .quote{padding:14px 16px;margin:18px 0;border-left:2px solid rgba(255,255,255,.28);background:rgba(255,255,255,.035)}.choices{display:flex;flex-direction:column;gap:10px;margin-top:22px}.choice-btn{width:100%;text-align:left;padding:15px 16px;border-radius:14px;background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.1);line-height:1.6}.choice-btn:hover{background:rgba(255,255,255,.12)}.choice-btn.new-choice{border-color:rgba(255,255,255,.28);box-shadow:0 0 0 1px rgba(255,255,255,.04) inset}.choice-no{display:inline-block;min-width:2.1em;opacity:.72}.end-screen{display:grid;place-items:center;background:radial-gradient(circle at 50% 25%,rgba(67,80,113,.24),transparent 34%),#080a0f}.end-inner{width:min(700px,88vw);text-align:center}.end-no{font-size:12px;letter-spacing:.24em;color:rgba(244,241,234,.48);margin-bottom:15px}.end-inner h2{font-size:clamp(32px,6vw,58px);font-weight:500;letter-spacing:.08em;margin:0 0 25px}.end-text{font-size:17px;line-height:2.1;color:rgba(244,241,234,.82);margin-bottom:30px}.end-inner .sub-btn{display:block;margin:10px auto 0}.modal{position:fixed;inset:0;z-index:20;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:18px}.modal-panel{position:relative;width:min(760px,100%);max-height:86dvh;overflow:auto;background:#11151d;border:1px solid rgba(255,255,255,.1);border-radius:22px;padding:28px}.modal-close{position:absolute;right:15px;top:12px;border:0;background:none;color:#fff;font-size:30px;cursor:pointer}.modal-panel h2{margin:0 36px 22px 0}.modal-body{line-height:1.9}.end-list{display:grid;gap:10px}.end-row{padding:13px 14px;border-radius:12px;background:rgba(255,255,255,.05);display:flex;gap:12px;align-items:baseline}.end-row.locked{opacity:.42}.end-code{min-width:70px;font-size:12px;letter-spacing:.08em}.reader h3{margin:32px 0 12px;font-size:22px}.reader p{margin:0 0 1em}.reader .final-title{text-align:center;font-size:30px;margin:40px 0 20px}.reader .final-quote{text-align:center;font-size:18px;line-height:2}.confirm-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.confirm-actions button{flex:1;min-width:180px}@media(max-width:640px){.story-card{padding:20px 16px;border-radius:20px}.story-stage{padding-left:12px;padding-right:12px}.title-inner{width:90vw}.main-btn,.sub-btn{width:min(310px,86vw)}}

.fragment-list{display:grid;gap:12px}
.fragment-row{padding:15px 16px;border-radius:14px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07)}
.fragment-row.locked{opacity:.38;min-height:54px}
.fragment-head{display:flex;align-items:baseline;gap:12px}
.fragment-code{min-width:28px;font-size:12px;letter-spacing:.12em;color:rgba(244,241,234,.52)}
.fragment-desc{margin-top:8px;padding-left:40px;color:rgba(244,241,234,.72);font-size:14px;line-height:1.8}
.record-menu{display:grid;gap:12px}
.record-menu .sub-btn{width:100%;min-width:0}

/* Ver.8: text-only story presentation */
.story-bg{
  background:
    radial-gradient(circle at 70% 18%,rgba(52,72,104,.10),transparent 38%),
    linear-gradient(180deg,#10131c 0%,#090b11 58%,#06070a 100%);
}
.story-card{
  background:linear-gradient(180deg,rgba(8,11,17,.72),rgba(8,10,15,.90));
  backdrop-filter:none;
}
.story-text{ text-shadow:none; }
.choice-btn{ background:rgba(255,255,255,.08); }

/* END余韻 */
.end-text{
  margin-top:8px;
  margin-bottom:38px;
  line-height:2.25;
}
.end-inner h2{ margin-bottom:30px; }
.end-no{ margin-bottom:18px; }
@media(max-width:640px){
  .end-text{ margin-bottom:34px; line-height:2.2; }
}