@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&family=Noto+Sans+TC:wght@300;400;500&display=swap";:root{--bg-color: #000000;--text-primary: #FFFFFF;--text-secondary: #D1D5DB;--accent-primary: #FFFFFF;--border-color: rgba(255, 255, 255, .1);--glass-bg: rgba(255, 255, 255, .03);--font-family: "Inter", "Noto Sans TC", sans-serif;--safe-top: 50px;--safe-bottom: 50px}*{box-sizing:border-box}body{margin:0;padding:0;background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-family);height:100vh;overflow:hidden;-webkit-font-smoothing:antialiased;line-height:1.6}#root{width:100%;max-width:480px;margin:0 auto;height:100vh;position:relative;overflow:hidden}.full-screen-bg{position:fixed;top:0;left:50%;width:100%;max-width:480px;height:100%;transform:translate(-50%);background-size:cover;background-position:center;transition:background-image 1.2s cubic-bezier(.4,0,.2,1);z-index:0}.bg-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,#0000001a,#0006 30%,#000000f2);z-index:1}.app-container{position:relative;z-index:2;padding:var(--safe-top) 24px var(--safe-bottom);height:100%;display:flex;flex-direction:column;overflow:hidden}.fade-in{animation:fadeIn 1s ease-out}@keyframes fadeIn{0%{opacity:0;filter:blur(4px);transform:translateY(8px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}.chapter-view,.intro-view,.gap-view,.gate-view,.complete-view{display:flex;flex-direction:column;flex:1}h3{font-size:.95rem;font-weight:500;letter-spacing:.12em;margin:0 0 20px;opacity:.9;text-transform:uppercase}.poetical-msg,.poetical-desc{font-size:.88rem;line-height:1.95;letter-spacing:.04em;margin:0 0 20px;font-weight:300;color:#e5e7eb;text-shadow:0 1px 2px rgba(0,0,0,.8)}.footer-nav{margin-top:auto;display:flex;gap:12px;padding-top:32px;padding-bottom:10px}.btn-primary,.btn-secondary{border-radius:2px;cursor:pointer;transition:all .3s;text-transform:uppercase;font-family:var(--font-family);display:flex;align-items:center;justify-content:center;height:44px}.btn-primary{width:100%;background:#fff;color:#000;border:none;padding:15px;font-size:.85rem;font-weight:500;letter-spacing:.2em}.btn-primary:active{opacity:.7;transform:translateY(1px)}.btn-half{flex:1;width:auto!important}.dual-btn{display:flex;gap:12px}.btn-primary:disabled{background:#333;color:#666;cursor:not-allowed;opacity:.5}.btn-secondary{flex:1;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.2);padding:15px;font-size:.8rem;letter-spacing:.15em;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.options-grid{display:flex;flex-direction:column;gap:10px}.option-btn{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:14px 18px;font-size:.85rem;text-align:left;color:#e5e7eb;border:1px solid var(--border-color);border-radius:4px;transition:all .2s;cursor:pointer;font-family:var(--font-family)}.option-btn.active{background:#fffffff2;color:#000;border-color:#fff}.options-image-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.option-btn.image-option{padding:0;border-radius:4px;overflow:hidden;border:2px solid transparent;aspect-ratio:4/5;position:relative}.option-btn.active.image-option{border-color:#fff;background:none}.option-img-wrapper{width:100%;height:100%}.option-img-wrapper img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(.2) brightness(.8);transition:all .4s}.option-btn.active.image-option img{filter:grayscale(0) brightness(1.1)}.story-view{min-height:100%}.story-input-area{flex:1;display:flex;flex-direction:column;margin-bottom:8px}textarea{flex:1;width:100%;min-height:300px;box-sizing:border-box;background:#ffffff0d;border:1px solid var(--border-color);border-radius:4px;padding:18px;color:#fff;font-size:.95rem;resize:none;font-family:var(--font-family);line-height:1.8}textarea:focus{outline:none;border-color:#ffffff4d}.logistics-view{display:flex;flex-direction:column;flex:1}.input-field{width:100%;padding:14px;background:#ffffff0d;border:1px solid var(--border-color);color:#fff;margin-bottom:12px;font-family:var(--font-family);font-size:.9rem;border-radius:2px}.input-field:focus{outline:none;border-color:#fff6}.chapter-footer-text{font-size:.75rem;color:#94a3b8;margin-top:16px;letter-spacing:.05em;font-style:italic;opacity:.7}.loading-screen{background:#000;height:100vh;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8rem;letter-spacing:.3em;text-transform:uppercase}