.story-shell{width:min(720px,calc(100% - 28px));padding:34px 0 80px}.story-shell h1{font-size:clamp(48px,12vw,72px);line-height:.94}.story-intro{color:var(--muted);font-size:18px;line-height:1.5}.story-editor{max-width:none;padding:18px;border-radius:16px}.voice-recorder{text-align:center;padding:24px 16px;background:#f1e5cb}.voice-kicker{margin:0 0 17px;color:var(--wine);font:700 11px Arial,sans-serif;letter-spacing:.16em}.record-button{width:150px;height:150px;margin:auto;border:8px solid #fff8;border-radius:50%;background:var(--wine);color:#fff;display:grid;place-content:center;gap:8px;box-shadow:0 7px 0 var(--wine-dark),0 10px 28px #4b1e1d33;font:700 18px Arial,sans-serif;cursor:pointer}.record-button.is-recording{animation:pulse 1.4s infinite;background:#a31f25}.record-dot{width:32px;height:32px;margin:auto;border-radius:50%;background:#fff}.is-recording .record-dot{border-radius:5px}.voice-recorder>p:not(.voice-kicker){max-width:430px;margin:18px auto 0;color:var(--muted);font:14px/1.45 Arial,sans-serif}.voice-recorder .record-timer{color:var(--wine);font-weight:700;font-variant-numeric:tabular-nums}.voice-recorder audio{width:min(100%,420px);margin:18px auto 0}.record-actions{display:flex;justify-content:center;gap:12px;margin-top:15px}.record-actions button{border:0;background:none;color:var(--wine);font-weight:700;text-decoration:underline;cursor:pointer}.save-story-button{min-width:150px;text-align:center}.how-page{max-width:920px;padding:72px 0 100px;text-align:center}.how-page h1{font-size:clamp(54px,8vw,86px)}.how-lead{max-width:700px;margin:24px auto 48px;color:var(--muted);font-size:21px;line-height:1.6}.how-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;text-align:left}.how-steps article{background:#fffaf0;border:1px solid #2d231e22;border-radius:16px;padding:28px}.how-steps span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--wine);color:#fff;font-weight:700}.how-steps h2{margin:20px 0 8px;font-size:30px}.how-steps p{color:var(--muted);font-size:17px;line-height:1.6}.how-cta{margin-top:38px}.header-cta{padding:10px 16px;box-shadow:none}@keyframes pulse{50%{transform:scale(1.04);box-shadow:0 7px 0 var(--wine-dark),0 0 0 16px #772e2e18}}
@media(max-width:760px){
  .story-page{background:#f7f1e5;-webkit-tap-highlight-color:transparent;padding-bottom:calc(88px + env(safe-area-inset-bottom))}
  .story-page .app-header{position:sticky;z-index:20;top:0;width:100%;min-height:58px;padding:8px 18px;border-bottom:1px solid #2d231e18;background:#f7f1e5e8;align-items:center;backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px)}
  .story-page .app-header>a{display:flex;align-items:center;width:47px;height:42px;overflow:hidden}
  .story-page .app-header img{width:58px;max-width:none}
  .story-page .app-header nav{margin-left:auto;gap:4px;font:600 14px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}
  .story-page .app-header nav a{padding:11px 10px;border-radius:10px;color:var(--wine)}
  .story-page .app-header nav a:first-child,.story-page .app-header nav a:nth-child(3){display:none}
  .story-shell{width:100%;padding:24px 18px 20px}
  .story-shell>.eyebrow{margin-bottom:7px;font:700 11px/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif;letter-spacing:.15em}
  .story-shell h1{margin:0;font-size:42px;line-height:1.02;letter-spacing:-.035em}
  .story-intro{margin:12px 0 22px;font:17px/1.4 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}
  .mode-tabs{position:relative;display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:3px;margin:0 0 18px;padding:3px;border-radius:12px;background:#2d231e12}
  .mode-tabs button{min-height:40px;padding:8px 5px;border:0;border-radius:9px;font:600 13px/1.1 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif;transition:background .18s,box-shadow .18s,color .18s}
  .mode-tabs button.active{background:#fffdf8;color:var(--wine);box-shadow:0 1px 4px #2d231e24}
  .story-editor{padding:0;border:0;border-radius:0;background:transparent}
  .voice-recorder{margin-bottom:18px;padding:20px 16px;border:1px solid #2d231e14;border-radius:18px;background:#efe4cb;box-shadow:0 1px 1px #fff8 inset}
  .voice-kicker{margin-bottom:14px;font:700 11px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}
  .record-button{width:112px;height:112px;border-width:6px;gap:5px;box-shadow:0 5px 0 var(--wine-dark),0 10px 25px #4b1e1d22;font:700 16px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif;touch-action:manipulation}
  .record-dot{width:25px;height:25px}
  .voice-recorder>p:not(.voice-kicker){margin-top:15px;font:14px/1.4 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}
  .voice-recorder .record-timer{margin-top:8px;font-size:17px}
  .record-actions{flex-wrap:wrap;gap:8px}
  .record-actions button{min-height:40px;padding:8px 10px;text-decoration:none}
  .story-editor label{gap:7px;margin:0 0 16px;font:600 14px/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}
  .story-editor input,.story-editor textarea{border:1px solid #2d231e20;border-radius:14px;background:#fffdf9;padding:14px 15px;color:var(--ink);font:17px/1.45 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif;box-shadow:0 1px 2px #2d231e08;-webkit-appearance:none}
  .story-editor input{min-height:52px}
  .story-editor textarea{min-height:260px;resize:vertical}
  .story-editor input:focus,.story-editor textarea:focus{outline:0;border-color:#772e2e66;box-shadow:0 0 0 3px #772e2e12}
  .story-editor input::placeholder,.story-editor textarea::placeholder{color:#8a8175;opacity:.65}
  .ai-tools{margin:0 0 18px;padding:14px;border:0;border-radius:16px;background:#efe8da;gap:9px}
  .ai-button{min-height:42px;padding:10px 14px;border:0;border-radius:11px;background:#fffdf9;box-shadow:0 1px 3px #2d231e16;font:600 14px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}
  .ai-tools span{font:13px/1.4 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}
  .editor-actions{position:fixed;z-index:19;right:0;bottom:0;left:0;display:block;padding:10px 18px calc(10px + env(safe-area-inset-bottom));border-top:1px solid #2d231e18;background:#f7f1e5e8;backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px)}
  .editor-actions>span{display:none}
  .save-story-button{width:100%;min-height:50px;padding:14px;border-radius:13px;box-shadow:none;font:700 17px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}
  .prompt-box{margin-bottom:18px;border-radius:16px}
  .how-page{padding:48px 0 75px}.how-steps{grid-template-columns:1fr}.how-lead{font-size:18px}.header-cta{display:none}
}
[hidden]{display:none!important}

/* Story composer: compact, text-first, iOS-inspired controls */
.story-page{padding-bottom:100px}.story-header{position:sticky;z-index:30;top:0;width:min(720px,100%);height:60px;min-height:60px;margin:auto;padding:8px 18px;border-bottom:1px solid #2d231e18;background:#f8f1e2e8;backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px)}.story-mark{display:grid;place-items:center;width:42px;height:42px}.story-header .story-mark img{width:34px;height:34px;object-fit:contain}.story-account{display:grid;place-items:center;width:38px;height:38px;overflow:hidden;border-radius:50%;background:var(--ink);color:#fff;text-decoration:none;font:700 12px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}.story-header .story-account img{width:100%;height:100%;object-fit:cover}.story-shell{text-align:center}.story-intro,.mode-tabs,.story-editor{margin-right:auto;margin-left:auto}.mode-tabs{justify-content:center}.story-editor{max-width:720px;text-align:left}.voice-recorder{width:min(440px,100%);margin:0 auto 16px;padding:14px!important;border:0!important;border-radius:24px!important;background:#0b0b0d!important;color:#fff;box-shadow:0 16px 40px #0002;text-align:center}.voice-kicker{margin:2px 0 5px!important;color:#aaa!important;font:700 11px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif!important;letter-spacing:.13em}.voice-recorder .record-timer{margin:0!important;color:#f2f2f7!important;font:500 18px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif!important;font-variant-numeric:tabular-nums}.record-button{position:relative;display:grid;place-items:center;width:72px!important;height:72px!important;margin:9px auto 4px!important;border:4px solid #f5f5f7!important;border-radius:50%;background:transparent!important;box-shadow:none!important;font-size:0!important}.record-button:before{content:"";display:block;width:52px;height:52px;border-radius:50%;background:#ff3b30;transition:transform .16s,border-radius .16s}.record-button.is-recording:before{width:28px;height:28px;border-radius:7px}.record-button.is-recording{animation:none!important}.record-button .record-dot,.record-button span:last-child{display:none}.voice-recorder>p:not(.voice-kicker):not(.record-timer){margin:3px 0 0!important;color:#8e8e93!important;font:13px/1.3 -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif!important}.voice-recorder audio{width:min(100%,360px);height:34px;margin:10px auto 0}.record-actions{display:flex;justify-content:center;gap:22px;margin-top:12px}.record-actions button{display:grid;justify-items:center;gap:5px;min-width:44px;padding:0;border:0;background:none;color:#b8b8bd;text-decoration:none;font:500 11px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}.record-actions button span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#2c2c2e;color:#fff;font-size:18px}.record-actions .delete-recording span{color:#ff453a}.autosave-status{display:flex;align-items:center;justify-content:center;gap:7px;margin:14px 0;color:#756a5d;font:500 13px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}.autosave-status:before{content:"✓";display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#e4efe4;color:#27753b;font-size:12px}.editor-actions{justify-content:center}.save-story-button{width:min(360px,100%);box-shadow:none}.story-bottom-nav{position:fixed;z-index:40;left:50%;bottom:calc(8px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr 1.15fr 1fr;width:min(460px,calc(100% - 20px));padding:7px;border:1px solid #2d231e16;border-radius:22px;background:#fffdf8ed;box-shadow:0 8px 30px #2d231e20;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transform:translateX(-50%)}.story-bottom-nav a{display:grid;place-items:center;gap:3px;min-height:52px;border-radius:16px;color:#756a5d;text-decoration:none;font:600 11px -apple-system,BlinkMacSystemFont,"SF Pro Text",Arial,sans-serif}.story-bottom-nav a span{font-size:22px;line-height:1}.story-bottom-nav .active{background:var(--ink);color:#fff}
@media(max-width:760px){.story-page{padding-bottom:calc(100px + env(safe-area-inset-bottom))}.story-page .story-header{align-items:center;padding:8px 18px}.story-page .story-header .story-mark{width:42px;height:42px;overflow:visible}.story-page .story-header .story-account{width:38px;height:38px;overflow:hidden}.story-shell{padding:22px 16px 12px}.story-shell h1{font-size:40px}.story-intro{margin-bottom:18px}.story-editor textarea{min-height:210px}.voice-recorder{margin-bottom:14px;padding:13px!important}.ai-tools{margin-bottom:10px}.editor-actions{position:static;padding:0;border:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}.save-story-button{min-height:48px}.story-bottom-nav{bottom:calc(8px + env(safe-area-inset-bottom))}}
