*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
:root{
  --gold:#3a3a3a;--gold-light:#ffffff;--gold-accent:#C9A96E;--dark:#121212;--dark2:#1e1e1e;
  --cream:#fafafa;--text:#171717;--text2:#6b6b6b;--text3:#9e9e9e;
  --green:#2D6A4F;--green-light:#D8F3DC;--red:#9B2335;--red-light:#FDECEA;
  --amber:#B07820;--amber-light:#FDF0D8;
  --safe-top:env(safe-area-inset-top,0px);--safe-bot:env(safe-area-inset-bottom,0px);
}
html,body{height:100%;background:var(--dark);font-family:'DM Sans',sans-serif;color:var(--text)}
#login-screen{min-height:100vh;background:var(--dark);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}
.logo-mark{width:56px;height:56px;border-radius:50%;border:1.5px solid var(--gold-light);display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem}
.logo-mark svg{width:28px;height:28px;fill:none;stroke:var(--gold-light);stroke-width:1.5}
.studio-name{font-family:'DM Sans',sans-serif;font-weight:800;font-size:28px;color:var(--gold-light);letter-spacing:.04em;text-transform:uppercase;margin-bottom:.25rem}
.studio-sub{font-size:12px;font-weight:600;color:var(--text3);letter-spacing:.25em;text-transform:uppercase;margin-bottom:3rem}
.login-label{font-size:12px;color:var(--text3);letter-spacing:.12em;text-transform:uppercase;margin-bottom:.75rem}
.pin-row{display:flex;gap:10px;justify-content:center;margin-bottom:1.5rem}
.pin-digit{width:46px;height:58px;background:var(--dark2);border:1px solid rgba(255,255,255,.15);border-radius:10px;font-size:24px;font-weight:500;text-align:center;color:var(--gold-light);outline:none;transition:border-color .2s;caret-color:var(--gold-light)}
.pin-digit:focus{border-color:var(--gold-light)}
.login-btn{width:100%;max-width:260px;padding:14px;background:var(--gold-light);color:var(--dark);border:none;border-radius:12px;font-size:15px;font-weight:500;font-family:'DM Sans',sans-serif;cursor:pointer;letter-spacing:.03em;transition:opacity .2s}
.login-btn:hover{opacity:.88}
.login-err{color:#E07070;font-size:13px;margin-top:.75rem;min-height:20px}
#app{display:none;min-height:100vh;background:var(--cream)}
.app-header{background:var(--dark);padding:calc(var(--safe-top) + 1rem) 1.25rem 1rem;position:sticky;top:0;z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between}
.header-logo{font-family:'DM Sans',sans-serif;font-weight:800;font-size:15px;color:var(--gold-light);letter-spacing:.04em;text-transform:uppercase}
.logout-btn{background:none;border:none;color:var(--text3);font-size:12px;cursor:pointer;padding:4px 8px}
.hero{background:var(--dark);padding:0 1.25rem 2rem;text-align:center}
.couple-names{font-family:'DM Sans',sans-serif;font-weight:800;font-size:30px;color:var(--cream);letter-spacing:.02em;text-transform:uppercase;margin-bottom:.25rem}
.event-date-display{font-size:13px;color:var(--gold-accent);letter-spacing:.1em;text-transform:uppercase;margin-bottom:1.5rem}
.countdown-ring{display:inline-flex;flex-direction:column;align-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:1rem 2rem;margin-bottom:1.5rem}
.countdown-n{font-size:42px;font-weight:800;color:var(--gold-accent);font-family:'DM Sans',sans-serif;line-height:1}
.countdown-l{font-size:11px;color:var(--text3);letter-spacing:.12em;text-transform:uppercase;margin-top:4px}
.prog-section{padding:1.25rem;background:var(--dark);border-top:1px solid rgba(255,255,255,.08)}
.prog-label-row{display:flex;justify-content:space-between;margin-bottom:.5rem}
.prog-label{font-size:12px;color:var(--text3);letter-spacing:.08em;text-transform:uppercase}
.prog-pct{font-size:12px;color:var(--gold-light);font-weight:500}
.prog-track{height:3px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden}
.prog-fill{height:100%;background:linear-gradient(90deg,var(--gold-accent),var(--cream));border-radius:2px;transition:width .6s ease}
.content{padding:1.25rem;display:flex;flex-direction:column;gap:1rem}
.section-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.section-head{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid #e5e5e5;cursor:pointer}
.section-head-left{display:flex;align-items:center;gap:10px}
.section-icon{width:34px;height:34px;border-radius:10px;background:#fafafa;display:flex;align-items:center;justify-content:center;font-size:16px}
.section-htitle{font-size:14px;font-weight:500;color:var(--text)}
.section-sub{font-size:12px;color:var(--text2);margin-top:2px}
.section-body{padding:1rem 1.25rem}
.next-banner{background:linear-gradient(135deg,#ededed,#fafafa);border-radius:14px;padding:1rem 1.25rem;border-left:3px solid var(--gold)}
.next-eye{font-size:10px;color:var(--gold);letter-spacing:.15em;text-transform:uppercase;margin-bottom:.3rem}
.next-label{font-size:14px;font-weight:500;color:var(--text)}
.next-date{font-size:12px;color:var(--text2);margin-top:.25rem}
.install-banner{background:var(--dark2);border-radius:14px;padding:1rem 1.25rem;display:flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.12)}
.install-icon{font-size:24px;flex-shrink:0}
.install-text{flex:1}
.install-title{font-size:13px;font-weight:500;color:var(--cream)}
.install-sub{font-size:12px;color:var(--text3);margin-top:2px}
.install-btn{padding:7px 14px;background:var(--gold-light);color:var(--dark);border:none;border-radius:8px;font-size:12px;font-weight:500;cursor:pointer;white-space:nowrap}
.event-row{padding:10px 0;border-bottom:1px solid #e5e5e5;display:flex;align-items:flex-start;gap:10px}
.event-row:last-child{border-bottom:none}
.event-dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex-shrink:0;margin-top:5px}
.event-name{font-size:13px;font-weight:500;color:var(--text)}
.event-detail{font-size:12px;color:var(--text2);margin-top:2px}
.event-time-input{font-size:13px;border:1px solid #e0e0e0;border-radius:8px;padding:5px 9px;color:var(--text);background:#fafafa;outline:none;margin-top:4px;width:130px}
.gold-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;background:var(--dark);color:var(--gold-light);border:none;border-radius:10px;font-size:13px;font-weight:500;font-family:'DM Sans',sans-serif;cursor:pointer;text-decoration:none;transition:opacity .2s;width:100%;justify-content:center}
.gold-btn:hover{opacity:.88}
.outline-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;background:transparent;color:var(--text);border:1.5px solid #d4d4d4;border-radius:10px;font-size:13px;font-weight:500;font-family:'DM Sans',sans-serif;cursor:pointer;width:100%;justify-content:center;text-decoration:none;margin-top:8px}
.outline-btn:hover{background:#f0f0f0}
.deliv-category{margin-bottom:1rem}
.deliv-cat-label{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.12em;margin-bottom:.5rem;display:flex;align-items:center;gap:6px}
.deliv-cat-label::after{content:'';flex:1;height:1px;background:#e5e5e5}
.deliv-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid #f7f7f7}
.deliv-row:last-child{border-bottom:none}
.deliv-icon{font-size:16px;flex-shrink:0;width:22px;text-align:center}
.deliv-text{flex:1;font-size:13px;color:var(--text)}
.deliv-days{font-size:11px;font-weight:500;white-space:nowrap;padding:2px 8px;border-radius:20px}
.d-ok{background:var(--green-light);color:var(--green)}
.d-warn{background:var(--amber-light);color:var(--amber)}
.d-done{background:#e5e5e5;color:var(--text3)}
.d-over{background:var(--red-light);color:var(--red)}
.timeline-row{display:flex;align-items:flex-start;gap:10px;padding:6px 0}
.t-dot{width:18px;height:18px;border-radius:50%;flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center;font-size:10px}
.t-dot.done{background:var(--green-light);color:var(--green)}
.t-dot.pending{background:#e5e5e5;color:var(--text3)}
.t-dot.overdue{background:var(--red-light);color:var(--red)}
.t-text{font-size:13px;color:var(--text);line-height:1.5;flex:1}
.t-text.done{text-decoration:line-through;color:var(--text3)}
.t-date{font-size:10px;color:var(--text3);white-space:nowrap;padding-top:2px}
.phase-group{margin-bottom:1rem}
.phase-lbl{font-size:10px;font-weight:500;color:var(--text3);letter-spacing:.12em;text-transform:uppercase;padding:0 0 .5rem;display:flex;align-items:center;gap:6px}
.phase-lbl::after{content:'';flex:1;height:1px;background:#e5e5e5}
.song-input-row{display:flex;gap:8px;margin-top:8px}
.song-inp{flex:1;padding:9px 12px;border:1px solid #e0e0e0;border-radius:10px;font-size:13px;color:var(--text);background:#fafafa;outline:none}
.song-inp:focus{border-color:var(--gold);background:#fff}
.song-save{padding:9px 16px;background:var(--dark);color:var(--gold-light);border:none;border-radius:10px;font-size:13px;font-weight:500;cursor:pointer}
.album-btns{display:flex;gap:8px;flex-direction:column}
.album-status-chip{font-size:12px;padding:5px 12px;border-radius:20px;font-weight:500;background:var(--green-light);color:var(--green);display:inline-block;margin-bottom:.5rem}
.payment-row{padding:10px 0;border-bottom:1px solid #e5e5e5;display:flex;align-items:center;justify-content:space-between}
.payment-row:last-child{border-bottom:none}
.payment-label{font-size:13px;color:var(--text)}
.payment-amount{font-size:13px;font-weight:600;color:var(--text)}
.payment-status{font-size:11px;padding:2px 8px;border-radius:20px}
.paid-yes{background:var(--green-light);color:var(--green)}
.paid-no{background:#e5e5e5;color:var(--text3)}
.team-member-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid #e5e5e5}
.team-member-row:last-child{border-bottom:none}
.team-avatar{width:32px;height:32px;border-radius:50%;background:var(--gold-light);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--dark)}
.team-role-tag{font-size:10px;padding:2px 8px;border-radius:20px;background:#e5e5e5;color:var(--text3)}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:100;display:flex;align-items:flex-end;justify-content:center}
.sheet{background:#fff;border-radius:20px 20px 0 0;padding:1.5rem;width:100%;max-width:480px;max-height:80vh;overflow-y:auto}
.sheet-title{font-size:16px;font-weight:600;color:var(--text);margin-bottom:1rem}
.sheet-input{width:100%;padding:10px 12px;border:1px solid #e0e0e0;border-radius:10px;font-size:14px;color:var(--text);outline:none;background:#fafafa;margin-bottom:10px}
.sheet-input:focus{border-color:var(--gold);background:#fff}

.deliv-item{margin-bottom:.5rem;}
.deliv-due-date{font-size:11px;color:var(--text3);padding-left:1.75rem;margin-top:.2rem;font-style:italic;}

.event-dot.done{background:var(--gold);border-color:var(--gold);}
.event-done-badge{font-size:10px;background:#1a3a1a;color:#4caf50;border:1px solid #4caf50;border-radius:20px;padding:1px 8px;margin-left:8px;vertical-align:middle;}
.review-btn{display:inline-block;margin-top:6px;font-size:11px;color:var(--gold);border:1px solid var(--gold);border-radius:20px;padding:3px 12px;text-decoration:none;}