/* Purposeful motion: an arriving message, a caught detail, a completed chapter. */
.loop-title{margin:6px 0 28px}.loop-title h1{font:clamp(30px,4vw,44px)/1.12 Georgia,serif;letter-spacing:-1px;margin:12px 0}.loop-title p,.loop-context>p,.loop-card-copy>p{font-size:17px;line-height:1.65;color:#52685b;max-width:650px}.loop-today{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;background:#e4ebdc;border:1px solid #c9d7bf;border-radius:20px;padding:28px;margin:16px 0 45px}.loop-today h2{font:30px/1.2 Georgia,serif;margin:8px 0}.loop-today p{margin:0;color:#52685b}.loop-mini-route{display:flex;gap:10px;grid-column:1/-1}.loop-mini-route span{display:grid;place-items:center;width:30px;height:30px;border:1px solid #8ba18c;border-radius:50%;font-size:14px}.loop-mini-route .complete{background:#285e50;color:white}.loop-plan{display:grid;grid-template-columns:minmax(0,2fr) minmax(230px,1fr);gap:24px}.loop-main-card,.loop-notebook,.loop-story-opening{border:1px solid #d5ddcf;border-radius:20px;overflow:hidden;background:#fffdf8}.loop-card-scene{height:220px;position:relative;background-image:url('/quest/assets/town-atlas.webp');background-size:200% 200%}.loop-card-copy{padding:25px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}.loop-card-copy h2{font:30px/1.2 Georgia,serif;margin:0}.loop-card-copy>p{margin:0}.loop-season-label,.loop-scene-tag{position:absolute;left:18px;top:18px;padding:9px 12px;background:#fffdf6f2;border-radius:8px;font-size:12px;font-weight:700;letter-spacing:1px}.loop-envelope{position:absolute;right:26px;bottom:22px;display:grid;place-items:center;width:72px;height:64px;border-radius:16px;background:#fffaf1;color:#285e50;font-size:45px;box-shadow:0 6px 18px #12372e40;animation:loop-arrive .55s ease-out both}.loop-notebook{padding:26px;background:repeating-linear-gradient(#f0eadb,#f0eadb 35px,#e7dfce 36px,#f0eadb 37px)}.loop-notebook h2{font:27px Georgia,serif;margin:14px 0 24px}.loop-notebook dl{margin:0}.loop-notebook dl div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid #c6cbb8}.loop-notebook dt{font-size:15px}.loop-notebook dd{font-weight:700;font-size:23px;margin:0}.loop-notebook>p{font-size:15px;line-height:1.6;margin:24px 0}.loop-notebook a{font-size:15px;color:#285e50}.loop-season{margin-top:40px}.loop-route{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.loop-route li a{display:flex;gap:14px;align-items:center;padding:17px;border:1px solid #d5ddcf;border-radius:14px;background:#fffdf8;color:#203c34;text-decoration:none;min-height:96px;transition:transform .18s,background .18s}.loop-route li a:hover{background:#eaf0e3;transform:translateY(-2px)}.loop-route li.complete a{border-color:#86a88a}.loop-route li a>span:nth-child(2){flex:1;display:grid;gap:5px}.loop-route strong{font-size:17px}.loop-route small{font-size:12px;color:#52685b;letter-spacing:.4px}.loop-route-number{width:34px;height:34px;border-radius:50%;background:#e7ecdd;display:grid;place-items:center;flex-shrink:0}.complete .loop-route-number{background:#285e50;color:white}.loop-other{margin:28px 0;border-top:1px solid #d5ddcf;padding-top:20px}.loop-other summary{cursor:pointer;font-size:16px}.loop-story-opening{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;margin-bottom:24px}.loop-story-opening>div:last-child{padding:24px}.loop-story-opening h2{font:28px Georgia,serif}.loop-story-opening p{line-height:1.7;font-size:17px}.loop-story-opening .loop-card-scene{height:100%;min-height:320px}.loop-top{display:flex;justify-content:space-between;gap:15px;align-items:center;margin:0 0 22px;font-size:13px;font-weight:600}.loop-top a{color:#285e50}.loop-session-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:26px;align-items:start}.loop-context h1{font:34px/1.15 Georgia,serif;margin:20px 0 10px}.loop-context>p{margin:0 0 16px}.loop-scene{position:relative;aspect-ratio:3/2;border-radius:18px;background-image:url('/quest/assets/town-atlas.webp');background-size:200% 200%;overflow:hidden;isolation:isolate}.loop-scene-cafe{background-position:100% 0}.loop-scene-station{background-position:0 100%}.loop-scene-home{background-position:100% 100%}.loop-signal{position:absolute;bottom:20px;right:20px;display:flex;align-items:center;justify-content:center;gap:5px;width:65px;height:52px;background:#fffaf1f2;border-radius:16px}.loop-signal i{width:4px;height:18px;background:#285e50;border-radius:3px;animation:loop-wave 1.5s ease-in-out 2}.loop-signal i:nth-child(2){height:29px;animation-delay:.15s}.loop-signal i:nth-child(3){height:24px;animation-delay:.3s}.loop-signal i:nth-child(4){height:12px;animation-delay:.45s}.loop-resolved:after{content:'✓';position:absolute;inset:auto 20px 20px auto;z-index:2;display:grid;place-items:center;width:65px;height:52px;border-radius:16px;background:#285e50;color:white;font-size:30px;animation:loop-arrive .35s ease-out}.loop-note{padding:14px 0;border-top:1px solid #d5ddcf;font-size:16px}.loop-note summary{cursor:pointer}.loop-note p{line-height:1.6;background:#f0eadb;padding:16px;border-radius:12px;animation:loop-arrive .3s ease-out}.loop-pocket{display:flex;align-items:center;gap:18px;font-size:14px;margin:18px 0}.loop-pocket progress{flex:1;max-width:170px;accent-color:#285e50;height:8px}.loop-decision{padding:26px;background:#fffdf8;border:1px solid #d5ddcf;border-radius:20px;min-width:0}.loop-player{display:flex;align-items:center;gap:15px;background:#e8eddf;padding:17px;border-radius:16px}.loop-player>button{--played:0%;width:76px;height:76px;border:0;border-radius:50%;display:grid;place-items:center;flex-shrink:0;background:conic-gradient(#bd8d51 var(--played),#285e50 0);color:white;cursor:pointer;padding:5px}.loop-player>button span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#285e50;font-size:28px}.loop-player>div{flex:1;display:grid;gap:8px}.loop-player strong{font-size:17px}.loop-player span{font-size:13px;color:#425c4d}.loop-player label{font-size:12px;display:grid;gap:5px;color:#425c4d}.loop-player select{font-size:15px;min-height:40px;max-width:70px;border:1px solid #a5b69a;border-radius:8px}.loop-audio-status{font-size:14px;line-height:1.5;color:#52685b;min-height:1.5em}.loop-transcript{font-size:17px;line-height:1.65;padding:14px 18px;background:#f2eddf;border-radius:12px;margin:12px 0 22px}.loop-transcript p{margin:10px 0}.loop-decision h2{font-size:23px;line-height:1.4;margin:12px 0 20px;letter-spacing:-.3px}.loop-options{display:grid;gap:11px}.loop-options button{padding:17px 18px;text-align:left;border:1px solid #b8c6b0;border-radius:12px;background:#fffdf8;font-size:18px;line-height:1.4;color:#203c34;cursor:pointer;min-height:58px;transition:background .15s,transform .15s}.loop-options button:not(:disabled):hover{background:#e7eddf;transform:translateX(3px)}.loop-options button:disabled{color:#68766d;background:#f2f2eb;cursor:default;border-style:dashed}.loop-reaction{display:flex;align-items:center;gap:15px;margin-bottom:20px;animation:loop-arrive .35s ease-out}.loop-reaction>span{font-size:32px;color:#285e50;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#e3ecd9;flex-shrink:0}.loop-reaction.not-yet>span{color:#8c532d;background:#f1e3ca}.loop-reaction h2{font:27px/1.2 Georgia,serif;margin:0 0 8px}.loop-reaction p{font-size:15px;line-height:1.5;margin:0}.loop-answer{font-size:17px;line-height:1.6}.loop-coach{border-left:3px solid #7b9d74;padding:18px;background:#edf0e5;border-radius:0 12px 12px 0;margin:20px 0}.loop-coach blockquote{font:21px/1.45 Georgia,serif;margin:12px 0}.loop-coach p{font-size:16px;line-height:1.65}.loop-coach .playing{background:#285e50;color:white;box-shadow:0 0 0 4px #285e5020}.loop-result{max-width:760px;margin:10px auto;padding:24px 0}.loop-stamp{display:grid;place-items:center;background:#285e50;color:#fffdf8;width:70px;height:70px;border-radius:50%;font-size:35px;animation:loop-arrive .45s ease-out}.loop-ending{font-size:20px;line-height:1.7;max-width:650px}.loop-result-numbers{display:flex;align-items:center;gap:20px;background:#e8eddf;padding:22px;border-radius:16px;margin:22px 0}.loop-result-numbers strong{font:40px Georgia,serif}.loop-result-numbers span{font-size:16px;line-height:1.5}.loop-next-note{border:1px solid #d1d9ca;border-radius:16px;padding:24px;margin-top:30px;background:#fffdf8}.loop-next-note h2{font:27px Georgia,serif}.loop-next-note p{font-size:17px;line-height:1.65}.loop-progress{border:1px solid #c2d2b8;border-radius:20px;background:#e8eddf;padding:26px;margin:0 0 30px}.loop-progress h2{font:30px Georgia,serif;margin:12px 0 20px}.loop-progress-counts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}.loop-progress-counts>div{display:grid;gap:7px}.loop-progress-counts strong{font:34px Georgia,serif}.loop-progress-counts span{font-size:14px}.loop-evidence{display:grid;grid-template-columns:1fr 1fr;gap:12px}.loop-evidence>div{background:#fffdf8;border:1px solid #d1d9ca;border-radius:12px;display:grid;gap:8px;padding:18px}.loop-evidence strong{font-size:17px}.loop-evidence span{font-size:15px}.loop-evidence small{font-size:13px;color:#52685b}.loop-session button:focus-visible,.loop-route a:focus-visible,.loop-dashboard a:focus-visible{outline:3px solid #b67e32;outline-offset:4px}.loop-result h1:focus,.loop-decision h2:focus{outline:none}.loop-progress+.page-head{display:none}@keyframes loop-arrive{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes loop-wave{0%,100%{transform:scaleY(.7)}50%{transform:scaleY(1.15)}}
@media(max-width:760px){.loop-today{grid-template-columns:1fr;padding:22px;gap:16px}.loop-today .growth-button{width:100%}.loop-plan,.loop-story-opening,.loop-session-layout{grid-template-columns:1fr}.loop-notebook{padding:20px}.loop-notebook h2{margin-bottom:12px}.loop-route{grid-template-columns:1fr}.loop-title h1{font-size:32px}.loop-card-scene{height:170px}.loop-story-opening .loop-card-scene{min-height:190px}.loop-context{display:grid;grid-template-columns:96px 1fr;gap:6px 14px}.loop-scene{grid-row:1/3;width:96px;height:88px;aspect-ratio:auto;border-radius:12px}.loop-scene-tag,.loop-signal{display:none}.loop-context h1{font-size:26px;margin:0;align-self:center}.loop-context>p{grid-column:1/-1;font-size:16px;line-height:1.5;margin:4px 0}.loop-note{grid-column:1/-1;padding:10px 0}.loop-pocket{grid-column:1/-1;margin:0;font-size:13px}.loop-session-layout{gap:14px}.loop-top{font-size:11px;margin-bottom:16px}.loop-decision{padding:18px 16px}.loop-player{padding:13px;gap:12px}.loop-player>button{width:76px;height:76px}.loop-player strong{font-size:16px}.loop-player label{font-size:11px}.loop-audio-status{margin:10px 0 0}.loop-decision h2{font-size:22px;margin:14px 0}.loop-options button{font-size:17px;min-height:58px}.loop-decision>.growth-text-button{margin:6px 0 10px}.loop-progress{padding:20px 16px}.loop-evidence{grid-template-columns:1fr}.loop-progress-counts{gap:10px}.loop-progress-counts strong{font-size:29px}.loop-progress-counts span{font-size:12px}.loop-result{padding:12px 0}.loop-result .growth-actions{align-items:stretch;flex-direction:column}.loop-result .growth-button,.loop-result .growth-outline-button{width:100%}.loop-ending{font-size:18px}.loop-result-numbers{padding:18px}.loop-resolved:after{width:36px;height:36px;right:8px;bottom:8px;font-size:22px}.loop-session{padding-bottom:20px}}
@media(prefers-reduced-motion:reduce){.loop-envelope,.loop-signal i,.loop-resolved:after,.loop-note p,.loop-reaction,.loop-stamp{animation:none!important}.loop-route li a,.loop-options button{transition:none!important;transform:none!important}}
.loop-order ol{list-style:none;padding:0;counter-reset:steps;display:grid;gap:9px}.loop-order li{counter-increment:steps;border:1px dashed #9aad8f;background:#eef1e6;border-radius:10px;padding:14px;font-size:16px;line-height:1.5;min-height:53px}.loop-order li:before{content:counter(steps);display:inline-grid;place-items:center;margin-right:10px;width:24px;height:24px;background:#285e50;color:white;border-radius:50%;font-size:12px}.loop-order-pieces{display:grid;gap:9px;margin:18px 0}.loop-order-pieces button{font-size:17px;padding:14px;text-align:left;line-height:1.5;border:1px solid #b8c6b0;border-radius:10px;background:#fffdf8;color:#203c34;cursor:pointer;min-height:52px}.loop-order-pieces button:disabled{opacity:.55;cursor:default}.loop-order>.growth-button:disabled{background:#68766b;border-color:#68766b;cursor:default}.loop-order>.growth-text-button{display:block}.loop-tray button{display:flex;align-items:center;gap:15px}.loop-cup{font-size:30px;display:inline-grid;place-items:center;width:45px;height:45px;border-radius:12px;background:#ece2cd;flex-shrink:0}
.loop-player>button span{color:#fffdf8}

/* Preserve atlas proportions while cropping wide cards; keep phone audio compact. */
.loop-card-scene{background-image:none;background-color:#e4ebdb;isolation:isolate}.loop-card-scene:before{content:'';position:absolute;left:0;right:0;top:50%;aspect-ratio:3/2;background-image:url('/quest/assets/town-atlas.webp');background-size:200% 200%;transform:translateY(-50%);z-index:-1}.loop-card-scene.loop-scene-cafe:before{background-position:100% 0}.loop-card-scene.loop-scene-home:before{background-position:100% 100%}.loop-card-scene.loop-scene-station:before{background-position:0 100%}.loop-mobile-intro{display:none}.loop-player{display:grid;grid-template-columns:76px minmax(0,1fr)60px;gap:10px;padding:12px}.loop-player>div{min-width:0}.loop-player label{min-width:0}.loop-player select{width:60px;min-width:0;max-width:60px;padding:6px}.loop-audio-status:empty{display:none}.loop-progress h1{font:30px Georgia,serif;margin:12px 0 20px}
@media(max-width:760px){.loop-context>p{display:none}.loop-mobile-intro{display:block}.loop-player>div span{font-size:12px}.loop-pocket{margin-bottom:0}.loop-decision>.growth-text-button{margin:12px 0}.loop-player{grid-template-columns:76px minmax(0,1fr)60px;gap:10px;padding:12px}}
@media(max-width:360px){.loop-player>div strong{display:none}.loop-player>div span{font-size:12px;white-space:nowrap}}
.loop-card-scene{overflow:hidden}
