/* Purpose-built mobile application shell */
.auth-mobile-logo,.mobile-setup-nav,.mobile-setup-tabs{display:none}
.mobile-setup-blocker{min-height:100svh;box-sizing:border-box;padding:calc(28px + env(safe-area-inset-top)) 18px calc(28px + env(safe-area-inset-bottom));place-items:center;background:#f4f2ed}.mobile-setup-blocker-card{box-sizing:border-box;width:min(480px,100%);padding:28px 24px;border:1px solid #dfe4e3;border-radius:18px;background:#fff;text-align:center;box-shadow:0 18px 50px rgba(23,39,49,.1)}.mobile-setup-blocker-card img{display:block;width:min(250px,80%);height:auto;margin:0 auto 30px}.mobile-setup-blocker-card h1{margin:0 0 18px;color:#1c2730;font:400 34px/1.12 Georgia,serif;letter-spacing:-1px}.mobile-setup-blocker-card>p:not(.kicker){margin:0 auto 16px;color:#647178;font-size:15px;line-height:1.65}.mobile-setup-blocker-card .primary{width:100%;min-height:48px;margin-top:10px;background:#2f7657;border-color:#2f7657}.mobile-setup-email-status{font-size:13px!important}

@media(max-width:820px){
  .mobile-setup-blocker:not([hidden]){display:grid}
  :root{--mobile-header:64px;--mobile-nav:78px}
  html{background:#f5f7f6}
  body{min-width:320px;background:#f5f7f6!important}
  body.is-busy{overflow:hidden}

  .studio-shell{min-height:100svh;padding:var(--mobile-header) 0 calc(var(--mobile-nav) + env(safe-area-inset-bottom));background:#f5f7f6!important}
  .workspace{min-height:calc(100svh - var(--mobile-header) - var(--mobile-nav))}
  .topbar{inset:0 0 auto;height:var(--mobile-header);padding:0 16px;padding-top:env(safe-area-inset-top);border-bottom:1px solid #e6ebea;background:rgba(255,255,255,.97);box-shadow:0 4px 18px rgba(23,39,49,.05);backdrop-filter:blur(14px);z-index:30}
  .mobile-brand{min-width:0;margin-right:auto;display:flex;align-items:center;gap:8px;color:#19303a;font:600 18px Georgia,serif}
  .mobile-brand img{width:34px;height:34px;object-fit:contain}
  .top-actions{gap:7px;margin-left:auto;padding:0;border:0}
  .top-actions .ghost{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:9px 11px;border:1px solid #dce3e2;border-radius:10px;background:#fff;color:#425660;font-size:9px;font-weight:700}
  .top-actions .logout-action{min-height:38px;padding:9px 11px;border-radius:10px;font-size:9px}
  .top-actions .admin-link{min-height:38px;padding:9px 10px;border-radius:10px;font-size:0}
  .top-actions .admin-link::after{content:"Admin";font-size:9px}
  .save-status,.current-view{display:none}
  .help{display:inline-grid;place-items:center;flex:0 0 34px;width:34px;height:34px}

  .sidebar{box-sizing:border-box;inset:auto 0 0;width:100%;height:calc(var(--mobile-nav) + env(safe-area-inset-bottom));padding:0 8px env(safe-area-inset-bottom);border:0;border-top:1px solid rgba(255,255,255,.1);background:rgba(23,39,49,.98);box-shadow:0 -8px 30px rgba(13,26,34,.16);backdrop-filter:blur(18px);overflow:hidden;z-index:40}
  .sidebar>div:first-child,.sidebar-bottom,.nav-section-label{display:none}
  .step-nav{box-sizing:border-box;width:100%;height:var(--mobile-nav);margin:0;display:flex;align-items:stretch;gap:2px;overflow:hidden;scrollbar-width:none}
  .step-nav::-webkit-scrollbar{display:none}
  .setup-nav-items{display:none!important}
  .mobile-setup-nav{flex:1 1 0;min-width:0;min-height:var(--mobile-nav);padding:8px 5px 7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:0;border-radius:0;background:transparent;color:#8fa2ac;text-align:center;cursor:pointer}
  .mobile-setup-nav.active{background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.025));color:#fff;box-shadow:inset 0 3px 0 #85d4ae}
  .mobile-setup-nav>span:last-child{font-size:9px;font-weight:700;line-height:1.15;letter-spacing:.25px}
  .mobile-setup-nav.active .step-number{background:#dce8e4;border-color:#dce8e4;color:#18302a}
  .step-link{flex:1 1 0;min-width:0;min-height:var(--mobile-nav);padding:8px 5px 7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:0;background:transparent;color:#8fa2ac;text-align:center;transform:none}
  .step-link:hover{background:transparent;transform:none}
  .step-link.active{background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.025));color:#fff;box-shadow:inset 0 3px 0 #85d4ae}
  .step-link.done{color:#a8bbc3}
  .step-link:disabled{opacity:.3}
  .step-link span:last-child{display:block;max-width:72px;overflow:hidden;font-size:9px;font-weight:700;line-height:1.15;letter-spacing:.25px;text-overflow:ellipsis;white-space:nowrap}
  .step-number{width:25px;height:25px;flex:0 0 25px;border-color:#526570;font-size:9px}
  .step-link.active .step-number{background:#dce8e4;border-color:#dce8e4;color:#18302a}
  .step-link.done .step-number{box-shadow:none}
  .home-link{margin:0;padding-bottom:7px;border:0}

  .content{min-height:auto;padding:30px 20px 42px;display:block;background:#f5f7f6}
  .panel,.intro-panel,.form-panel,.home-panel,.review-layout{width:100%;max-width:none}
  .mobile-setup-tabs{margin:0 0 25px;padding:4px;display:grid;grid-template-columns:1fr 1fr;gap:4px;border-radius:12px;background:#e7ecea}
  .mobile-setup-tabs button{min-height:44px;padding:10px;border:0;border-radius:9px;background:transparent;color:#6a787e;font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;cursor:pointer}
  .mobile-setup-tabs button.active{background:#fff;color:#1d3039;box-shadow:0 2px 9px rgba(23,39,49,.09)}
  .kicker{margin-bottom:10px;font-size:9px;letter-spacing:1.6px}
  .panel h1,.review-copy h1{margin-bottom:14px;font-size:clamp(31px,9vw,40px);line-height:1.04;letter-spacing:-1.35px}
  .lede{max-width:none;margin-bottom:27px;font-size:14px;line-height:1.58}

  [data-panel="connect"]{box-sizing:border-box;min-width:0;max-width:100%;overflow-x:clip}
  .connection-flow{box-sizing:border-box;width:100%;max-width:100%;margin-bottom:22px;padding:16px;border-radius:16px;background:#fff;box-shadow:0 8px 26px rgba(23,39,49,.045)}
  .flow-node{box-sizing:border-box;width:100%;min-width:0;max-width:100%;min-height:66px;padding:13px;border-radius:12px}
  .flow-node>span:last-child{min-width:0;overflow-wrap:anywhere}
  .connection-list{box-sizing:border-box;width:100%;min-width:0;max-width:100%;gap:14px}
  .connection-card{box-sizing:border-box;width:100%;min-width:0;max-width:100%;grid-template-columns:48px minmax(0,1fr);gap:14px;padding:18px;border-radius:15px;box-shadow:0 8px 25px rgba(23,39,49,.045)}
  .connection-card>*{min-width:0;max-width:100%}
  .connection-card:hover{transform:none}
  .app-icon{width:48px;height:48px;border-radius:12px}
  .connection-title{min-width:0;display:block;overflow-wrap:anywhere}
  .connection-title h3{font-size:16px}
  .connection-title span{display:block;margin-top:4px}
  .connection-card p{font-size:12px;line-height:1.55}
  .connection-card>.connected,.connection-card>button,.shop-connect,.connection-controls{box-sizing:border-box;grid-column:1/-1;width:100%;min-width:0;max-width:100%}
  .connection-card>.connected,.connection-card>button{justify-self:stretch}
  .connection-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .connection-controls .connected,.connection-controls .disconnect{box-sizing:border-box;min-width:0;justify-content:center}
  .shop-connect{display:grid;grid-template-columns:1fr;gap:10px}
  .shop-connect input{box-sizing:border-box;width:100%;min-height:50px;padding:12px 14px;border-radius:10px;font-size:16px}
  .shop-connect .outline{box-sizing:border-box;width:100%}
  .connection-error,.tip,[data-panel="connect"] .panel-actions{box-sizing:border-box;width:100%;max-width:100%}
  .tip{align-items:flex-start;margin:18px 0 24px;padding:14px;border-radius:12px}
  .tip p{min-width:0;overflow-wrap:anywhere}

  .form-grid{grid-template-columns:1fr;gap:18px;margin-bottom:26px}
  .form-grid .wide{grid-column:auto}
  .form-grid input,.form-grid select,.form-grid textarea,.subject-block input{box-sizing:border-box;width:100%;min-height:52px;border-radius:11px;font-size:16px}
  #brief-form .form-grid input,#brief-form .form-grid select{height:52px}
  #brand-form .form-grid input,#brand-form .form-grid select{height:52px}
  .form-grid textarea{min-height:116px}
  .voice-spectrum{grid-template-columns:auto minmax(80px,1fr) auto;padding:18px 14px}
  .brand-analysis{grid-template-columns:42px minmax(0,1fr);margin:0 0 22px;padding:16px;border-radius:13px}
  .brand-analysis .reanalyze{grid-column:1/-1;width:100%;margin:4px 0 0;justify-self:stretch}
  .behaviour-cues{padding:18px;border-radius:15px}
  .cue-options{grid-template-columns:1fr;gap:12px}
  .cue-option,.cue-option.has-detail{display:grid;grid-template-columns:minmax(0,1fr) 25px;align-items:start;padding:16px;border-radius:12px}
  .cue-info{justify-self:end;margin-left:auto}
  .cue-option strong{font-size:13px}
  .cue-option small{font-size:11px}
  .scarcity-quantity input{font-size:16px}
  #generation-error:not(:empty){position:fixed;left:16px;right:16px;bottom:calc(var(--mobile-nav) + env(safe-area-inset-bottom) + 12px);z-index:50;width:auto;max-width:560px;margin:0 auto;padding:14px 16px;border:1px solid #cce0d2;border-left:4px solid #79a685;border-radius:12px;background:#edf7ef;box-shadow:0 10px 32px rgba(23,39,49,.2);color:#315f3d;font-size:13px;line-height:1.45}
  #generation-error.status-warning:not(:empty){border-color:#ead58f;border-left-color:#c79b2e;background:#fff4cc;color:#6f5515}
  #generation-error.status-error:not(:empty){border-color:#e4c3bf;border-left-color:#b45f55;background:#f8e9e7;color:#803f38}
  .panel-actions{gap:10px;align-items:stretch;flex-wrap:wrap}
  .panel-actions>span{display:none}
  .panel-actions .primary{order:1;flex:1 0 100%;width:100%}
  .panel-actions .back{order:2;width:100%}

  .brief-product{grid-template-columns:68px minmax(0,1fr);gap:13px;padding:15px;border-radius:14px}
  .brief-product-image{width:68px;height:68px}
  .brief-product .outline{grid-column:1/-1;width:100%}
  .catalog-toolbar{position:sticky;top:calc(var(--mobile-header) + 8px);z-index:12;margin-bottom:18px;padding:14px;display:grid;grid-template-columns:1fr;gap:11px;border-radius:14px}
  .catalog-toolbar .search{grid-column:auto;width:100%;min-height:48px}
  .catalog-toolbar .search input{font-size:16px}
  .catalog-toolbar>span{text-align:center}
  .catalog-toolbar .top-generate{width:100%;min-width:0;margin:0}
  .product-grid{grid-template-columns:1fr;gap:16px}
  .product-card{grid-template-rows:min(70vw,300px) minmax(112px,auto);border-radius:15px}
  .product-art{height:100%}
  .product-info{padding:17px}
  .product-info strong{font-size:15px}
  .product-info small{min-height:0;font-size:11px}

  .review-layout{display:grid;grid-template-columns:1fr;gap:30px}
  .review-copy{position:static}
  .review-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .review-actions button,.review-actions a{box-sizing:border-box;width:100%}
  .email-stage{box-sizing:border-box;width:100%;min-width:0;margin:0 auto;padding:8px;border-radius:14px}
  .email-window{width:100%;max-width:100%;margin:0 auto;border-radius:9px}

  .account-backdrop{align-items:end;padding:0}
  .account-dialog{width:100%;max-height:94svh;padding:26px 20px calc(24px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0}
  .account-dialog-header h2{font-size:30px}
  .account-form,.password-form{grid-template-columns:1fr}
  .password-form label:first-child{grid-column:auto}
  .account-form input,.account-form select,.password-form input{box-sizing:border-box;width:100%;height:52px;font-size:16px}
  .account-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .account-actions .primary{order:1}
  .account-actions .back{order:2}
  .account-actions button,.password-actions .outline{width:100%}

  .auth-shell{min-height:100svh;display:block;background:#f5f7f6}
  .auth-brand{display:none}
  .auth-panel{box-sizing:border-box;width:100%;min-height:100svh;margin:0;padding:42px 22px 36px;display:flex;flex-direction:column;justify-content:flex-start}
  .auth-mobile-logo{display:block;align-self:center;width:260px;max-width:78vw;height:auto;margin:0 0 42px}
  .auth-panel>.kicker,.auth-panel>h1{text-align:center}
  .auth-panel h1{margin-bottom:13px;font-size:clamp(39px,12vw,52px);letter-spacing:-1.7px}
  .auth-panel>.lede{margin-bottom:0;font-size:14px}
  .auth-tabs{margin:28px 0 22px;padding:4px;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;border:0;border-radius:12px;background:#e9edeb}
  .auth-tabs button{min-height:42px;padding:8px 5px;border:0!important;border-radius:9px;font-size:9px;letter-spacing:.35px}
  .auth-tabs button.active{background:#fff;box-shadow:0 2px 9px rgba(23,39,49,.08)}
  .auth-form{gap:18px}
  .auth-form input{box-sizing:border-box;width:100%;height:54px;padding:12px 14px;border-radius:11px;font-size:16px}
  .auth-actions{display:grid;grid-template-columns:1fr;gap:12px}
  .auth-form .primary{width:100%;justify-self:stretch}
  .auth-link{justify-self:center;min-height:40px}
}

@media(max-width:380px){
  .top-actions .admin-link{display:none}
  .top-actions .ghost,.top-actions .logout-action{padding-inline:9px}
  .content{padding-inline:16px}
  .step-link,.mobile-setup-nav{flex:1 1 0;min-width:0}
}
