@import url('https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Crimson+Pro:ital,wght@0,300;0,400;1,300&display=swap');
:root{--void:#050a14;--deep:#0a1628;--panel:#0d1e35;--border:#1a3050;--muted:#2a4a6a;--dim:#4a7090;--text:#8ab4c8;--bright:#c8dde8;--white:#e8f4f8;--amber:#e8a94d;--amber-dim:#8a5f20;--amber-glow:rgba(232,169,77,0.15);--green:#4dc8a0;--red:#e85555;--purple:#9a7fc8;--blue:#6496e8}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--void);color:var(--text);font-family:'Space Mono',monospace;font-size:13px;min-height:100vh;overflow-x:hidden}
body::before{content:'';position:fixed;inset:0;background-image:radial-gradient(1px 1px at 8% 7%,rgba(255,255,255,.55) 0%,transparent 100%),radial-gradient(1px 1px at 23% 18%,rgba(255,255,255,.35) 0%,transparent 100%),radial-gradient(1px 1px at 47% 4%,rgba(255,255,255,.6) 0%,transparent 100%),radial-gradient(1px 1px at 67% 14%,rgba(255,255,255,.4) 0%,transparent 100%),radial-gradient(1px 1px at 82% 9%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 14% 38%,rgba(255,255,255,.45) 0%,transparent 100%),radial-gradient(1px 1px at 37% 52%,rgba(255,255,255,.3) 0%,transparent 100%),radial-gradient(1px 1px at 59% 44%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 76% 61%,rgba(255,255,255,.4) 0%,transparent 100%),radial-gradient(1px 1px at 28% 83%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 88% 85%,rgba(255,255,255,.45) 0%,transparent 100%),radial-gradient(2px 2px at 42% 3%,rgba(255,220,150,.4) 0%,transparent 100%),radial-gradient(2px 2px at 3% 25%,rgba(150,180,255,.35) 0%,transparent 100%);pointer-events:none;z-index:0}
#app{position:relative;z-index:1;max-width:480px;margin:0 auto;padding-bottom:72px}
/* HEADER */
.header{padding:14px 16px 0;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(5,10,20,.97) 0%,rgba(10,22,40,.9) 100%);backdrop-filter:blur(10px);position:sticky;top:0;z-index:100}
.header-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:10px}
.site-title{font-size:11px;font-weight:700;letter-spacing:.35em;color:var(--amber);text-transform:uppercase;margin-bottom:3px;text-shadow:0 0 12px rgba(232,169,77,.3)}
.site-subtitle{font-family:'Crimson Pro',serif;font-size:14px;font-weight:300;font-style:italic;color:var(--text);line-height:1.1}
.live-clock{text-align:right}
.clock-time{font-size:23px;font-weight:700;color:var(--amber);letter-spacing:.05em;line-height:1}
.clock-date,.clock-lst{font-size:9px;letter-spacing:.12em;text-align:right}
.clock-date{color:var(--dim);font-size:10px}.clock-lst{color:var(--amber-dim);font-size:10px}
.coord-bar{display:flex;gap:14px;padding:5px 0 10px;font-size:9px;color:var(--text);letter-spacing:.08em;flex-wrap:wrap}
.coord-bar span{color:var(--text)}
/* SECTIONS */
.section{margin:10px 10px 0;border:1px solid rgba(232,169,77,.15);border-radius:6px;background:rgba(13,30,53,.72);backdrop-filter:blur(4px);overflow:hidden}
.section-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:rgba(26,48,80,.5);border-bottom:1px solid rgba(232,169,77,.10);cursor:pointer;user-select:none;position:relative}
.section-header::before{content:'';position:absolute;top:0;left:0;right:0;height:1.5px;background:linear-gradient(90deg,rgba(232,169,77,.4) 0%,rgba(232,169,77,.15) 55%,transparent 100%);pointer-events:none}
.section-label{font-family:'Space Mono',monospace;font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);display:flex;align-items:center;gap:6px}
/* Dashboard ambient warmth */
#page-dash{position:relative}
#page-dash::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%;height:320px;background:radial-gradient(ellipse 90% 100% at 50% 0%,rgba(232,169,77,.06) 0%,transparent 70%);pointer-events:none;z-index:0}
.dot{width:6px;height:6px;border-radius:50%;background:var(--amber);animation:pulse 2s ease-in-out infinite}
.dot.green{background:var(--green)}.dot.red{background:var(--red)}.dot.dim{background:var(--muted);animation:none}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.section-toggle{font-size:10px;color:var(--muted);transition:transform .2s}
.section-toggle.open{transform:rotate(180deg)}
.section-body{padding:0 12px;max-height:0;overflow:hidden;transition:max-height .25s ease,padding .25s ease}
.section-body.open{max-height:1200px;padding:12px 12px;overflow:visible}
/* LUNAR */
.obs-quality{display:inline-flex;align-items:center;gap:4px;margin-top:5px;padding:3px 8px;border-radius:2px;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.quality-excellent{background:rgba(77,200,160,.15);color:var(--green);border:1px solid rgba(77,200,160,.3)}
.quality-good{background:rgba(232,169,77,.12);color:var(--amber);border:1px solid rgba(232,169,77,.25)}
.quality-poor{background:rgba(232,85,85,.12);color:var(--red);border:1px solid rgba(232,85,85,.25)}
/* WEATHER */
.wx-scroll{overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--muted) transparent;margin:0 -4px}
.wx-scroll::-webkit-scrollbar{height:3px}.wx-scroll::-webkit-scrollbar-thumb{background:var(--muted);border-radius:2px}
.wx-grid{display:flex;flex-direction:row;gap:4px;flex-wrap:nowrap;padding:2px 4px;width:max-content;min-width:100%}
.wx-col{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 5px 7px;background:rgba(26,48,80,.3);border:1px solid var(--border);border-radius:5px;min-width:0}
.wx-col.now{border-color:var(--amber);background:rgba(232,169,77,.12);box-shadow:0 0 8px rgba(232,169,77,.15)}
.wx-col.target{border-color:rgba(77,200,160,.25);background:rgba(77,200,160,.04)}
.wx-hour{font-size:8px;font-weight:700;color:var(--text);letter-spacing:.06em}
.wx-col.now .wx-hour{color:var(--amber)}
.wx-icon{font-size:18px;line-height:1}
.wx-temp{font-size:16px;font-weight:700;color:var(--bright);line-height:1}
.wx-unit{font-size:8px;color:var(--dim);margin-top:-2px}
.wx-detail-row{display:flex;flex-direction:column;align-items:center;gap:1px;width:100%;padding-top:3px;border-top:1px solid rgba(26,48,80,.6)}
.wx-cloud{font-size:9px;color:var(--text)}
.wx-wind{font-size:8px;color:var(--text);letter-spacing:.02em;text-align:center}
.wx-pop{font-size:9px;font-weight:700}
.wx-pop.wet{color:var(--blue)}.wx-pop.dry{color:var(--muted)}
.wx-summary{margin-top:8px;padding:6px 10px;background:rgba(26,48,80,.3);border:1px solid var(--border);border-radius:4px;font-size:10px;color:var(--text);display:flex;align-items:center;gap:8px}
.wx-summary-icon{font-size:18px}
.wx-meta{font-size:8px;color:var(--dim);margin-top:6px;letter-spacing:.06em}
.wx-meta a{color:var(--amber-dim);text-decoration:none}
.wx-meta a:hover{color:var(--amber)}
/* Objects page ambient warmth */
#page-objects{position:relative}
#page-objects::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%;height:280px;background:radial-gradient(ellipse 90% 100% at 50% 0%,rgba(232,169,77,.05) 0%,transparent 70%);pointer-events:none;z-index:0}
/* TIME SLIDER */
.slider-section{margin:10px 10px 0;padding:10px 12px;border:1px solid rgba(232,169,77,.13);border-radius:6px;background:rgba(13,30,53,.72);position:relative}
.slider-section::before{content:'';position:absolute;top:0;left:0;right:0;height:1.5px;background:linear-gradient(90deg,rgba(232,169,77,.35) 0%,rgba(232,169,77,.1) 55%,transparent 100%);pointer-events:none;border-radius:6px 6px 0 0}
.slider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.slider-label{font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--amber)}
.slider-value{font-size:13px;font-weight:700;color:var(--bright)}
input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:4px;background:linear-gradient(90deg,var(--amber) var(--pct,0%),var(--muted) var(--pct,0%));border-radius:2px;outline:none;cursor:pointer;margin-bottom:8px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px rgba(232,169,77,.5);cursor:pointer}
input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px rgba(232,169,77,.5);border:none;cursor:pointer}
.slider-ticks{display:flex;justify-content:space-between;font-size:8px;color:var(--muted);letter-spacing:.06em;padding:0 1px}
/* OBJECTS */
.filter-row{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}
.filter-btn{padding:3px 8px;border:1px solid rgba(232,169,77,.12);border-radius:4px;background:transparent;color:var(--text);font-family:'Space Mono',monospace;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .15s}
.filter-btn.active{border-color:var(--amber);color:var(--amber);background:var(--amber-glow)}
.bucket-label{font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);padding:8px 2px 5px 8px;border-bottom:1px solid rgba(232,169,77,.12);border-left:2px solid rgba(232,169,77,.28);margin-bottom:6px;display:flex;align-items:center;justify-content:space-between}
.bucket-label.collapsible{cursor:pointer;user-select:none}
.bucket-label.collapsible:hover{color:var(--bright)}
.bucket-wx{font-size:8px;font-weight:400;color:var(--dim);letter-spacing:.06em}
.bucket-toggle{font-size:10px;color:var(--muted);transition:transform .2s;display:inline-block;margin-left:6px}
.bucket-toggle.open{transform:rotate(180deg)}
.bucket-collapsible{overflow:hidden;max-height:0;transition:max-height .3s ease}
.bucket-collapsible.open{max-height:4000px}
.object-list{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.object-card{border:1px solid rgba(232,169,77,.09);border-radius:5px;background:rgba(26,48,80,.25);overflow:hidden;transition:border-color .15s}
.object-card:hover{border-color:var(--muted)}
.object-card-header{display:flex;align-items:center;gap:6px;padding:8px 10px;cursor:pointer;user-select:none}
.object-designation{font-size:11px;font-weight:700;color:var(--amber);min-width:36px;flex-shrink:0}
.object-actions{display:flex;align-items:center;gap:4px;flex-shrink:0}
.object-info{flex:1;min-width:0}
.object-name{font-family:'Crimson Pro',serif;font-size:13px;font-weight:600;color:var(--bright);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.object-meta-row{display:flex;gap:5px;align-items:center;margin-top:2px;flex-wrap:wrap}
.object-type{font-size:8px;padding:1px 5px;border-radius:2px;text-transform:uppercase;letter-spacing:.1em;font-weight:700;white-space:nowrap}
.type-nebula{background:rgba(154,127,200,.15);color:var(--purple);border:1px solid rgba(154,127,200,.3)}
.type-galaxy{background:rgba(77,200,160,.12);color:var(--green);border:1px solid rgba(77,200,160,.25)}
.type-cluster{background:rgba(232,169,77,.12);color:var(--amber);border:1px solid rgba(232,169,77,.25)}
.type-remnant{background:rgba(232,85,85,.12);color:var(--red);border:1px solid rgba(232,85,85,.25)}
.type-planet{background:rgba(100,150,232,.12);color:var(--blue);border:1px solid rgba(100,150,232,.25)}
.type-star{background:rgba(212,200,154,.12);color:#d4c89a;border:1px solid rgba(212,200,154,.3)}
.object-seen .object-card-header{opacity:.5}
.object-seen{border-color:var(--muted) !important}
.seen-check{width:20px;height:20px;border-radius:50%;border:1px solid var(--border);background:transparent;color:transparent;font-size:11px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all .15s}
.seen-check.checked{border-color:var(--green);color:var(--green);background:rgba(77,200,160,.1)}
.object-mag{font-size:9px;color:var(--bright);white-space:nowrap;margin-right:6px}
.obj-size{font-size:8px;color:var(--bright);white-space:nowrap;display:inline-flex;align-items:center;gap:2px}
.obj-size .size-bar{display:inline-block;height:6px;min-width:2px;border-radius:1px;background:var(--dim);vertical-align:middle}
.obj-badge{font-size:8px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 5px;border-radius:2px;white-space:nowrap;margin-left:2px}
.badge-eye{color:#4ade80;background:rgba(74,222,128,.1);border:1px solid rgba(74,222,128,.2)}
.badge-bino{color:#38bdf8;background:rgba(56,189,248,.1);border:1px solid rgba(56,189,248,.2)}
.badge-scope{color:var(--purple);background:rgba(154,127,200,.1);border:1px solid rgba(154,127,200,.25)}
.instr-filters{display:flex;gap:4px;margin-top:5px}
.instr-btn{font-size:9px;font-weight:700;letter-spacing:.06em;padding:3px 8px;border-radius:3px;border:1px solid var(--border);background:transparent;color:var(--text);cursor:pointer;transition:all .2s}
.instr-btn.active{color:var(--bright);background:rgba(138,180,200,.1);border-color:var(--text)}
.instr-btn.eye-btn.active{color:#4ade80;border-color:rgba(74,222,128,.4);background:rgba(74,222,128,.08)}
.instr-btn.bino-btn.active{color:#38bdf8;border-color:rgba(56,189,248,.4);background:rgba(56,189,248,.08)}
.instr-btn.scope-btn.active{color:var(--purple);border-color:rgba(154,127,200,.45);background:rgba(154,127,200,.1)}
.object-right{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0}
.object-alt{font-size:9px;font-weight:700;padding:2px 6px;border-radius:2px;text-align:center;min-width:42px}
.alt-high{background:rgba(77,200,160,.15);color:var(--green)}
.alt-mid{background:rgba(232,169,77,.12);color:var(--amber)}
.alt-low{background:rgba(232,85,85,.10);color:var(--red)}
.object-dist{font-size:8px;color:var(--text);white-space:nowrap}
.object-mag.dim-mag{color:var(--muted);opacity:.6}
.object-card.mag-limited{opacity:.55;order:99}
.bookmark-btn{width:20px;height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;background:transparent;border:none;padding:0;color:var(--muted);transition:color .15s}
.bookmark-btn:hover{color:var(--amber)}
.bookmark-btn.bookmarked{color:var(--amber)}
.tl-section{margin:8px 10px 0;border:1px solid rgba(232,169,77,.15);border-radius:6px;background:rgba(13,30,53,.72);overflow:hidden}
.tl-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:rgba(26,48,80,.5);border-bottom:1px solid rgba(232,169,77,.10);cursor:pointer;user-select:none;position:relative}
.tl-header::before{content:'';position:absolute;top:0;left:0;right:0;height:1.5px;background:linear-gradient(90deg,rgba(232,169,77,.4) 0%,rgba(232,169,77,.15) 55%,transparent 100%);pointer-events:none}
.tl-header-left{display:flex;align-items:center;gap:6px;font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--amber)}
.tl-badge{font-size:8px;font-weight:400;color:var(--dim);padding:1px 6px;border:1px solid var(--border);border-radius:2px;letter-spacing:.06em}
.tl-header-right{display:flex;align-items:center;gap:8px}
.tl-clear{font-size:8px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text);border:1px solid var(--border);border-radius:2px;padding:2px 6px;background:transparent;cursor:pointer;transition:all .12s}
.tl-clear:hover{color:var(--red);border-color:rgba(232,85,85,.3)}
.tl-toggle{font-size:10px;color:var(--muted);transition:transform .2s;display:inline-block}
.tl-toggle.open{transform:rotate(180deg)}
.tl-body{display:none}
.tl-body.open{display:block;padding:6px 10px 8px}
.tl-group-label{font-size:8px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);padding:5px 2px 3px}
.tl-row{display:flex;align-items:center;gap:6px;padding:5px 4px;border-bottom:1px solid rgba(26,48,80,.3)}
.tl-row:last-child{border-bottom:none}
.tl-desg{font-size:9px;font-weight:700;color:var(--amber);min-width:42px;flex-shrink:0}
.tl-name{font-size:11px;color:var(--bright);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-row.tl-seen .tl-name{color:var(--dim);text-decoration:line-through;text-decoration-color:rgba(77,200,160,.35)}
.tl-row.tl-seen .tl-desg{color:var(--amber-dim)}
.tl-type{font-size:8px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:1px 4px;border-radius:2px;flex-shrink:0}
.tl-alt{font-size:8px;font-weight:700;padding:1px 5px;border-radius:2px;flex-shrink:0}
.tl-seen-btn{width:20px;height:20px;border-radius:50%;border:1px solid var(--border);background:transparent;color:transparent;font-size:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all .15s;padding:0;font-family:'Space Mono',monospace}
.tl-seen-btn.checked{border-color:var(--green);color:var(--green);background:rgba(77,200,160,.1)}
.tl-seen-btn:not(.checked):hover{border-color:rgba(77,200,160,.4);color:rgba(77,200,160,.3)}
.tl-empty{padding:14px 4px;font-size:9px;color:var(--dim);font-style:italic;font-family:'Crimson Pro',serif;letter-spacing:.04em}
.object-expand{padding:0 10px;max-height:0;overflow:hidden;transition:max-height .25s ease,padding .25s ease}
.object-expand.open{max-height:600px;padding:0 10px 10px;overflow:visible}
.object-notes{font-family:'Crimson Pro',serif;font-size:15px;font-weight:300;color:var(--text);line-height:1.65;border-top:1px solid var(--border);padding-top:8px}
.notes-loading{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--dim);font-style:italic;padding:10px 0}
.spinner{width:13px;height:13px;border:2px solid var(--border);border-top-color:var(--amber);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}
@keyframes spin{to{transform:rotate(360deg)}}
.talking-points{margin-top:8px;display:flex;flex-direction:column;gap:5px}
.tp{display:flex;gap:6px;font-size:13px;color:var(--text)}
.tp::before{content:'→';color:var(--amber-dim);flex-shrink:0}
.object-stats{display:flex;gap:10px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border);flex-wrap:wrap}
.stat{font-size:10px;color:var(--dim)}.stat span{color:var(--text)}
.tsl-link{display:inline-flex;align-items:center;gap:5px;margin-top:8px;font-size:10px;color:var(--amber-dim);letter-spacing:.08em;text-decoration:none;padding:3px 0}
.tsl-link:hover{color:var(--amber)}
/* EVENTS */
.event-list{display:flex;flex-direction:column;gap:7px}
.event-card{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;background:rgba(26,48,80,.3);border:1px solid var(--border);border-radius:4px}
.event-icon{font-size:20px;flex-shrink:0;line-height:1.2}
.event-body{flex:1}
.event-title{font-size:11px;font-weight:700;color:var(--bright);margin-bottom:2px}
.event-meta{font-size:9px;color:var(--text);letter-spacing:.06em;margin-bottom:2px}
.event-meta span{color:var(--amber)}
.event-note{font-family:'Crimson Pro',serif;font-size:13px;color:var(--text);font-style:italic}
.no-events{font-size:10px;color:var(--dim);font-style:italic;padding:4px 0}
/* UTILS */
.loading-row{display:flex;align-items:center;gap:8px;color:var(--dim);font-size:10px;font-style:italic;padding:8px 0}
.error-msg{font-size:10px;color:var(--red);padding:6px 0;font-style:italic}
/* NAV */
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;height:62px;background:rgba(1,3,8,.92);border-top:1px solid rgba(255,255,255,.055);backdrop-filter:blur(28px) saturate(150%);-webkit-backdrop-filter:blur(28px) saturate(150%);display:flex;z-index:200}
.nav-tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;color:rgba(80,110,145,.55);font-family:'Space Mono',monospace;font-size:7px;letter-spacing:.14em;text-transform:uppercase;transition:color .2s;border:none;background:transparent;padding:0;position:relative}
.nav-tab::before{content:'';position:absolute;top:0;left:26%;right:26%;height:1.5px;background:var(--amber);border-radius:0 0 3px 3px;opacity:0;transform:scaleX(.2);transition:opacity .22s ease,transform .28s cubic-bezier(.34,1.56,.64,1)}
.nav-tab.active::before{opacity:1;transform:scaleX(1)}
.nav-tab.active{color:var(--amber)}.nav-tab:hover{color:rgba(170,195,215,.7)}
.nav-icon{font-size:18px;line-height:1;transition:transform .2s}.nav-tab.active .nav-icon{transform:scale(1.08)}
.page{display:none;opacity:0;transition:opacity .15s ease}.page.active{display:block;opacity:1}
/* PROGRAM */
.prog-card{border:1px solid var(--border);border-radius:5px;background:rgba(13,30,53,.8);margin-bottom:8px;overflow:hidden}
.prog-card-header{display:flex;align-items:center;gap:10px;padding:10px 12px;background:rgba(26,48,80,.4);border-bottom:1px solid var(--border)}
.prog-step{width:22px;height:22px;border-radius:50%;background:var(--amber);color:var(--void);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.prog-obj-info{flex:1}
.prog-obj-name{font-size:12px;font-weight:700;color:var(--bright)}
.prog-obj-sub{font-size:9px;color:var(--dim);margin-top:1px}
.prog-time-badge{font-size:9px;font-weight:700;color:var(--amber);text-align:right;flex-shrink:0}
.prog-alt-badge{font-size:8px;color:var(--dim);text-align:right}
.prog-body{padding:10px 12px}
.prog-narrative{font-family:'Crimson Pro',serif;font-size:15px;font-weight:300;color:var(--text);line-height:1.7;margin-bottom:8px}
.prog-tips{display:flex;flex-direction:column;gap:4px}
.prog-tip{display:flex;gap:6px;font-size:11px;font-family:'Crimson Pro',serif;color:var(--text)}
.prog-tip::before{content:'→';color:var(--amber-dim);flex-shrink:0}
.prog-transition{padding:6px 12px;font-size:9px;font-style:italic;font-family:'Crimson Pro',serif;color:var(--amber-dim);letter-spacing:.04em;border-top:1px solid var(--border)}
.prog-header-card{margin-bottom:8px;padding:10px 12px;border:1px solid var(--amber-dim);border-radius:5px;background:rgba(232,169,77,.05)}
.prog-header-title{font-family:'Crimson Pro',serif;font-size:19px;font-weight:300;color:var(--bright);margin-bottom:4px}
.prog-header-meta{font-size:9px;color:var(--dim);letter-spacing:.08em}
.prog-header-meta span{color:var(--amber)}
/* QUICK PICK */
.qp-btn{width:100%;display:flex;align-items:center;gap:10px;padding:12px 14px;background:linear-gradient(135deg,rgba(26,48,80,.6) 0%,rgba(13,30,53,.8) 100%);border:1px solid var(--amber-dim);border-radius:6px;cursor:pointer;transition:all .2s;position:relative;overflow:hidden}
.qp-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(232,169,77,.06) 50%,transparent 100%);opacity:0;transition:opacity .3s}
.qp-btn:hover::before{opacity:1}
.qp-btn:hover{border-color:var(--amber);box-shadow:0 0 12px rgba(232,169,77,.15)}
.qp-btn:active{transform:scale(.98)}
.qp-btn:disabled{opacity:.5;cursor:wait;transform:none}
.qp-btn-icon{font-size:22px;flex-shrink:0}
.qp-btn-text{font-family:'Space Mono',monospace;font-size:12px;font-weight:700;color:var(--amber);letter-spacing:.08em;text-transform:uppercase}
.qp-btn-sub{font-family:'Space Mono',monospace;font-size:8px;color:var(--dim);letter-spacing:.04em;margin-left:auto;text-transform:uppercase;font-style:italic}
.qp-card{margin:8px 10px 0;border:1px solid var(--amber-dim);border-radius:6px;background:rgba(13,30,53,.85);overflow:hidden;animation:qpFadeIn .4s ease}
@keyframes qpFadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.qp-card-top{padding:12px 14px;background:rgba(232,169,77,.06);border-bottom:1px solid var(--border)}
.qp-card-name{font-family:'Crimson Pro',serif;font-size:22px;font-weight:300;color:var(--bright);line-height:1.2;margin-bottom:2px}
.qp-card-catalog{font-size:10px;font-weight:700;color:var(--amber);letter-spacing:.1em;margin-bottom:6px}
.qp-card-badges{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.qp-card-body{padding:12px 14px}
.qp-card-narrative{font-family:'Crimson Pro',serif;font-size:15px;font-weight:300;color:var(--text);line-height:1.65;margin-bottom:10px}
.qp-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}
.qp-stat{padding:6px 8px;background:rgba(26,48,80,.4);border:1px solid var(--border);border-radius:3px}
.qp-stat-label{font-size:7px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);margin-bottom:2px}
.qp-stat-value{font-size:12px;font-weight:700;color:var(--bright)}
.qp-points{display:flex;flex-direction:column;gap:5px;padding-top:10px;border-top:1px solid var(--border)}
.qp-point{display:flex;gap:6px;font-family:'Crimson Pro',serif;font-size:13px;color:var(--text);line-height:1.5}
.qp-point::before{content:'→';color:var(--amber-dim);flex-shrink:0;font-family:'Space Mono',monospace}
.qp-dismiss{display:block;width:100%;margin-top:10px;padding:6px;background:transparent;border:1px solid var(--border);border-radius:3px;color:var(--dim);font-family:'Space Mono',monospace;font-size:8px;letter-spacing:.1em;cursor:pointer;text-transform:uppercase}
.qp-dismiss:hover{border-color:var(--muted);color:var(--text)}
/* ALTITUDE GAUGE — D3 Refined + V2 Sunset + Clouds */
.d3-gauge{position:relative;height:220px;border:1px solid #1e2d45;border-radius:10px;overflow:hidden;margin-bottom:10px;background:#0c1218;touch-action:pan-y}
.d3-sky{position:absolute;inset:0;z-index:0;opacity:0;transition:opacity .8s ease;pointer-events:none}
.d3-stars{position:absolute;inset:0;z-index:0;opacity:0;transition:opacity 1s ease;pointer-events:none;background-image:radial-gradient(1.5px 1.5px at 12% 12%,rgba(255,255,255,.9) 0%,transparent 100%),radial-gradient(1.6px 1.6px at 72% 8%,rgba(255,220,150,.85) 0%,transparent 100%),radial-gradient(1.3px 1.3px at 88% 18%,rgba(200,220,255,.8) 0%,transparent 100%),radial-gradient(1.5px 1.5px at 35% 6%,rgba(255,255,255,.8) 0%,transparent 100%),radial-gradient(1.3px 1.3px at 55% 15%,rgba(255,240,200,.75) 0%,transparent 100%),radial-gradient(1.4px 1.4px at 18% 4%,rgba(200,220,255,.7) 0%,transparent 100%),radial-gradient(1px 1px at 22% 28%,rgba(255,255,255,.7) 0%,transparent 100%),radial-gradient(1.1px 1.1px at 45% 35%,rgba(255,255,255,.65) 0%,transparent 100%),radial-gradient(.9px .9px at 65% 25%,rgba(200,200,255,.6) 0%,transparent 100%),radial-gradient(1px 1px at 82% 40%,rgba(255,255,255,.6) 0%,transparent 100%),radial-gradient(1.1px 1.1px at 8% 48%,rgba(255,240,200,.55) 0%,transparent 100%),radial-gradient(.9px .9px at 38% 52%,rgba(255,255,255,.55) 0%,transparent 100%),radial-gradient(1px 1px at 58% 45%,rgba(200,220,255,.55) 0%,transparent 100%),radial-gradient(.8px .8px at 92% 55%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(.7px .7px at 15% 65%,rgba(255,255,255,.4) 0%,transparent 100%),radial-gradient(.7px .7px at 30% 72%,rgba(255,255,255,.35) 0%,transparent 100%),radial-gradient(.8px .8px at 50% 68%,rgba(255,220,200,.35) 0%,transparent 100%),radial-gradient(.6px .6px at 5% 85%,rgba(255,255,255,.3) 0%,transparent 100%),radial-gradient(.7px .7px at 42% 88%,rgba(255,255,255,.3) 0%,transparent 100%),radial-gradient(.8px .8px at 78% 92%,rgba(200,220,255,.3) 0%,transparent 100%)}
.d3-meteor{position:absolute;z-index:2;pointer-events:none;width:1px;height:1px;border-radius:50%;background:#fff;box-shadow:0 0 2px rgba(255,255,255,.6),-4px 2px 0 rgba(255,255,255,.1);opacity:0}
.d3-meteor.shooting{animation:meteorShoot .6s ease-out forwards}
@keyframes meteorShoot{0%{opacity:0;transform:translate(0,0) scale(1)}10%{opacity:.9}100%{opacity:0;transform:translate(-120px,70px) scale(.3)}}
.d3-moonwash{position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 80% 20%,rgba(200,210,230,.12),transparent 60%);opacity:0;transition:opacity .8s ease;pointer-events:none}
.d3-clouds{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity 1s ease;background-image:radial-gradient(ellipse 140px 35px at 22% 14%,rgba(200,212,228,.2),transparent),radial-gradient(ellipse 120px 30px at 60% 18%,rgba(195,208,224,.18),transparent),radial-gradient(ellipse 100px 28px at 82% 12%,rgba(200,212,228,.15),transparent),radial-gradient(ellipse 160px 25px at 40% 28%,rgba(190,205,220,.12),transparent),radial-gradient(ellipse 130px 32px at 15% 35%,rgba(195,208,224,.1),transparent),radial-gradient(ellipse 110px 22px at 70% 32%,rgba(190,205,220,.08),transparent)}
.d3-above-lbl{position:absolute;left:12px;top:6px;font-size:6px;font-weight:700;letter-spacing:.15em;color:rgba(251,191,36,.15);z-index:5}
.d3-horizon{position:absolute;top:42%;left:0;right:0;border-top:1px solid rgba(100,116,139,.2);z-index:3}
.d3-hz-tag{position:absolute;top:42%;left:12px;transform:translateY(-50%);font-size:7px;font-weight:700;letter-spacing:.12em;color:rgba(139,148,166,.45);background:#0c1218;padding-right:6px;z-index:4;transition:background .8s ease}
.d3-zones{position:absolute;top:42%;bottom:0;left:0;right:0;z-index:3;pointer-events:none}
.d3-z{position:absolute;width:100%;display:flex;align-items:flex-end;padding:0 0 4px 12px}
.d3-z1{top:0;height:23%;background:linear-gradient(180deg,rgba(74,222,128,.06),transparent);border-bottom:1px dotted rgba(74,222,128,.05)}
.d3-z2{top:23%;height:23%;background:linear-gradient(180deg,rgba(56,189,248,.05),transparent);border-bottom:1px dotted rgba(56,189,248,.04)}
.d3-z3{top:46%;height:23%;background:linear-gradient(180deg,rgba(167,139,250,.04),transparent);border-bottom:1px dotted rgba(167,139,250,.03)}
.d3-z4{top:69%;height:31%}
.d3-zlbl{font-size:7px;font-weight:700;letter-spacing:.08em;color:rgba(139,148,166,.28);transition:color .4s,text-shadow .4s}
.d3-col{position:absolute;top:6px;bottom:6px;width:40px;transform:translateX(-50%);z-index:5;display:flex;flex-direction:column;align-items:center;pointer-events:none}
.d3-col-t{font-size:7px;font-weight:700;color:rgba(226,232,240,.4);letter-spacing:.2em;margin-bottom:5px}
.d3-rail{width:1.5px;background:rgba(51,65,85,.35);flex:1;position:relative;border-radius:1px}
.d3-sun{position:absolute;left:50%;transform:translate(-50%,-50%);width:18px;height:18px;z-index:6;transition:top .5s ease-out;border-radius:50%;background:radial-gradient(circle at 38% 32%,#fde68a 0%,#fbbf24 45%,#d97706 100%);box-shadow:0 0 6px rgba(251,191,36,.7),0 0 14px rgba(251,191,36,.35),0 0 28px rgba(251,191,36,.15)}
.d3-moon{position:absolute;left:50%;transform:translate(-50%,-50%);width:14px;height:14px;border-radius:50%;z-index:6;transition:top .5s ease-out,box-shadow .6s ease;background:#0c1218;border:1px solid rgba(255,255,255,.06);overflow:hidden}
.d3-moon-lit{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f8fafc 0%,#d4d4d8 55%,#a1a1aa 100%);transition:clip-path .6s ease}
.d3-alt-lbl{position:absolute;left:26px;transform:translateY(-50%);font-size:7px;font-weight:700;white-space:nowrap;transition:top .5s ease-out}
.d3-phase-lbl{text-align:center;font-size:8px;font-weight:700;letter-spacing:.12em;color:#64748b;margin-top:2px;transition:color .4s}
/* SEEING PANEL */
.seeing-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}
.seeing-card{padding:7px 9px;background:rgba(26,48,80,.3);border:1px solid var(--border);border-radius:4px}
.seeing-lbl{font-size:7px;font-weight:700;letter-spacing:.12em;color:var(--dim);text-transform:uppercase;margin-bottom:3px}
.seeing-val{font-size:13px;font-weight:700;line-height:1.2}
.seeing-sub{font-size:8px;color:var(--dim);margin-top:2px}
.seeing-bar{height:3px;border-radius:2px;background:var(--border);margin-top:5px;overflow:hidden}
.seeing-fill{height:100%;border-radius:2px}
/* EXPORT */
.export-btn{width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;background:rgba(26,48,80,.35);border:1px solid var(--border);border-radius:5px;cursor:pointer;transition:all .2s;font-family:'Space Mono',monospace;margin-bottom:6px}
.theme-toggle{position:relative;width:36px;height:20px;border-radius:10px;background:var(--border);cursor:pointer;transition:background .3s;border:none;padding:0;flex-shrink:0}
.theme-toggle.light{background:rgba(251,191,36,.3)}
.theme-toggle::after{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--dim);transition:transform .3s cubic-bezier(.68,-.55,.27,1.55),background .3s}
.theme-toggle.light::after{transform:translateX(16px);background:#fbbf24}
.export-btn:hover{border-color:var(--amber-dim);background:rgba(26,48,80,.55)}
.export-icon{font-size:16px;flex-shrink:0}
.export-label{font-size:10px;font-weight:700;color:var(--bright)}
.export-sub{font-size:8px;color:var(--dim);margin-top:1px}
/* THIS WEEK */
.tw-list{display:flex;flex-direction:column;gap:6px}
.tw-card{display:flex;align-items:flex-start;gap:9px;padding:7px 10px;background:rgba(26,48,80,.25);border:1px solid var(--border);border-radius:4px}
.tw-icon{font-size:16px;flex-shrink:0;line-height:1.3}
.tw-body{flex:1}
.tw-headline{font-size:11px;font-weight:700;color:var(--bright);margin-bottom:2px;line-height:1.3}
.tw-blurb{font-family:'Crimson Pro',serif;font-size:12px;color:var(--text);line-height:1.4}
.tw-source{font-size:7px;color:var(--muted);letter-spacing:.08em;margin-top:2px}
/* PASSWORD GATE */
#gate{position:fixed;inset:0;z-index:9999;background:var(--void);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;transition:opacity .6s,visibility .6s}
#gate.hidden{opacity:0;visibility:hidden;pointer-events:none}
.g-stars{position:fixed;inset:0;background-image:radial-gradient(1px 1px at 8% 7%,rgba(255,255,255,.6) 0%,transparent 100%),radial-gradient(1px 1px at 47% 4%,rgba(255,255,255,.65) 0%,transparent 100%),radial-gradient(1px 1px at 82% 9%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 14% 38%,rgba(255,255,255,.45) 0%,transparent 100%),radial-gradient(1px 1px at 59% 44%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 76% 61%,rgba(255,255,255,.4) 0%,transparent 100%),radial-gradient(1px 1px at 91% 72%,rgba(255,255,255,.55) 0%,transparent 100%),radial-gradient(1px 1px at 28% 83%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1.5px 1.5px at 42% 3%,rgba(255,220,150,.45) 0%,transparent 100%),radial-gradient(1.5px 1.5px at 65% 78%,rgba(255,200,140,.35) 0%,transparent 100%);pointer-events:none}
.g-drift{position:fixed;inset:-20%;width:140%;height:140%;background-image:radial-gradient(1px 1px at 15% 22%,rgba(255,255,255,.3) 0%,transparent 100%),radial-gradient(1px 1px at 58% 12%,rgba(255,255,255,.35) 0%,transparent 100%),radial-gradient(1px 1px at 88% 78%,rgba(255,255,255,.3) 0%,transparent 100%);animation:gDrift 120s linear infinite;pointer-events:none}
@keyframes gDrift{0%{transform:translate(0,0)}50%{transform:translate(-8%,-5%)}100%{transform:translate(0,0)}}
.g-nebula{position:fixed;top:30%;left:50%;width:800px;height:400px;transform:translate(-50%,-50%) rotate(-15deg);background:radial-gradient(ellipse,rgba(100,80,160,.06) 0%,rgba(60,100,180,.03) 40%,transparent 70%);filter:blur(60px);pointer-events:none;animation:gNeb 30s ease-in-out infinite}
@keyframes gNeb{0%,100%{opacity:.7;transform:translate(-50%,-50%) rotate(-15deg) scale(1)}50%{opacity:1;transform:translate(-48%,-52%) rotate(-12deg) scale(1.05)}}
.g-glow{position:fixed;width:500px;height:500px;border-radius:50%;filter:blur(120px);opacity:.08;pointer-events:none}
.g-glow1{top:-15%;left:-10%;background:radial-gradient(circle,rgba(100,150,232,.6),transparent 70%);animation:gGlow 8s ease-in-out infinite}
.g-glow2{bottom:-20%;right:-15%;background:radial-gradient(circle,rgba(232,169,77,.5),transparent 70%);animation:gGlow 11s ease-in-out infinite 3s}
@keyframes gGlow{0%,100%{opacity:.06;transform:scale(1)}50%{opacity:.12;transform:scale(1.1)}}
.g-tw{position:fixed;width:2px;height:2px;border-radius:50%;background:#fff;pointer-events:none;animation:gTw 3s ease-in-out infinite}
@keyframes gTw{0%,100%{opacity:.2;transform:scale(1)}50%{opacity:1;transform:scale(1.4)}}
.g-meteor{position:fixed;top:15%;left:70%;width:1px;height:1px;background:#fff;border-radius:50%;box-shadow:0 0 4px 1px rgba(255,255,255,.3);opacity:0;pointer-events:none;animation:gShoot 9s linear infinite 4s}
@keyframes gShoot{0%{opacity:0;transform:translate(0,0)}2%{opacity:1}8%{opacity:0;transform:translate(-200px,120px)}100%{opacity:0}}
.g-body{position:relative;z-index:1;text-align:center}
.g-ln{width:60px;height:1px;background:linear-gradient(90deg,transparent,var(--amber-dim),transparent);margin:0 auto 16px}
.g-pre{font-size:8px;font-weight:700;letter-spacing:.5em;color:var(--dim);text-transform:uppercase;margin-bottom:8px;animation:gUp .8s ease both}
.g-title{font-size:clamp(18px,5vw,28px);font-weight:700;letter-spacing:.4em;color:var(--amber);text-transform:uppercase;text-shadow:0 0 30px rgba(232,169,77,.25),0 0 60px rgba(232,169,77,.1);line-height:1.3;margin-bottom:8px;animation:gUp .8s ease both}
.g-lnb{width:40px;height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);margin:16px auto 40px}
.g-form{width:100%;max-width:340px;margin:0 auto;animation:gUp .8s ease .2s both}
.g-fld{position:relative;margin-bottom:10px}
.g-inp{width:100%;padding:14px 48px 14px 16px;background:rgba(13,30,53,.7);border:1px solid var(--border);border-radius:6px;color:var(--bright);font-family:'Space Mono',monospace;font-size:13px;letter-spacing:.06em;outline:none;transition:border-color .3s,box-shadow .3s;-webkit-appearance:none}
.g-inp::placeholder{color:var(--muted);letter-spacing:.1em;font-size:11px}
.g-inp:focus{border-color:var(--amber-dim);box-shadow:0 0 20px rgba(232,169,77,.08)}
.g-sub{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:38px;height:38px;background:rgba(232,169,77,.1);border:1px solid var(--amber-dim);border-radius:4px;color:var(--amber);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.g-sub:hover{background:rgba(232,169,77,.2);box-shadow:0 0 12px rgba(232,169,77,.15)}
.g-sub:active{transform:translateY(-50%) scale(.95)}
.g-err{font-size:10px;color:var(--red);letter-spacing:.08em;text-align:center;min-height:16px;opacity:0;transition:opacity .3s}
.g-err.visible{opacity:1}
.g-foot{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);text-align:center;font-size:8px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase;animation:gUp .8s ease .5s both}
@keyframes gUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:480px){.g-title{letter-spacing:.3em}.g-foot{bottom:14px}}
/* TRACKER */
.trk-section{margin-bottom:12px;border:1px solid var(--border);border-radius:8px;background:rgba(13,30,53,.72);overflow:hidden;transition:border-color .2s}
.trk-section.complete{border-color:rgba(77,200,160,.3)}

/* Section header — 44pt min touch height */
.trk-sec-hdr{display:flex;flex-direction:column;gap:8px;padding:12px 14px 10px;cursor:pointer;user-select:none;background:rgba(26,48,80,.4);-webkit-tap-highlight-color:transparent}
.trk-sec-hdr:active{background:rgba(26,48,80,.6)}
.trk-sec-top{display:flex;align-items:center;justify-content:space-between;min-height:28px}
.trk-sec-left{display:flex;align-items:center;gap:9px;flex:1;min-width:0}
.trk-sec-icon{font-size:13px;line-height:1;flex-shrink:0;width:18px;text-align:center}
.trk-sec-title{font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--bright);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trk-sec-title.complete{color:var(--green)}
.trk-sec-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
.trk-sec-count{font-size:10px;color:var(--dim);font-family:'Space Mono',monospace;letter-spacing:.04em}
.trk-sec-count.complete{color:var(--green)}
.trk-sec-arrow{font-size:10px;color:var(--muted);transition:transform .22s;display:inline-block;width:14px;text-align:center}
.trk-sec-arrow.open{transform:rotate(180deg)}
.trk-progress-bar{height:3px;background:rgba(26,48,80,.6);border-radius:2px;overflow:hidden}
.trk-progress-fill{height:100%;border-radius:2px;transition:width .35s ease}

/* Section action row — always visible, never hover-only */
.trk-sec-actions{display:flex;align-items:center;gap:2px;margin-left:4px;flex-shrink:0}
.trk-sec-act{display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:transparent;border:none;border-radius:6px;font-size:13px;color:var(--muted);cursor:pointer;transition:background .12s,color .12s;-webkit-tap-highlight-color:transparent}
.trk-sec-act:active{background:rgba(26,48,80,.5);color:var(--text)}
.trk-sec-act.del:active{background:rgba(232,85,85,.12);color:var(--red)}

/* Body */
.trk-body{display:none;padding:2px 0 6px}
.trk-body.open{display:block}

/* Item row — 44pt min touch height */
.trk-item{display:flex;align-items:center;gap:0;padding:0 14px;border-bottom:1px solid rgba(26,48,80,.3);min-height:44px;-webkit-tap-highlight-color:transparent}
.trk-item:last-child{border-bottom:none}
.trk-item-check-area{display:flex;align-items:center;justify-content:center;width:36px;height:44px;flex-shrink:0;cursor:pointer}
.trk-checkbox{width:20px;height:20px;border-radius:5px;border:1.5px solid var(--muted);background:transparent;display:flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0;pointer-events:none}
.trk-checkbox.checked{border-color:var(--green);background:rgba(77,200,160,.15)}
.trk-check-mark{font-size:11px;font-weight:700;color:var(--green);line-height:1}
.trk-item-label{font-size:12px;color:var(--text);line-height:1.4;flex:1;padding:12px 8px 12px 0;cursor:pointer}
.trk-item-label.checked{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(77,200,160,.35)}

/* Item actions — always visible on the right, 44pt touch targets */
.trk-item-actions{display:flex;align-items:center;gap:0;flex-shrink:0}
.trk-act-btn{display:flex;align-items:center;justify-content:center;width:36px;height:44px;background:transparent;border:none;font-size:14px;color:var(--muted);cursor:pointer;transition:color .12s;-webkit-tap-highlight-color:transparent;flex-shrink:0}
.trk-act-btn:active{color:var(--text)}
.trk-act-btn.del:active{color:var(--red)}
.trk-act-btn:disabled{opacity:.2;pointer-events:none}

/* Add item row */
.trk-add-item{display:flex;align-items:center;gap:10px;padding:0 14px;min-height:44px;cursor:pointer;border-top:1px solid rgba(26,48,80,.2);-webkit-tap-highlight-color:transparent}
.trk-add-item:active{background:rgba(26,48,80,.3)}
.trk-add-icon{font-size:18px;color:var(--amber);width:20px;text-align:center;line-height:1}
.trk-add-item-lbl{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
/* CREDITS */
.credits{margin:30px 10px 0;padding:12px;border-top:1px solid var(--border);text-align:center;font-size:7px;letter-spacing:.12em;color:var(--muted);text-transform:uppercase;line-height:2}

/* ═══ POLISH: transitions & micro-interactions ═══ */
.section{transition:box-shadow .2s;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.section:hover{box-shadow:0 2px 10px rgba(0,0,0,.38),0 0 0 1px rgba(232,169,77,.08)}
.object-card{transition:border-color .15s,box-shadow .15s,transform .1s}
.object-card:hover{box-shadow:0 1px 6px rgba(0,0,0,.3)}
.object-card:active{transform:scale(.995)}
.section-header{transition:background .15s}
.section-header:hover{background:rgba(26,48,80,.65)}
.filter-btn{transition:all .15s}
.filter-btn:active{transform:scale(.95)}
.nav-tab{transition:color .15s,background .15s}
.nav-tab:active{background:rgba(26,48,80,.3)}
.header{transition:box-shadow .2s}
html{scroll-behavior:smooth;overscroll-behavior:none;-webkit-overflow-scrolling:touch}
.header.scrolled{box-shadow:0 2px 12px rgba(0,0,0,.5)}
.export-btn:active{transform:scale(.98)}
.qp-btn:active{transform:scale(.98)}
.seen-check{transition:all .15s}
.seen-check:active{transform:scale(.85)}

/* ═══ RESPONSIVE: small mobile 360px–480px ═══ */
@media(max-width:480px){
  #app{padding-bottom:68px}
  .header{padding:12px 14px 0}
  .site-subtitle{font-size:13px}
  .clock-time{font-size:22px}
  .coord-bar{gap:10px;font-size:8px}
  .section{margin:8px 8px 0;border-radius:6px}
  .section-header{padding:9px 12px}
  .section-body.open{padding:10px 12px}
  .bottom-nav{padding:0 4px}
  .nav-tab{padding:6px 4px 8px;font-size:7px;letter-spacing:.1em}
  .nav-icon{font-size:17px;margin-bottom:2px}
  .hero{margin:8px 8px 0;padding:20px 14px 18px;padding-right:108px}
  .hero-nm-light{font-size:30px}
  .hero-nm-bold{font-size:33px}
  .hero-sub{font-size:13px;margin-bottom:14px}
  .hero-notify-btn{font-size:10px;padding:8px 14px}
  .qp-card-name{font-size:20px}
  .qp-card-narrative{font-size:14px}
  .qp-btn-text{font-size:11px}
  .object-notes{font-size:14px}
}

/* ═══ RESPONSIVE: tablet 680px+ ═══ */
@media(min-width:680px){
  #app{max-width:680px}
  .bottom-nav{max-width:680px}
  .header{padding:16px 20px 0}
  .site-title{font-size:12px;letter-spacing:.4em}
  .site-subtitle{font-size:15px}
  .clock-time{font-size:26px}
  .clock-date,.clock-lst{font-size:10px}
  .coord-bar{font-size:10px;gap:18px}
  .section{margin:12px 14px 0;border-radius:8px}
  .section-header{padding:10px 16px}
  .section-label{font-size:10px;letter-spacing:.22em}
  .section-body.open{padding:12px 16px}
  .object-card-header{padding:9px 14px}
  .object-name{font-size:12px}
  .object-expand.open{padding:0 14px 14px}
  .object-notes{font-size:16px}
  .filter-btn{padding:4px 10px;font-size:9px}
  .qp-btn{padding:14px 18px}
  .qp-btn-text{font-size:13px}
  .qp-card-name{font-size:24px}
  .qp-card-body{padding:14px 18px}
  .qp-card-narrative{font-size:16px}
  .credits{margin:30px 14px 0;padding:14px;font-size:8px}
  .nav-tab{font-size:7.5px;letter-spacing:.15em}
  .nav-icon{font-size:19px}
  .export-btn{padding:12px 16px}
  .seeing-grid{gap:8px}
  .seeing-card{padding:9px 12px}
  .seeing-val{font-size:15px}
  .wx-col{min-width:62px;width:62px;padding:9px 8px 8px}
  .wx-temp{font-size:17px}
  .g-title{font-size:32px;letter-spacing:.5em}
  .g-pre{font-size:9px;letter-spacing:.6em}
  .g-form{max-width:400px}
  .g-inp{font-size:14px;padding:16px 52px 16px 18px}
  .g-sub{width:42px;height:42px;font-size:18px}
  .g-foot{font-size:9px}
}

/* ═══ RESPONSIVE: desktop 1024px+ ═══ */
@media(min-width:1024px){
  #app{max-width:800px}
  .bottom-nav{max-width:800px}
  .header{padding:18px 24px 0}
  .site-title{font-size:13px;letter-spacing:.45em}
  .site-subtitle{font-size:16px}
  .clock-time{font-size:28px}
  .clock-date,.clock-lst{font-size:11px}
  .coord-bar{font-size:11px;gap:20px}
  .section{margin:14px 18px 0}
  .section-header{padding:12px 18px}
  .section-body.open{padding:14px 18px}
  .section-label{font-size:11px;gap:8px}
  .section-toggle{font-size:12px}
  .object-card-header{padding:10px 16px;gap:10px}
  .object-designation{font-size:12px}
  .object-name{font-size:15px}
  .object-mag{font-size:11px}
  .object-dist{font-size:10px}
  .object-type{font-size:9px}
  .object-alt{font-size:10px}
  .obj-badge{font-size:9px}
  .object-notes{font-size:17px;line-height:1.7}
  .stat{font-size:11px}
  .tsl-link{font-size:11px}
  .filter-btn{padding:5px 12px;font-size:10px}
  .instr-btn{font-size:10px;padding:4px 10px}
  .bucket-label{font-size:10px}
  .bucket-wx{font-size:9px}
  .tl-header-left{font-size:10px}
  .tl-name{font-size:12px}
  .tl-desg{font-size:10px}
  .tl-alt{font-size:9px}
  .tl-type{font-size:9px}
  .tl-badge{font-size:9px}
  .tl-clear{font-size:9px}
  .event-title{font-size:12px}
  .event-meta{font-size:10px}
  .event-note{font-size:14px}
  .wx-hour{font-size:9px}
  .wx-wind{font-size:9px}
  .wx-temp{font-size:17px}
  .wx-cloud{font-size:10px}
  .wx-summary{font-size:11px}
  .obs-quality{font-size:10px}
  .hero-avail{font-size:10px}
  .slider-label{font-size:10px}
  .qp-btn-text{font-size:13px}
  .qp-card-name{font-size:26px}
  .qp-card-narrative{font-size:17px}
  .nav-tab{font-size:8px;letter-spacing:.14em}
  .export-btn{padding:14px 18px}
  .export-label{font-size:11px}
  .credits{font-size:9px;letter-spacing:.14em}
  .g-title{font-size:38px}
  .g-ln{width:80px}
  .g-lnb{width:50px;margin:20px auto 48px}
}

/* ── HERO ─────────────────────────────────────────────────── */
.hero{margin:12px 10px 0;padding:26px 20px 22px;border:1px solid rgba(232,169,77,.18);border-radius:10px;background:linear-gradient(155deg,rgba(5,9,18,.97) 0%,rgba(2,5,12,.99) 100%);position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-70px;right:-70px;width:260px;height:260px;background:radial-gradient(circle,rgba(232,169,77,.1) 0%,rgba(232,169,77,.03) 45%,transparent 70%);pointer-events:none}
.hero::after{content:'';position:absolute;bottom:-40px;left:-40px;width:180px;height:180px;background:radial-gradient(circle,rgba(100,150,232,.06) 0%,transparent 65%);pointer-events:none}
.hero-avail{font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--amber-dim);margin-bottom:14px;display:flex;align-items:center;gap:5px}
.hero-name{margin:0 0 14px;line-height:1}
.hero-nm-light{font-family:'Crimson Pro',serif;font-size:34px;font-weight:300;color:#eff0f0;display:block;line-height:.92;letter-spacing:-.01em}
.hero-nm-bold{font-family:'Crimson Pro',serif;font-size:37px;font-weight:700;font-style:italic;color:var(--amber);display:block;line-height:.95;letter-spacing:-.02em;text-shadow:0 0 20px rgba(232,169,77,.16)}
.hero-sub{font-family:'Crimson Pro',serif;font-size:15px;font-weight:300;color:rgba(170,200,220,.65);line-height:1.65;margin-bottom:18px}
/* hero reuses dp-badge + dp-pills with small overrides */
.hero .dp-badge{margin-bottom:14px;padding:8px 16px}
.hero .dp-badge-main{font-size:18px}
.hero .dp-pills{justify-content:flex-start;margin-bottom:0}
/* ── Hero phone mockup ── */
.hero{padding-right:120px} /* room for the phone */
.hero-device{position:absolute;right:10px;top:18px;width:96px}
.hero-device-glow{position:absolute;bottom:-12px;left:50%;transform:translateX(-50%);width:90px;height:48px;background:radial-gradient(ellipse,rgba(180,210,255,.22) 0%,rgba(232,169,77,.1) 55%,transparent 72%);pointer-events:none;z-index:0}
.hero-device-phone{position:relative;width:96px;height:208px;border-radius:17px;background:#000;border:1.5px solid rgba(255,255,255,.14);box-shadow:-6px 10px 36px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.03),inset 0 0 0 1px rgba(0,0,0,.9);overflow:hidden;z-index:1;transform:rotate(2deg)}
/* Mobile: hide phone mockup on very small screens to give text room */
@media(max-width:400px){
  .hero{padding-right:20px}
  .hero-device{display:none}
}
.hero-device-phone img{width:100%;height:100%;object-fit:cover;display:block}
.hero-device-island{position:absolute;top:7px;left:50%;transform:translateX(-50%);width:36px;height:11px;background:#000;border-radius:5.5px;z-index:5;border:1px solid rgba(255,255,255,.06)}
/* legacy — keep in case referenced elsewhere */
.appstore-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;background:var(--amber);border-radius:5px;color:var(--void);font-family:'Space Mono',monospace;font-size:8px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;border:none;transition:background .15s;box-shadow:0 0 18px rgba(232,169,77,.3)}
.appstore-btn:hover{background:#f0bc62}
.hero-meta{margin-top:9px;font-size:8px;color:var(--dim);letter-spacing:.08em}
/* ── NAV DOWNLOAD TAB ──────────────────────────────────────── */
.nav-tab.nav-dl{color:rgba(232,169,77,.7);background:rgba(232,169,77,.06);border-left:1px solid rgba(232,169,77,.12);position:relative}
.nav-tab.nav-dl .nav-icon{filter:drop-shadow(0 0 5px rgba(232,169,77,.5));transition:filter .2s,transform .2s}
.nav-tab.nav-dl.active{color:var(--amber);background:rgba(232,169,77,.1)}
.nav-tab.nav-dl.active .nav-icon{filter:drop-shadow(0 0 8px rgba(232,169,77,.7))}
.nav-dot{position:absolute;top:7px;right:calc(50% - 14px);width:4px;height:4px;border-radius:50%;background:var(--amber);box-shadow:0 0 5px rgba(232,169,77,.6);animation:pulse 2.5s ease-in-out infinite}
/* ── OBJECTS CTA ────────────────────────────────────────────── */
.obj-cta{margin:4px 0 14px;padding:14px;border:1px dashed rgba(232,169,77,.2);border-radius:6px;background:rgba(232,169,77,.03);text-align:center}
.obj-cta-count{font-size:11px;font-weight:700;color:var(--amber);letter-spacing:.06em;margin-bottom:5px}
.obj-cta-sub{font-family:'Crimson Pro',serif;font-size:13px;color:var(--dim);font-style:italic;margin-bottom:11px;line-height:1.5}
.obj-cta-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;background:rgba(232,169,77,.1);border:1px solid var(--amber-dim);border-radius:4px;color:var(--amber);font-family:'Space Mono',monospace;font-size:8px;font-weight:700;letter-spacing:.12em;cursor:pointer;text-decoration:none;transition:background .15s}
.obj-cta-btn:hover{background:rgba(232,169,77,.18)}
/* ═══════════════════════════════════════════
   DOWNLOAD PAGE — Premium Redesign
═══════════════════════════════════════════ */
.site-footer{display:none}
/* ── Continuous dark canvas for the whole download page ── */
#page-download{overflow:hidden;padding-bottom:62px;position:relative;background:#000}
/* Sparse persistent starfield — spans full page height so stars are always visible.
   Dense .dp-stars in hero + .dp-cta-stars in CTA naturally enrich top & bottom.
   Middle scroll-scenes show only these sparser stars → graceful density gradient. */
#page-download::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;
background-image:
  radial-gradient(1px 1px at 6% 2%,rgba(255,255,255,.55) 0%,transparent 100%),
  radial-gradient(1px 1px at 17% 7%,rgba(255,255,255,.4) 0%,transparent 100%),
  radial-gradient(1px 1px at 33% 4%,rgba(255,255,255,.6) 0%,transparent 100%),
  radial-gradient(1px 1px at 49% 1%,rgba(255,255,255,.45) 0%,transparent 100%),
  radial-gradient(1px 1px at 64% 9%,rgba(255,255,255,.5) 0%,transparent 100%),
  radial-gradient(1px 1px at 80% 5%,rgba(255,255,255,.65) 0%,transparent 100%),
  radial-gradient(1px 1px at 93% 11%,rgba(255,255,255,.35) 0%,transparent 100%),
  radial-gradient(1px 1px at 9% 22%,rgba(255,255,255,.45) 0%,transparent 100%),
  radial-gradient(1px 1px at 26% 18%,rgba(255,255,255,.5) 0%,transparent 100%),
  radial-gradient(1px 1px at 42% 27%,rgba(255,255,255,.4) 0%,transparent 100%),
  radial-gradient(1px 1px at 57% 20%,rgba(255,255,255,.55) 0%,transparent 100%),
  radial-gradient(1px 1px at 72% 31%,rgba(255,255,255,.45) 0%,transparent 100%),
  radial-gradient(1px 1px at 88% 17%,rgba(255,255,255,.6) 0%,transparent 100%),
  radial-gradient(1px 1px at 3% 39%,rgba(255,255,255,.5) 0%,transparent 100%),
  radial-gradient(1px 1px at 20% 45%,rgba(255,255,255,.35) 0%,transparent 100%),
  radial-gradient(1px 1px at 38% 42%,rgba(255,255,255,.55) 0%,transparent 100%),
  radial-gradient(1px 1px at 54% 37%,rgba(255,255,255,.4) 0%,transparent 100%),
  radial-gradient(1px 1px at 70% 50%,rgba(255,255,255,.45) 0%,transparent 100%),
  radial-gradient(1px 1px at 85% 44%,rgba(255,255,255,.5) 0%,transparent 100%),
  radial-gradient(1px 1px at 12% 60%,rgba(255,255,255,.45) 0%,transparent 100%),
  radial-gradient(1px 1px at 30% 66%,rgba(255,255,255,.4) 0%,transparent 100%),
  radial-gradient(1px 1px at 46% 57%,rgba(255,255,255,.55) 0%,transparent 100%),
  radial-gradient(1px 1px at 62% 63%,rgba(255,255,255,.35) 0%,transparent 100%),
  radial-gradient(1px 1px at 78% 58%,rgba(255,255,255,.5) 0%,transparent 100%),
  radial-gradient(1px 1px at 95% 69%,rgba(255,255,255,.45) 0%,transparent 100%),
  radial-gradient(1px 1px at 7% 76%,rgba(255,255,255,.5) 0%,transparent 100%),
  radial-gradient(1px 1px at 24% 83%,rgba(255,255,255,.4) 0%,transparent 100%),
  radial-gradient(1px 1px at 43% 79%,rgba(255,255,255,.55) 0%,transparent 100%),
  radial-gradient(1px 1px at 60% 87%,rgba(255,255,255,.45) 0%,transparent 100%),
  radial-gradient(1px 1px at 76% 81%,rgba(255,255,255,.6) 0%,transparent 100%),
  radial-gradient(1px 1px at 91% 92%,rgba(255,255,255,.35) 0%,transparent 100%),
  radial-gradient(1.5px 1.5px at 35% 14%,rgba(255,235,180,.65) 0%,transparent 100%),
  radial-gradient(1.5px 1.5px at 68% 73%,rgba(180,210,255,.6) 0%,transparent 100%),
  radial-gradient(1.5px 1.5px at 15% 52%,rgba(255,235,180,.5) 0%,transparent 100%)
}
/* ── DOWNLOAD: hide app shell, full-bleed starfield ─────────── */
body.on-download #app{display:none}
/* ── HERO ENTRANCE: stagger-animate in on tab switch ─────────── */
.dp-hero-inner > *,.dp-hero-device{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}
#page-download.enter .dp-hero-inner > *:nth-child(1){opacity:1;transform:none;transition-delay:.06s}
#page-download.enter .dp-hero-inner > *:nth-child(2){opacity:1;transform:none;transition-delay:.18s}
#page-download.enter .dp-hero-inner > *:nth-child(3){opacity:1;transform:none;transition-delay:.3s}
#page-download.enter .dp-hero-inner > *:nth-child(4){opacity:1;transform:none;transition-delay:.42s}
#page-download.enter .dp-hero-inner > *:nth-child(5){opacity:1;transform:none;transition-delay:.52s}
#page-download.enter .dp-hero-device{opacity:1;transform:none;transition-delay:.24s}
/* ── CTA SCROLL REVEAL ───────────────────────────────────────── */
.dp-cta-inner{opacity:0;transform:translateY(22px);transition:opacity .85s ease,transform .85s ease}
.dp-cta.visible .dp-cta-inner{opacity:1;transform:none}

/* ── Shared full-bleed section — transparent so page starfield shows through ── */
.dp-hero,.dp-scene,.dp-cta{width:100%;position:relative;overflow:hidden;z-index:1}

/* ── HERO ─────────────────────────── */
.dp-hero{background:transparent;display:flex;flex-direction:column;align-items:center;padding-top:52px}
/* Dense star field */
.dp-stars,.dp-cta-stars{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1px 1px at 4% 3%,rgba(255,255,255,.9) 0%,transparent 100%),radial-gradient(1px 1px at 12% 17%,rgba(255,255,255,.6) 0%,transparent 100%),radial-gradient(1px 1px at 19% 8%,rgba(255,255,255,.75) 0%,transparent 100%),radial-gradient(1px 1px at 27% 2%,rgba(255,255,255,.85) 0%,transparent 100%),radial-gradient(1px 1px at 34% 13%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 43% 7%,rgba(255,255,255,.7) 0%,transparent 100%),radial-gradient(1px 1px at 51% 19%,rgba(255,255,255,.65) 0%,transparent 100%),radial-gradient(1px 1px at 58% 5%,rgba(255,255,255,.8) 0%,transparent 100%),radial-gradient(1px 1px at 67% 14%,rgba(255,255,255,.55) 0%,transparent 100%),radial-gradient(1px 1px at 74% 3%,rgba(255,255,255,.9) 0%,transparent 100%),radial-gradient(1px 1px at 82% 11%,rgba(255,255,255,.6) 0%,transparent 100%),radial-gradient(1px 1px at 91% 18%,rgba(255,255,255,.75) 0%,transparent 100%),radial-gradient(1px 1px at 97% 7%,rgba(255,255,255,.45) 0%,transparent 100%),radial-gradient(1px 1px at 8% 29%,rgba(255,255,255,.7) 0%,transparent 100%),radial-gradient(1px 1px at 16% 38%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 25% 33%,rgba(255,255,255,.8) 0%,transparent 100%),radial-gradient(1px 1px at 39% 42%,rgba(255,255,255,.55) 0%,transparent 100%),radial-gradient(1px 1px at 48% 27%,rgba(255,255,255,.7) 0%,transparent 100%),radial-gradient(1px 1px at 56% 36%,rgba(255,255,255,.85) 0%,transparent 100%),radial-gradient(1px 1px at 65% 24%,rgba(255,255,255,.6) 0%,transparent 100%),radial-gradient(1px 1px at 73% 41%,rgba(255,255,255,.75) 0%,transparent 100%),radial-gradient(1px 1px at 85% 32%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 94% 28%,rgba(255,255,255,.65) 0%,transparent 100%),radial-gradient(1px 1px at 3% 54%,rgba(255,255,255,.8) 0%,transparent 100%),radial-gradient(1px 1px at 15% 61%,rgba(255,255,255,.45) 0%,transparent 100%),radial-gradient(1px 1px at 29% 57%,rgba(255,255,255,.7) 0%,transparent 100%),radial-gradient(1px 1px at 42% 68%,rgba(255,255,255,.55) 0%,transparent 100%),radial-gradient(1px 1px at 54% 52%,rgba(255,255,255,.85) 0%,transparent 100%),radial-gradient(1px 1px at 63% 74%,rgba(255,255,255,.6) 0%,transparent 100%),radial-gradient(1px 1px at 77% 59%,rgba(255,255,255,.75) 0%,transparent 100%),radial-gradient(1px 1px at 88% 66%,rgba(255,255,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 96% 63%,rgba(255,255,255,.65) 0%,transparent 100%),radial-gradient(1px 1px at 7% 78%,rgba(255,255,255,.8) 0%,transparent 100%),radial-gradient(1px 1px at 21% 84%,rgba(255,255,255,.55) 0%,transparent 100%),radial-gradient(1px 1px at 37% 91%,rgba(255,255,255,.7) 0%,transparent 100%),radial-gradient(1px 1px at 52% 86%,rgba(255,255,255,.45) 0%,transparent 100%),radial-gradient(1px 1px at 68% 93%,rgba(255,255,255,.65) 0%,transparent 100%),radial-gradient(1px 1px at 79% 88%,rgba(255,255,255,.8) 0%,transparent 100%),radial-gradient(1px 1px at 92% 82%,rgba(255,255,255,.55) 0%,transparent 100%),radial-gradient(1.5px 1.5px at 33% 22%,rgba(255,235,180,.85) 0%,transparent 100%),radial-gradient(1.5px 1.5px at 71% 48%,rgba(180,210,255,.8) 0%,transparent 100%),radial-gradient(1.5px 1.5px at 46% 79%,rgba(255,235,180,.75) 0%,transparent 100%),radial-gradient(2px 2px at 14% 46%,rgba(255,255,255,.9) 0%,transparent 100%),radial-gradient(2px 2px at 87% 55%,rgba(180,210,255,.85) 0%,transparent 100%)}
/* Amber nebula glow */
.dp-nebula,.dp-cta-nebula{position:absolute;left:50%;transform:translateX(-50%);width:100%;pointer-events:none}
.dp-nebula{top:0;height:380px;background:radial-gradient(ellipse 65% 55% at 50% 25%,rgba(232,169,77,.15) 0%,rgba(232,169,77,.05) 45%,transparent 70%)}
.dp-cta-nebula{top:0;height:320px;background:radial-gradient(ellipse 70% 60% at 50% 15%,rgba(232,169,77,.13) 0%,rgba(232,169,77,.04) 50%,transparent 72%)}
/* Hero text */
.dp-hero-inner{position:relative;z-index:2;text-align:center;padding:0 28px;max-width:460px;width:100%;margin:0 auto}
.dp-eyebrow{font-size:9px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--amber-dim);margin-bottom:20px;display:flex;align-items:center;justify-content:center;gap:6px}
.dp-headline{display:flex;flex-direction:column;align-items:center;margin-bottom:18px;gap:0}
.dp-hl-light{font-family:'Crimson Pro',serif;font-size:48px;font-weight:300;color:#f8f8f8;line-height:.92;letter-spacing:-.01em;display:block}
.dp-hl-bold{font-family:'Crimson Pro',serif;font-size:52px;font-weight:700;font-style:italic;color:var(--amber);line-height:.95;letter-spacing:-.02em;display:block;text-shadow:0 0 22px rgba(232,169,77,.16),0 0 50px rgba(232,169,77,.07)}
.dp-tagline{font-family:'Crimson Pro',serif;font-size:17px;font-weight:300;color:rgba(200,221,232,.78);line-height:1.7;margin-bottom:26px}
/* App Store badge */
.dp-badge{display:inline-flex;flex-direction:column;align-items:flex-start;background:#fff;border-radius:12px;padding:10px 20px;text-decoration:none;box-shadow:0 6px 28px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06);transition:transform .13s,box-shadow .13s;margin-bottom:18px}
.dp-badge:hover{transform:translateY(-2px);box-shadow:0 10px 36px rgba(0,0,0,.6)}
.dp-badge-sub{font-size:9px;color:#000;letter-spacing:.05em;line-height:1;font-family:-apple-system,'Helvetica Neue',sans-serif;display:block}
.dp-badge-main{display:flex;align-items:center;gap:7px;font-size:21px;font-weight:700;color:#000;line-height:1.2;font-family:-apple-system,'Helvetica Neue',sans-serif;margin-top:2px}
.dp-badge-lg .dp-badge-main{font-size:25px}
.dp-pills{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}
.dp-pills span{font-size:10px;font-weight:700;letter-spacing:.12em;padding:3px 10px;border-radius:20px;border:1px solid rgba(232,169,77,.22);color:rgba(138,95,32,.85);background:rgba(232,169,77,.07)}
/* Hero phone */
.dp-hero-device{position:relative;z-index:2;display:flex;justify-content:center;margin-top:32px}
.dp-device-glow{position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);width:360px;height:260px;background:radial-gradient(ellipse,rgba(232,169,77,.38) 0%,rgba(232,169,77,.14) 35%,rgba(232,169,77,.04) 60%,transparent 72%);pointer-events:none;z-index:1}
.dp-phone{position:relative;width:240px;height:521px;border-radius:34px;background:#000;border:2px solid rgba(255,255,255,.15);box-shadow:0 28px 90px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.04),inset 0 0 0 1px rgba(0,0,0,.9);overflow:hidden;z-index:2;flex-shrink:0}
/* Dynamic Island */
.dp-island{position:absolute;top:13px;left:50%;transform:translateX(-50%);width:86px;height:26px;background:#000;border-radius:13px;z-index:10;border:1.5px solid rgba(255,255,255,.07)}
.dp-phone img{width:100%;height:100%;object-fit:cover;display:block}

/* ── SCROLL REVEAL SCENES ─────────────────────── */
.dp-scene{width:100%;padding:84px 0;background:transparent}
.dp-sn-inner{max-width:880px;margin:0 auto;padding:0 48px;display:flex;align-items:center;gap:64px}
.dp-scene[data-dir="right"] .dp-sn-inner{flex-direction:row-reverse}
/* Scene phone column */
.dp-sn-phone{flex-shrink:0;position:relative;display:flex;justify-content:center}
.dp-sn-glow{position:absolute;bottom:-28px;left:50%;transform:translateX(-50%);width:210px;height:90px;background:radial-gradient(ellipse,rgba(232,169,77,.18) 0%,rgba(232,169,77,.05) 55%,transparent 70%);pointer-events:none}
/* Scene copy column */
.dp-sn-copy{flex:1;min-width:0}
.dp-sn-num{font-family:'Space Mono',monospace;font-size:10px;color:var(--amber-dim);letter-spacing:.24em;margin-bottom:14px}
.dp-sn-divider{width:28px;height:1px;background:var(--amber);opacity:.5;margin-bottom:22px}
.dp-sn-title{font-family:'Crimson Pro',serif;font-size:44px;font-weight:300;color:#eff0f0;line-height:.95;letter-spacing:-.01em;margin:0 0 20px}
.dp-sn-title em{font-style:italic;font-weight:700;color:var(--amber);text-shadow:0 0 18px rgba(232,169,77,.18)}
.dp-sn-body{font-family:'Crimson Pro',serif;font-size:17px;font-weight:300;color:rgba(175,205,225,.78);line-height:1.74;max-width:340px;margin:0}
/* ANIMATION — pre-reveal */
.dp-reveal-phone{opacity:0;transition:opacity .88s ease .14s,transform .9s cubic-bezier(.25,.46,.45,.94) .14s}
.dp-scene[data-dir="left"] .dp-reveal-phone{transform:translateX(-62px) translateY(8px)}
.dp-scene[data-dir="right"] .dp-reveal-phone{transform:translateX(62px) translateY(8px)}
/* Copy floats up from below — visual contrast with phone's sideways slide */
.dp-reveal-copy{opacity:0;transform:translateY(34px);transition:opacity .88s ease .58s,transform .9s cubic-bezier(.25,.46,.45,.94) .58s}
/* ANIMATION — revealed */
.dp-scene.visible .dp-reveal-phone,.dp-scene.visible .dp-reveal-copy{opacity:1;transform:none}
/* Mobile: download page */
@media(max-width:700px){

  /* ── Scroll scenes ──
     column-reverse puts copy ABOVE the phone in every scene.
     This breaks up the consecutive-phone problem (hero phone → scene phone)
     and creates the natural reading flow: headline → body → screenshot. */
  .dp-sn-inner{flex-direction:column-reverse!important;gap:28px;padding:0 20px}
  .dp-sn-copy{text-align:center}
  .dp-problem-stmt{padding:36px 24px}
  .dp-problem-stmt p{font-size:17px}
  .dp-trust{padding:0 24px 28px}
  .dp-value-anchor{padding:52px 28px 68px}
  .dp-value-eyebrow{font-size:13px;letter-spacing:.16em;margin-bottom:24px}
  .dp-value-compare{margin-bottom:40px}
  .dp-value-tagline{font-size:38px}
  .dp-value-other,.dp-value-price{font-size:16px}
  .dp-sn-divider{margin:0 auto 18px}
  .dp-sn-num{margin-bottom:10px}
  .dp-sn-body{max-width:100%;font-size:15px}
  .dp-sn-title{font-size:30px}
  .dp-scene{padding:56px 0}

  /* ── Mobile animations ──
     Ditch the horizontal translateX slides (designed for desktop side-by-side).
     Use pure vertical stagger: copy rises in first, phone follows after.
     This maps to natural mobile scroll rhythm. */
  .dp-reveal-copy{
    transform:translateY(26px);
    transition:opacity .8s ease .08s, transform .85s cubic-bezier(.25,.46,.45,.94) .08s
  }
  .dp-reveal-phone{
    transform:translateY(36px)!important;
    transition:opacity .85s ease .46s, transform .9s cubic-bezier(.25,.46,.45,.94) .46s
  }
  .dp-scene.visible .dp-reveal-copy,
  .dp-scene.visible .dp-reveal-phone{
    opacity:1;
    transform:translateY(0)!important
  }

  /* ── Hero ── */
  .dp-hero{padding-top:36px}
  .dp-hero-inner{padding:0 22px}
  .dp-eyebrow{margin-bottom:14px;font-size:8px}
  .dp-hl-light{font-size:34px}
  .dp-hl-bold{font-size:38px}
  .dp-headline{margin-bottom:24px}
  .dp-tagline{font-size:16px;margin-bottom:34px}
  .dp-hero-device{margin-top:24px;margin-bottom:4px}

  /* ── Phone mockup — slightly smaller on mobile ── */
  .dp-phone{width:200px;height:434px}
  .dp-device-glow{width:260px;height:180px}

  /* ── CTA ── */
  .dp-cta{padding:68px 24px 84px}
  .dp-cta-head{font-size:40px;margin-bottom:28px}

  /* ── Email form — stacks vertically on mobile ── */
  .dp-signup{max-width:100%;padding:0}
  .dp-email-form{flex-direction:column;border-radius:8px}
  .dp-email-input{border-radius:8px 8px 0 0;padding:14px}
  .dp-email-btn{border-radius:0 0 8px 8px;padding:14px;text-align:center;font-size:11px}
  .dp-signup-lg .dp-email-input{padding:14px;font-size:12px}
  .dp-signup-lg .dp-email-btn{padding:14px;font-size:11px}
  .dp-signup-label{font-size:11px;letter-spacing:.10em}
}

/* ── FINAL CTA ──────────────────────── */
.dp-cta{background:transparent;padding:70px 24px 90px;text-align:center;overflow:hidden}
.dp-cta-inner{position:relative;z-index:2;max-width:440px;margin:0 auto}
.dp-cta-head{font-family:'Crimson Pro',serif;font-size:50px;font-weight:300;color:#f0f0f0;line-height:1.02;margin-bottom:30px;letter-spacing:-.01em}
.dp-cta-head em{font-style:italic;font-weight:700;color:var(--amber);text-shadow:0 0 20px rgba(232,169,77,.16),0 0 46px rgba(232,169,77,.07)}
.dp-cta .dp-badge{margin:0 auto 20px}
.dp-cta-sub{font-size:9px;color:var(--muted);letter-spacing:.1em;margin-bottom:28px}
.dp-cta-links{display:flex;justify-content:center;align-items:center;gap:10px;margin-bottom:10px}
.dp-cta-links a{font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:color .15s}
.dp-cta-links a:hover{color:var(--text)}
.dp-cta-links span{font-size:9px;color:rgba(42,74,106,.5)}
.dp-cta-copy{font-size:8px;color:rgba(42,74,106,.7);letter-spacing:.06em}

/* ── COMING SOON / EMAIL SIGNUP ───────────────────────────── */
.hero-avail-soon{color:var(--amber) !important;opacity:.85}
.hero-notify-btn{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--amber);border:1px solid rgba(232,169,77,.35);border-radius:4px;padding:9px 18px;text-decoration:none;margin-bottom:14px;transition:background .15s,border-color .15s,color .15s;background:rgba(232,169,77,.06)}
.hero-notify-btn:hover{background:rgba(232,169,77,.13);border-color:rgba(232,169,77,.6);color:var(--bright)}
.dp-signup{width:100%;max-width:420px;margin:0 auto 18px}
.dp-signup-label{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:10px;text-align:center}
.dp-email-form{display:flex;gap:0;border:1px solid rgba(232,169,77,.3);border-radius:6px;overflow:hidden;background:rgba(10,22,40,.6)}
.dp-email-input{flex:1;background:transparent;border:none;outline:none;padding:12px 14px;font-family:'Space Mono',monospace;font-size:11px;color:var(--bright);letter-spacing:.04em}
.dp-email-input::placeholder{color:var(--muted)}
.dp-email-input:focus{background:rgba(232,169,77,.04)}
.dp-email-btn{flex-shrink:0;background:var(--amber);border:none;padding:12px 18px;font-family:'Space Mono',monospace;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#0a1628;cursor:pointer;transition:background .15s,opacity .15s;white-space:nowrap}
.dp-email-btn:hover{background:#f0b85a}
.dp-email-btn:active{opacity:.85}
.dp-signup-success{display:none;align-items:center;justify-content:center;gap:8px;padding:14px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text);border:1px solid rgba(232,169,77,.2);border-radius:6px;background:rgba(232,169,77,.06)}
.dp-signup-lg .dp-email-form{border-radius:8px}
.dp-signup-lg .dp-email-input{font-size:12px;padding:14px 16px}
.dp-signup-lg .dp-email-btn{font-size:11px;padding:14px 22px}
.dp-signup-lg .dp-signup-label{font-size:11px}

/* ── SKY EVENT CARDS (redesigned) ───────────────────────────── */
.ev-section-lbl{font-size:8px;font-weight:700;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;margin:6px 0 5px;padding-bottom:4px;border-bottom:1px solid rgba(26,48,80,.4)}
.ev-card{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;background:rgba(26,48,80,.3);border:1px solid var(--border);border-radius:4px;margin-bottom:6px}
.ev-icon{font-size:19px;flex-shrink:0;line-height:1.2}
.ev-body{flex:1}
.ev-title{font-size:11px;font-weight:700;color:var(--bright);margin-bottom:2px}
.ev-meta{font-size:9px;color:var(--dim);letter-spacing:.05em;margin-bottom:2px}
.ev-meta span{color:var(--amber)}
.ev-note{font-family:'Crimson Pro',serif;font-size:13px;color:var(--text);font-style:italic;margin-top:2px}
.ev-badge{display:inline-block;padding:2px 7px;border-radius:2px;font-size:8px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-top:4px;margin-right:3px}
.badge-go{background:rgba(77,200,160,.15);color:var(--green);border:1px solid rgba(77,200,160,.3)}
.badge-tbc{background:rgba(232,169,77,.12);color:var(--amber);border:1px solid rgba(232,169,77,.25)}
.badge-hold{background:rgba(232,85,85,.1);color:var(--red);border:1px solid rgba(232,85,85,.2)}
.badge-soon{background:rgba(232,169,77,.18);color:var(--amber);border:1px solid rgba(232,169,77,.4);animation:pulse .8s ease-in-out infinite}
/* PROBLEM STATEMENT */
.dp-problem-stmt{width:100%;padding:52px 48px;text-align:center;opacity:0;transform:translateY(34px);transition:opacity .88s ease .58s,transform .9s cubic-bezier(.25,.46,.45,.94) .58s}
.dp-problem-stmt.visible{opacity:1;transform:none}
.dp-problem-stmt p{font-family:'Crimson Pro',serif;font-size:20px;font-weight:300;color:rgba(175,205,225,.68);line-height:1.74;max-width:520px;margin:0 auto}
/* TRUST SIGNALS */
.dp-trust{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px 4px;padding:4px 32px 36px;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.dp-trust-sep{color:rgba(42,74,106,.45)}
/* VALUE ANCHOR */
.dp-value-anchor{padding:52px 32px 64px;text-align:center;opacity:0;transform:translateY(34px);transition:opacity .88s ease .3s,transform .9s cubic-bezier(.25,.46,.45,.94) .3s}
.dp-value-anchor.visible{opacity:1;transform:none}
.dp-value-eyebrow{font-size:9px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--amber-dim);margin-bottom:18px}
.dp-value-divider{width:28px;height:1px;background:var(--amber);opacity:.5;margin:0 auto 24px}
.dp-value-compare{margin-bottom:32px}
.dp-value-other{font-family:'Crimson Pro',serif;font-size:17px;font-weight:300;color:rgba(175,205,225,.4);line-height:1.6;margin-bottom:4px}
.dp-value-other em{font-style:italic}
.dp-value-price{font-family:'Crimson Pro',serif;font-size:19px;font-weight:400;color:rgba(175,205,225,.82);line-height:1.6}
.dp-value-tagline{font-family:'Crimson Pro',serif;font-size:44px;font-weight:300;line-height:1.02;letter-spacing:-.01em;color:#eff0f0}
.dp-value-tagline em{font-style:italic;font-weight:700;color:var(--amber);text-shadow:0 0 20px rgba(232,169,77,.16),0 0 46px rgba(232,169,77,.07);display:block}