/* Design Your Life (/life) */
.l-hero{padding-bottom:0}
.l-hero h1{font-size:clamp(1.9rem,6.4vw,3rem);text-wrap:balance}
.l-hero-scene{max-width:620px;margin:6px auto 16px;border-radius:22px;overflow:hidden;border:2px solid #d9bf85;box-shadow:0 24px 50px -28px rgba(90,70,30,.45);aspect-ratio:4/3;position:relative}
.l-hero-scene svg,.l-scene-box svg{display:block;width:100%;height:100%}
.l-start-row{margin:4px 0 6px}
.l-start{font-size:1.15rem;padding:15px 30px;min-width:230px}
.l-hq{max-width:620px;margin:18px auto 0;text-align:left}
.l-q{font-style:italic}
.l-q.l-center{max-width:620px;margin:18px auto}
#life-app{outline:none;scroll-margin-top:70px}
.l-wrap{padding-top:10px}
.l-prog{margin:0 0 14px}
.l-dots{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;list-style:none;margin:0;padding:4px;border-radius:999px;background:#f3ead9;border:1px solid var(--line)}
.l-dots button{width:100%;appearance:none;border:0;border-radius:999px;background:transparent;min-height:36px;padding:4px 2px;font:600 .7rem/1.1 var(--sans);color:var(--muted);cursor:pointer;position:relative;overflow:hidden}
.l-dots li.done button{color:#6b4f1d}
.l-dots li.done button::after{content:"";position:absolute;left:18%;right:18%;bottom:4px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--gold-l),var(--gold))}
.l-dots li.on button{background:linear-gradient(180deg,#fffdf8,#f7edd9);color:#3d3326;box-shadow:0 1px 3px rgba(80,60,20,.18),inset 0 0 0 1px #e2cf9f}
.l-dots button:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
.l-grid{display:grid;gap:14px}
.l-side{position:sticky;top:58px;z-index:6;background:linear-gradient(180deg,var(--bg) 70%,rgba(245,243,238,0));padding:4px 0 6px;margin:0 -4px}
.l-scene-box{border-radius:18px;overflow:hidden;border:2px solid #d9bf85;box-shadow:0 14px 30px -20px rgba(90,70,30,.5);height:clamp(130px,34vw,190px);position:relative;background:#fbf6ea}
.l-scene-box.pulse{animation:lpulse 1.2s ease}
@keyframes lpulse{0%{box-shadow:0 0 0 0 rgba(217,191,133,.8)}100%{box-shadow:0 0 0 14px rgba(217,191,133,0)}}
.l-legend{margin:6px 4px 0;line-height:1.35}
.l-toast{position:absolute;left:12px;right:12px;top:12px;margin:0 auto;max-width:360px;text-align:center;font:600 .82rem/1.3 var(--sans);color:#5e4515;background:rgba(255,250,236,.95);border:1px solid #e2cf9f;border-radius:999px;padding:6px 12px;opacity:0;transform:translateY(-6px);transition:opacity .4s,transform .4s;pointer-events:none}
.l-toast.on{opacity:1;transform:none}
.l-side{position:sticky}
.l-main{padding:20px 18px}
.l-main h2{margin:.15em 0 .3em}
.l-intro{color:#4a443b}
.l-miss{margin:12px 0 4px;padding:10px 14px;border-radius:14px;background:#fffaf0;border:1px dashed var(--gold-l);font-size:.95rem}
.l-p{border:0;margin:20px 0 0;padding:16px 0 0;border-top:1px solid #eee4d0;min-width:0}
.l-p legend{float:left;width:100%;padding:0;font:700 1.06rem/1.35 var(--serif);letter-spacing:.01em;color:var(--ink);margin:0 0 4px}
.l-because{clear:both;font-size:.88rem;color:var(--muted);margin:0 0 10px;font-style:italic}
.l-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.l-chip{appearance:none;font:500 .9rem/1.2 var(--sans);padding:9px 14px;min-height:40px;border-radius:999px;border:1px solid var(--gold-l);background:#fffdf8;color:#5e4515;cursor:pointer;transition:background .2s,transform .15s,box-shadow .2s}
.l-chip:hover{background:#fbf1dc}
.l-chip[aria-pressed="true"]{background:linear-gradient(180deg,#e6c47a,#c39646);color:#fff;border-color:#b48a3c;box-shadow:0 4px 12px -6px rgba(138,102,38,.8)}
.l-chip[aria-pressed="true"]::before{content:"\2713  "}
.l-chip:active{transform:scale(.96)}
.l-p textarea{min-height:56px}
.l-goals{margin-top:22px;padding:16px;border-radius:16px;background:linear-gradient(180deg,#fffdf8,#f7eedd);border:1px solid #e6d3a5}
.l-goals h3{margin:0 0 4px;color:#6b4f1d}
.l-goal{margin-top:10px}
.l-goal small{display:block;font-weight:400;font-style:italic;font-size:.82rem}
.l-nav{display:flex;align-items:center;gap:10px;margin-top:20px;position:sticky;bottom:0;padding:10px 0 calc(10px + env(safe-area-inset-bottom));background:linear-gradient(0deg,var(--paper) 75%,rgba(255,253,249,0))}
.l-nav .btn:last-child{margin-left:auto;min-width:130px}
.l-nav .btn[disabled]{opacity:.4;pointer-events:none}
.l-skip{appearance:none;background:none;border:0;color:var(--muted);font:500 .95rem var(--sans);text-decoration:underline;cursor:pointer;padding:8px}
@media(min-width:900px){
  .l-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:start;gap:24px}
  .l-side{top:76px;background:none;margin:0;padding:0}
  .l-scene-box{height:auto;aspect-ratio:4/3}
  .l-toast{font-size:.9rem}
}
/* finish */
.l-reveal{position:relative;max-width:820px;margin:0 auto}
.l-final{height:auto;aspect-ratio:4/3;max-width:820px;margin:0 auto}
.l-final .l-dev,.l-hero-scene .l-dev{transition:opacity 2.4s ease}
.l-final.dev .l-dev,.l-hero-scene.dev .l-dev{opacity:1}
.l-final::after,.l-hero-scene::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,250,230,.75) 48%,transparent 66%);transform:translateX(-120%);pointer-events:none}
.l-final.dev::after,.l-hero-scene.dev::after{animation:lsweep 2.6s ease .2s 1}
@keyframes lsweep{to{transform:translateX(120%)}}
.l-reveal-t{text-align:center;padding:16px 8px 0}
.l-reveal-t h2{font-size:clamp(1.5rem,5vw,2.2rem)}
.l-block{margin-top:20px}
.l-sum{display:grid;gap:12px}
.l-sum-c{padding:14px 16px;border-radius:14px;background:#fffdf8;border:1px solid var(--line)}
.l-sum-c p{margin:.2em 0}
.l-sum-cov{border:2px solid #d9bf85;background:linear-gradient(180deg,#fffdf8,#f7eedd)}
.l-sum-h{display:flex;justify-content:space-between;align-items:center;gap:8px}
.l-sum-h h3{margin:0;color:#6b4f1d}
.l-edit{appearance:none;border:1px solid var(--gold-l);background:#fffaf0;color:#7a5a1e;border-radius:999px;padding:4px 12px;font:600 .82rem var(--sans);cursor:pointer;min-height:32px}
.l-wk{padding:6px 10px;border-radius:10px;background:#fff;border:1px dashed var(--gold-l)}
@media(min-width:700px){.l-sum{grid-template-columns:1fr 1fr}.l-sum-cov{grid-column:1/-1}}
/* vision board */
.l-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 16px;padding:10px;border-radius:18px;background:linear-gradient(135deg,#fffdf8,#f1e7d4);border:2px solid #d9bf85}
.l-bi{position:relative;margin:0;aspect-ratio:1;border-radius:12px;overflow:hidden;border:1.5px solid #c9a65c;background:#fffdf8;animation:lpop .45s cubic-bezier(.2,1.4,.4,1)}
@keyframes lpop{from{transform:scale(.6);opacity:0}}
.l-bi svg{display:block;width:100%;height:100%}
.l-tile figcaption{position:absolute;left:4px;right:4px;bottom:9%;text-align:center;font:700 clamp(.5rem,2.4vw,.8rem)/1.1 var(--serif);letter-spacing:.04em;color:#6b4f1d;text-transform:uppercase}
.l-word{display:flex;align-items:center;justify-content:center;padding:8px;text-align:center;background:linear-gradient(180deg,#fffaf0,#f5e7c8)}
.l-word span{font:700 clamp(.72rem,3.2vw,1.05rem)/1.2 var(--serif);color:#5e4515;overflow-wrap:anywhere}
.l-photo img{width:100%;height:100%;object-fit:cover}
.l-empty{display:flex;align-items:center;justify-content:center;text-align:center;padding:8px;font-size:.78rem;color:var(--muted);border-style:dashed;background:transparent;animation:none}
.l-rm{position:absolute;top:4px;right:4px;width:28px;height:28px;border-radius:50%;border:1px solid #d9bf85;background:rgba(255,253,248,.92);color:#6b4f1d;font:700 1rem/1 var(--sans);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.l-libcard{margin:6px 0 12px;box-shadow:none}
.l-libcard .tc-tabs{border-radius:18px}
.l-libcard .tc-tab{border-radius:14px}
.l-libcard .tc-panel{max-height:none}
.l-lib{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.l-libt{appearance:none;position:relative;padding:0;border:1.5px solid #e2cf9f;border-radius:12px;overflow:hidden;background:#fffdf8;cursor:pointer;aspect-ratio:1;transition:transform .15s,box-shadow .2s}
.l-libt:hover{transform:translateY(-2px);box-shadow:0 8px 16px -10px rgba(120,90,30,.6)}
.l-libt svg{display:block;width:100%;height:100%}
.l-libt span{position:absolute;left:3px;right:3px;bottom:8%;font:700 clamp(.5rem,2.3vw,.78rem)/1.1 var(--serif);text-transform:uppercase;letter-spacing:.04em;color:#6b4f1d}
.l-libt::after{content:"+";position:absolute;top:5px;right:7px;font:700 1rem var(--sans);color:#b48a3c}
.l-addrow{display:flex;gap:8px;align-items:center;margin:4px 0 8px}
.l-addrow input{flex:1;min-width:0}
.l-addrow .btn{flex:none}
.l-save .l-savegrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.l-savegrid .btn{width:100%;text-align:center;min-height:48px;display:flex;align-items:center;justify-content:center;line-height:1.2}
.l-clear{color:#8b3a2b!important;border-color:#e3c2b8!important}
.l-savenote{margin:12px 0 0;padding:10px 12px;border-radius:12px;background:#fffaf0;border:1px solid var(--line)}
@media(max-width:420px){.l-save .l-savegrid{grid-template-columns:1fr}}
.l-grown h2{font-size:1.35rem}
/* home teaser + nav */
.life-cta{display:block;text-decoration:none;color:inherit;margin-top:16px;text-align:center;border:2px solid #d9bf85;background:linear-gradient(180deg,#fffdf8,#f7eedd)}
/* print */
.l-print{display:none}
@media print{
  @page{size:letter;margin:0}
  body.l-printing>*:not(.l-print){display:none!important}
  body.l-printing{background:#fff!important;margin:0}
  body.l-printing .l-print{display:block}
  body.l-printing .l-print img{width:100%;height:auto;max-height:100vh;object-fit:contain}
}
@media(prefers-reduced-motion:reduce){.l-bi{animation:none}.l-scene-box.pulse{animation:none}.l-final::after,.l-hero-scene::after{display:none}.l-toast{transition:none}}

/* keep hidden file input from causing sideways scroll */
#l-photo{width:1px!important;height:1px!important;min-width:0!important;padding:0!important;border:0!important;left:0;top:0;opacity:0}
#l-vision p{position:relative}
.l-ivh{margin:14px 0 4px;padding:10px 14px;border-radius:14px;background:#fffaf0;border:1px solid var(--gold-l);font-size:.95rem}
.l-ivh a{font-weight:600}
.l-ivh-fin{margin-top:16px}
@media (max-width:420px){.l-dots button{font-size:.64rem;letter-spacing:-.01em}}
@media print{.l-ivh{display:none}}

/* growing scene (moved from inline SVG <style>; site CSP is style-src self) */
.l-scene .g{opacity:0;transform:translateY(6px) scale(.55);transform-box:fill-box;transform-origin:50% 100%;transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,1.4,.4,1)}
.l-scene .g.on{opacity:1;transform:none}
.l-scene .g.sky{transform:scale(.4);transform-origin:50% 50%}
.l-scene .g.sky.on{transform:none}
.l-scene .tw{animation:ltw 3.2s ease-in-out infinite alternate}
.l-scene .tw2{animation:ltw 4.1s ease-in-out .8s infinite alternate}
@keyframes ltw{from{opacity:.45}to{opacity:1}}
.l-scene .prog{transition:stroke-dashoffset 1.4s ease}
.l-scene .tglow,.l-scene .sun,.l-scene .tbody{transition:opacity 1.2s ease,transform 1.6s ease}
.l-scene .sun{transform-box:fill-box;transform-origin:50% 50%}
@media (prefers-reduced-motion: reduce){.l-scene .g,.l-scene .prog,.l-scene .tglow,.l-scene .sun,.l-scene .tbody{transition:none!important}.l-scene .tw,.l-scene .tw2{animation:none}}
@media (max-width:520px){.l-dots{grid-template-columns:minmax(0,1.4fr) repeat(6,minmax(0,1fr));gap:2px}.l-dots button{padding:4px 1px}}