:root{color-scheme:dark;--bg:#080808;--panel:#111;--line:#2a2a2a;--text:#f5f5f5;--muted:#aaa;--good:#b8ffca;--warn:#ffd07a}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}.topbar{height:92px;padding:0 28px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:rgba(8,8,8,.96);z-index:5}.brand{color:#fff;text-decoration:none;font-size:26px;letter-spacing:2px}.brand strong{font-weight:900}.top-actions{display:flex;gap:12px;align-items:center}.shell{max-width:1280px;margin:0 auto;padding:48px 24px 90px}.auth-card{max-width:620px;margin:8vh auto 0;border:1px solid var(--line);border-radius:20px;padding:38px;background:var(--panel)}.eyebrow{letter-spacing:3px;font-size:12px;color:var(--muted);margin-bottom:14px}.auth-card h1,.welcome h1{font-size:42px;line-height:1.05;margin:0 0 18px}.muted{color:var(--muted)}label{display:block;text-transform:uppercase;letter-spacing:1.4px;color:#c2c2c2;font-size:12px;margin:18px 0 8px}input,select,textarea{width:100%;background:#0d0d0d;color:#fff;border:1px solid #3a3a3a;border-radius:10px;padding:14px 15px;font-size:16px}.primary,.ghost{border-radius:10px;padding:14px 18px;font-weight:700;cursor:pointer}.primary{background:#fff;color:#000;border:0}.auth-card .primary{width:100%;margin-top:14px}.ghost{background:transparent;color:#fff;border:1px solid #444}.hidden{display:none!important}.message{margin-top:14px;padding:12px;border:1px solid #555;border-radius:10px;color:#ddd}.tiny{font-size:12px;color:#888;margin-top:16px}.welcome{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:34px}.grid{display:grid;gap:16px}.stats{grid-template-columns:repeat(4,1fr);margin-bottom:26px}.stats article,.panel,.card{border:1px solid var(--line);background:var(--panel);border-radius:16px}.stats article{padding:22px}.stats span{display:block;color:var(--muted);font-size:13px;margin-bottom:9px}.stats strong{font-size:22px}.panel{padding:24px;margin-top:18px}.section-title h2{margin:0 0 16px}.cards{display:grid;gap:12px}.card{padding:18px}.card h3{margin:0 0 7px}.meta{color:var(--muted);font-size:14px;line-height:1.5}.pill{display:inline-block;border:1px solid #555;border-radius:999px;padding:5px 9px;font-size:12px;margin-top:8px}dialog{background:transparent;border:0;padding:0;max-width:680px;width:calc(100% - 32px)}dialog::backdrop{background:rgba(0,0,0,.82)}.dialog-card{background:#111;border:1px solid #333;border-radius:18px;padding:26px}.dialog-head{display:flex;justify-content:space-between;align-items:center}.dialog-head h2{margin:0}.icon-btn{background:none;border:0;color:#fff;font-size:34px;cursor:pointer}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}.dialog-card .primary{width:100%;margin-top:18px}@media(max-width:800px){.topbar{height:72px;padding:0 16px}.brand{font-size:19px}.shell{padding:30px 15px 70px}.welcome{display:block}.welcome .primary{width:100%;margin-top:14px}.stats{grid-template-columns:1fr 1fr}.auth-card{padding:24px}.auth-card h1,.welcome h1{font-size:32px}}@media(max-width:460px){.stats{grid-template-columns:1fr}.two-col{grid-template-columns:1fr}.session-email{display:none}}

.portal-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:22px 0}
.info-list{display:grid;gap:12px;margin-top:18px;line-height:1.55}
.info-list>div{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.info-list>div:last-child{border-bottom:0}
.consent-status{margin-top:18px;display:flex;justify-content:space-between;gap:18px;padding:16px;border:1px solid rgba(255,255,255,.12);border-radius:14px}
.consent-status span{color:#999;font-size:.85rem}
.contact-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.action-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-width:120px}
#bookingDate{width:100%}
@media(max-width:850px){.portal-grid{grid-template-columns:1fr}}

/* v4: Consent + direct studio contact */
.consent-summary{
  margin:18px 0;
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(255,255,255,.02);
  line-height:1.55;
}
.consent-form{
  display:grid;
  gap:12px;
}
.consent-row{
  display:grid;
  grid-template-columns:24px 1fr;
  gap:14px;
  align-items:start;
  padding:15px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
  cursor:pointer;
}
.consent-row input,.confirm-row input{
  width:20px;
  height:20px;
  margin-top:2px;
  accent-color:#fff;
}
.consent-row strong{display:block;margin-bottom:4px}
.consent-row small{
  display:block;
  color:#9d9d9d;
  line-height:1.45;
}
.confirm-row{
  display:grid;
  grid-template-columns:24px 1fr;
  gap:14px;
  align-items:start;
  color:#c8c8c8;
  line-height:1.5;
  margin-top:6px;
}
.consent-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:8px;
}
.studio-contact-number{
  margin:18px 0;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.studio-contact-number span{
  color:#9d9d9d;
  font-size:.85rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.studio-contact-number strong{
  font-size:1.55rem;
}
.contact-actions-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
}
@media(max-width:560px){
  .contact-actions-grid{grid-template-columns:1fr}
  .consent-actions{flex-direction:column}
  .consent-actions button{width:100%}
}

/* v5 booking flow */
.booking-dialog{
  width:min(760px,calc(100vw - 24px));
  max-width:760px;
  max-height:92dvh;
  padding:0;
  border:0;
  background:transparent;
}
.booking-dialog::backdrop{background:rgba(0,0,0,.76);backdrop-filter:blur(4px)}
.booking-card{
  max-height:92dvh;
  overflow:auto;
  overscroll-behavior:contain;
}
.booking-progress{
  display:flex;
  align-items:center;
  gap:10px;
  margin:8px 0 26px;
}
.progress-step{
  border:0;
  background:none;
  color:#767676;
  padding:0;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  cursor:default;
}
.progress-step span{
  width:28px;height:28px;border-radius:50%;
  border:1px solid #444;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.85rem;
}
.progress-step.active{color:#fff}
.progress-step.active span{background:#fff;color:#000;border-color:#fff}
.progress-line{height:1px;background:#333;flex:1}
.booking-step{display:none}
.booking-step.active{display:block}
.input-suffix{position:relative}
.input-suffix input{padding-right:54px}
.input-suffix span{
  position:absolute;right:18px;top:50%;transform:translateY(-50%);
  color:#888
}
.booking-check{margin:8px 0 18px}
.price-estimate{
  display:grid;
  gap:8px;
  margin:18px 0 6px;
  padding:18px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));
}
.price-estimate strong{
  display:block;
  font-size:1.65rem;
  margin-top:4px;
}
.price-estimate small{color:#999;line-height:1.45}
.dialog-actions{display:flex;gap:12px;margin-top:22px}
.sticky-actions{
  position:sticky;
  bottom:0;
  padding:16px 0 2px;
  background:linear-gradient(to top,#111 75%,rgba(17,17,17,0));
  z-index:3;
}
.sticky-actions .primary{width:100%}
.back-link{
  border:0;background:none;color:#aaa;padding:0 0 18px;cursor:pointer
}
.booking-review{
  margin-top:18px;
  padding:16px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  display:grid;
  gap:8px;
  color:#cfcfcf;
}
.request-card-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:16px
}
@media(max-width:600px){
  .booking-dialog{width:100vw;max-height:100dvh;margin:0}
  .booking-card{max-height:100dvh;border-radius:0}
  .two-col{grid-template-columns:1fr}
}

/* v6 client profile */
.profile-panel{margin-top:22px}
.profile-title-row{align-items:flex-start}
.profile-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:18px;
}
.profile-item{
  padding:16px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:14px;
  background:rgba(255,255,255,.015);
  min-width:0;
}
.profile-item span{
  display:block;
  color:#8e8e8e;
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:7px;
}
.profile-item strong{
  display:block;
  font-size:1rem;
  overflow-wrap:anywhere;
}
.profile-form{
  display:grid;
  gap:16px;
  margin-top:20px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.08);
}
.profile-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.profile-actions .primary,.profile-actions .ghost{
  min-width:170px;
}
@media(max-width:900px){
  .profile-summary{grid-template-columns:1fr 1fr}
}
@media(max-width:580px){
  .profile-summary{grid-template-columns:1fr}
  .profile-actions{flex-direction:column}
  .profile-actions button{width:100%}
}

/* v7 compact consent */
.consent-summary{margin:16px 0 12px;padding:16px 18px}
.consent-summary-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.consent-chips{display:flex;flex-wrap:wrap;gap:8px}
.consent-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;font-size:.78rem;line-height:1;border:1px solid rgba(255,255,255,.12)}
.consent-chip.on{background:rgba(255,255,255,.08);color:#fff}
.consent-chip.off{color:#777;background:rgba(255,255,255,.015)}
.consent-edit-toggle{margin-top:4px;padding:10px 14px}
.consent-form{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
.consent-row{padding:11px 0;min-height:auto}
.consent-row strong{margin:0}
@media(max-width:560px){
  .consent-summary-head{align-items:flex-start;flex-direction:column;gap:6px}
  .consent-chip{font-size:.74rem}
}


/* LIVE UPDATE V8 — onboarding, marketing consent, calendar */
.marketing-consent-box{
  margin-top:6px;
  padding:16px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  background:rgba(255,255,255,.018);
}
.marketing-consent-box .confirm-row{margin:0}
.marketing-consent-box small{color:#aaa;line-height:1.45}
.calendar-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.calendar-actions .action-link{
  min-width:170px;
}
#registerView{max-width:650px}
@media(max-width:560px){
  .calendar-actions{flex-direction:column}
  .calendar-actions .action-link{width:100%}
}

.reference-prompt-box{margin:16px 0;padding:16px;border:1px dashed rgba(255,255,255,.16);border-radius:14px;background:rgba(255,255,255,.015)}
#retouchFields{margin:14px 0;padding:16px;border:1px solid rgba(255,255,255,.10);border-radius:14px}

/* v10 booking uploads */
.booking-upload-box{
  margin:16px 0;
  padding:16px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(255,255,255,.015);
}
.booking-upload-box input[type=file]{
  width:100%;
  padding:13px;
  border:1px dashed rgba(255,255,255,.20);
  border-radius:12px;
  background:#090909;
  color:#d7d7d7;
}
.booking-photo-preview{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.booking-photo-thumb{
  position:relative;
  aspect-ratio:1/1;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:#080808;
}
.booking-photo-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.booking-photo-thumb button{
  position:absolute;right:5px;top:5px;
  width:28px;height:28px;border:0;border-radius:50%;
  background:rgba(0,0,0,.72);color:#fff;font-size:18px;cursor:pointer;
}
.booking-photo-thumb span{
  position:absolute;left:0;right:0;bottom:0;
  padding:6px;background:rgba(0,0,0,.72);
  font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
@media(max-width:650px){
  .booking-photo-preview{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* v11 flow clarity */
#projectDescriptionWrap.hidden{display:none!important}

/* v12 proposal approval */
.client-proposal-box{
  margin-top:16px;padding:16px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;background:rgba(255,255,255,.025)
}
.client-proposal-box strong{font-size:22px}
.client-proposal-box p{color:#aaa;line-height:1.45}
.proposal-actions{display:flex;gap:10px;margin-top:14px}
@media(max-width:560px){.proposal-actions{flex-direction:column}}

/* v13 confirmed appointment calendar */
.appointment-actions{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.appointment-actions button{min-height:42px}

/* v14 self-registration choice */
.auth-mode-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;margin:26px 0 22px;border:1px solid #333;border-radius:14px;background:#0a0a0a}
.auth-mode-tabs .auth-mode{padding:12px 10px;min-height:45px;border:0;border-radius:10px;background:transparent;color:#aaa;font-size:14px;font-weight:600;cursor:pointer}
.auth-mode-tabs .auth-mode.active{background:#f7f7f7;color:#080808}
.auth-mode-tabs .auth-mode:focus-visible{outline:2px solid #aac7ff;outline-offset:3px}
#loginForm button:disabled,#registerForm button:disabled,#passwordResetForm button:disabled,.auth-text-button:disabled{opacity:.6;cursor:wait}
.auth-card .tiny a{text-decoration:underline;text-underline-offset:3px;color:#ddd}
@media(max-width:480px){.auth-mode-tabs .auth-mode{font-size:13px;padding:11px 7px}}
.auth-text-button{display:block;margin:16px auto 4px;padding:8px 4px;border:0;background:transparent;color:#f1f1f1;font:inherit;font-size:14px;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.auth-text-button:hover{color:#fff}
.auth-text-button:focus-visible{outline:2px solid #aac7ff;outline-offset:4px;border-radius:4px}
.password-guidance{margin:12px 0 0;color:#929292;font-size:12px;line-height:1.5}
.message[data-type="error"]{border-color:#8b4037;background:rgba(139,64,55,.16);color:#ffd6cf}
.message[data-type="ok"]{border-color:#3d654c;background:rgba(61,101,76,.14);color:#e8fff0}
.analytics-consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:9999;display:none;max-width:920px;margin:0 auto;padding:18px 20px;gap:20px;align-items:center;justify-content:space-between;background:#111;color:#f4f4f4;border:1px solid #3a3a3a;box-shadow:0 18px 55px rgba(0,0,0,.55)}
.analytics-consent.is-visible{display:flex}.analytics-consent strong{display:block;margin-bottom:5px}.analytics-consent p{margin:0;max-width:660px;color:#bcbcbc;font-size:13px;line-height:1.45}.analytics-consent-actions{display:flex;gap:8px;flex:0 0 auto}.analytics-consent-actions button{margin:0;white-space:nowrap}
@media(max-width:680px){.analytics-consent{display:none;align-items:stretch}.analytics-consent.is-visible{display:block}.analytics-consent-actions{margin-top:14px}.analytics-consent-actions button{flex:1}}

.portal-legal-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  max-width:1180px;
  margin:26px auto 0;
  padding:24px;
  border-top:1px solid #2e2e2e;
  color:#8f8f8f;
  font-size:13px;
}
.portal-legal-footer strong{display:block;margin-bottom:4px;color:#f2f2f2;font-size:14px}
.portal-legal-footer span{display:block}
.portal-legal-footer nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:9px}
.portal-legal-footer a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;border:1px solid #3d3d3d;color:#f2f2f2;text-decoration:none;text-align:center}
.portal-legal-footer a:first-child{border-color:#f2f2f2;background:#f2f2f2;color:#090909;font-weight:700}
.portal-legal-footer a:focus-visible{outline:2px solid #aac7ff;outline-offset:3px}
@media(max-width:700px){.portal-legal-footer{align-items:stretch;flex-direction:column;padding:22px 18px}.portal-legal-footer nav{display:grid;grid-template-columns:1fr}.portal-legal-footer a{width:100%}}