:root{
    --ink:#161A22;
    --paper:#F4EFE6;
    --cream:#FFFCF7;
    --brass:#C9A227;
    --teal:#3A7D6E;
    --rust:#C75B4A;
    --muted:#6D6C68;
    --line:rgba(22,26,34,0.14);
    --shadow:0 22px 60px -24px rgba(22,26,34,0.35);
    --display:'Fraunces',serif;
    --body:'IBM Plex Sans',sans-serif;
    --mono:'JetBrains Mono',monospace;
  }

  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    min-height:100vh;
    background:var(--paper);
    color:var(--ink);
    font-family:var(--body);
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
  }
  body.modal-open{overflow:hidden}
  button,input,select{font:inherit}
  button{color:inherit}
  a{color:inherit}
  [hidden]{display:none!important}
  .wrap{max-width:1080px;margin:0 auto;padding:0 24px}

  /* Navigation */
  nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:24px;
    padding:22px 24px;
    border-bottom:1px solid var(--line);
  }
  .logo{
    border:0;
    background:transparent;
    font-family:var(--display);
    font-weight:900;
    font-size:24px;
    letter-spacing:.02em;
    cursor:pointer;
  }
  .logo span{color:var(--brass)}
  .nav-links{display:flex;gap:28px;font-size:15px;font-weight:500}
  .nav-links a{text-decoration:none;opacity:.75;transition:opacity .15s}
  .nav-links a:hover{opacity:1}
  .auth-actions{display:flex;align-items:center;gap:10px}
  .nav-button{
    border:1.5px solid var(--ink);
    background:transparent;
    padding:9px 16px;
    border-radius:5px;
    font-weight:600;
    font-size:14px;
    cursor:pointer;
    transition:background .15s,color .15s;
  }
  .nav-button:hover{background:var(--ink);color:var(--paper)}
  .nav-cta{
    border:1.5px solid var(--ink);
    background:var(--ink);
    color:var(--paper);
    padding:9px 17px;
    border-radius:5px;
    font-weight:600;
    font-size:14px;
    cursor:pointer;
  }
  .user-chip{
    display:flex;
    align-items:center;
    gap:9px;
    min-width:0;
    font-size:13px;
    font-weight:600;
  }
  .user-avatar{
    display:grid;
    place-items:center;
    width:32px;
    height:32px;
    flex:0 0 auto;
    border-radius:50%;
    background:var(--brass);
    font-family:var(--mono);
    font-weight:700;
  }
  .user-email{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  /* Hero */
  .hero{padding:80px 24px 60px;text-align:center}
  .eyebrow{
    margin-bottom:18px;
    color:var(--teal);
    font-family:var(--mono);
    font-size:13px;
    letter-spacing:.18em;
    text-transform:uppercase;
  }
  h1{
    max-width:820px;
    margin:0 auto 20px;
    font-family:var(--display);
    font-size:clamp(40px,7vw,76px);
    font-weight:900;
    letter-spacing:-.01em;
    line-height:1.05;
  }
  h1 em{color:var(--brass);font-style:italic}
  .sub{max-width:540px;margin:0 auto 40px;font-size:18px;opacity:.78}
  .ticket{
    position:relative;
    display:flex;
    max-width:560px;
    margin:0 auto 24px;
    overflow:hidden;
    border-radius:12px;
    background:var(--ink);
    color:var(--paper);
    box-shadow:0 18px 40px -16px rgba(22,26,34,.35);
  }
  .ticket-main{flex:1;padding:28px 24px;text-align:left}
  .ticket-label{
    margin-bottom:10px;
    font-family:var(--mono);
    font-size:11px;
    letter-spacing:.18em;
    text-transform:uppercase;
    opacity:.5;
  }
  .ticket-file{margin-bottom:18px;font-family:var(--mono);font-size:15px;opacity:.85}
  .ticket-arrow{margin:0 0 8px;font-family:var(--mono);font-size:13px;opacity:.4}
  .ticket-url{color:var(--brass);font-family:var(--mono);font-size:22px;font-weight:700}
  .ticket-stub{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:120px;
    flex-shrink:0;
    border-left:2px dashed rgba(244,239,230,.25);
    background:rgba(244,239,230,.04);
  }
  .ticket-stub::before,.ticket-stub::after{
    content:'';
    position:absolute;
    left:-13px;
    width:24px;
    height:24px;
    border-radius:50%;
    background:var(--paper);
  }
  .ticket-stub::before{top:-12px}
  .ticket-stub::after{bottom:-12px}
  .stub-mark{
    transform:rotate(90deg);
    color:var(--brass);
    font-family:var(--display);
    font-size:34px;
    font-weight:900;
    letter-spacing:.1em;
    white-space:nowrap;
  }
  .hero-note{margin-bottom:36px;font-size:13px;opacity:.6}
  .cta-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
  .btn{
    border:2px solid var(--ink);
    border-radius:6px;
    padding:13px 27px;
    font-weight:600;
    font-size:15px;
    text-decoration:none;
    cursor:pointer;
    transition:all .15s;
  }
  .btn-primary{background:var(--ink);color:var(--paper)}
  .btn-primary:hover{border-color:var(--brass);background:var(--brass);color:var(--ink)}
  .btn-secondary{background:transparent;color:var(--ink)}
  .btn-secondary:hover{background:var(--ink);color:var(--paper)}

  /* Marketing sections */
  .how,.pricing{border-top:1px solid var(--line);padding:80px 24px}
  .pricing{padding-bottom:100px}
  .section-head{margin-bottom:56px;text-align:center}
  .section-head h2{font-family:var(--display);font-size:clamp(28px,4vw,42px);font-weight:900}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
  .step-num{margin-bottom:12px;color:var(--brass);font-family:var(--mono);font-size:14px;font-weight:700}
  .step h3{margin-bottom:8px;font-family:var(--display);font-size:22px;font-weight:600}
  .step p{font-size:15px;opacity:.72}
  .plans{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:14px;
    border:0;
    border-radius:0;
    background:transparent;
  }
  .plan{
    position:relative;
    padding:28px 18px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    transition:background .25s ease,box-shadow .25s ease;
    z-index:1;
    overflow:hidden;
  }
  .plan.featured{background:var(--cream);color:var(--ink);padding-top:0}
  .plan-banner{
    margin:0 -18px 22px;
    padding:10px 18px;
    background:linear-gradient(135deg,#a855f7,#7c3aed);
    color:#fff;
    text-align:center;
    font-family:var(--mono);
    font-size:11px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
  }
  .plan.is-highlighted{
    background:linear-gradient(135deg,rgba(255,255,255,.3) 30%,rgba(201,162,39,.7) 100%);
    animation:planPulse 1.1s ease-in-out 2;
  }
  @keyframes planPulse{
    0%,100%{background:linear-gradient(135deg,rgba(255,255,255,.3) 30%,rgba(201,162,39,.7) 100%)}
    50%{background:linear-gradient(135deg,rgba(255,255,255,.45) 30%,rgba(201,162,39,.85) 100%)}
  }
  .plan-name{margin-bottom:6px;font-family:var(--display);font-size:19px;font-weight:700}
  /* Subtle per-tier accent bar across the top of each plan */
  .plan::before{
    content:'';
    position:absolute;
    top:0;left:0;right:0;
    height:4px;
    background:var(--line);
  }
  .plan[data-plan="free"]::before{background:var(--muted)}
  .plan[data-plan="mini"]::before{background:var(--teal)}
  .plan[data-plan="solo"]::before{background:linear-gradient(90deg,#a855f7,#7c3aed)}
  .plan[data-plan="pro"]::before{background:var(--brass)}
  .plan[data-plan="custom"]::before{background:var(--rust)}
  .plan.featured::before{display:none}
  .plan-price{margin-bottom:4px;font-family:var(--mono);font-size:24px;font-weight:700}
  .plan-price span{font-size:13px;font-weight:400;opacity:.6}
  .plan-tag{
    margin-bottom:18px;
    font-family:var(--mono);
    font-size:11px;
    letter-spacing:.1em;
    text-transform:uppercase;
    opacity:.5;
  }
  .plan-feats{list-style:none;font-size:13.5px}
  .plan-feats li{
    display:flex;
    justify-content:space-between;
    gap:8px;
    padding:7px 0;
    border-top:1px solid var(--line);
  }
  .plan.featured .plan-feats li{border-color:var(--line)}
  .plan-feats li span:first-child{opacity:.75}
  .plan-feats li span:last-child{font-family:var(--mono);font-size:12.5px;font-weight:600;white-space:nowrap}
  .yes{color:var(--teal)}
  .no{opacity:.3}
  .plan-cta{
    display:block;
    margin-top:18px;
    border:1.5px solid var(--ink);
    border-radius:5px;
    padding:10px;
    text-align:center;
    text-decoration:none;
    font-size:13.5px;
    font-weight:600;
  }
  .plan.featured .plan-cta{border-color:#7c3aed;background:#7c3aed;color:#fff}
  .plan.featured .plan-cta:hover{background:#6d28d9;border-color:#6d28d9}
  .plan:not(.featured) .plan-cta:hover{background:var(--ink);color:var(--paper)}
  footer{border-top:1px solid var(--line);padding:32px 24px;text-align:center;font-size:13px;opacity:.55}

  /* Auth modal */
  .modal{
    position:fixed;
    inset:0;
    z-index:100;
    display:grid;
    place-items:center;
    padding:20px;
    background:rgba(22,26,34,.68);
    backdrop-filter:blur(8px);
    opacity:0;
    pointer-events:none;
    transition:opacity .18s ease;
  }
  .modal.is-open{opacity:1;pointer-events:auto}
  .modal-card{
    position:relative;
    width:min(100%,460px);
    max-height:calc(100vh - 40px);
    overflow:auto;
    border:1px solid rgba(255,255,255,.35);
    border-radius:16px;
    background:var(--cream);
    box-shadow:var(--shadow);
    transform:translateY(12px) scale(.985);
    transition:transform .18s ease;
  }
  .modal.is-open .modal-card{transform:translateY(0) scale(1)}
  .modal-top{padding:30px 32px 0}
  .modal-kicker{
    color:var(--teal);
    font-family:var(--mono);
    font-size:11px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
  }
  .modal-title{margin-top:7px;font-family:var(--display);font-size:34px;line-height:1.1}
  .modal-copy{margin-top:8px;color:var(--muted);font-size:14px}
  .modal-close{
    position:absolute;
    top:18px;
    right:18px;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    border:1px solid var(--line);
    border-radius:50%;
    background:transparent;
    font-size:22px;
    line-height:1;
    cursor:pointer;
  }
  .auth-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    margin:24px 32px 0;
    padding:4px;
    border:1px solid var(--line);
    border-radius:8px;
    background:var(--paper);
  }
  .auth-tab{
    border:0;
    border-radius:5px;
    padding:9px 10px;
    background:transparent;
    color:var(--muted);
    font-size:14px;
    font-weight:600;
    cursor:pointer;
  }
  .auth-tab.active{background:var(--ink);color:var(--paper)}
  .auth-form{padding:22px 32px 30px}
  .field{display:grid;gap:7px;margin-bottom:15px}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .field-row.single{grid-template-columns:1fr}
  .field label{font-size:13px;font-weight:600}
  .field input,.field select,.setting-control{
    width:100%;
    border:1px solid var(--line);
    border-radius:7px;
    outline:0;
    background:#fff;
    padding:11px 12px;
    color:var(--ink);
    font-size:14px;
  }
  .field input:focus,.field select:focus,.setting-control:focus{
    border-color:var(--teal);
    box-shadow:0 0 0 3px rgba(58,125,110,.13);
  }
  .form-meta{display:flex;justify-content:space-between;gap:12px;margin:-2px 0 17px;color:var(--muted);font-size:12px}
  .check-line{display:flex;align-items:center;gap:7px}
  .check-line input{accent-color:var(--teal)}
  .text-link{border:0;background:transparent;color:var(--teal);font-weight:600;cursor:pointer}
  .auth-submit{
    width:100%;
    border:0;
    border-radius:7px;
    background:var(--ink);
    color:var(--paper);
    padding:12px 18px;
    font-weight:700;
    cursor:pointer;
  }
  .auth-submit:hover{background:var(--teal)}
  .form-message{min-height:20px;margin-top:10px;color:var(--rust);font-size:12px}
  .divider{display:flex;align-items:center;gap:12px;margin:3px 0 15px;color:var(--muted);font-size:11px;text-transform:uppercase}
  .divider::before,.divider::after{content:'';height:1px;flex:1;background:var(--line)}
  .social-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .social-button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid var(--line);
    border-radius:7px;
    background:#fff;
    padding:10px 12px;
    font-size:13px;
    font-weight:600;
    cursor:pointer;
  }
  .social-button:hover{border-color:var(--ink)}
  .social-mark{
    display:grid;
    place-items:center;
    width:19px;
    height:19px;
    border-radius:50%;
    background:var(--ink);
    color:#fff;
    font-family:var(--mono);
    font-size:11px;
    font-weight:700;
  }
  .google-mark{background:conic-gradient(from -45deg,#4285f4 0 25%,#34a853 0 50%,#fbbc05 0 75%,#ea4335 0)}
  .demo-note{
    margin-top:14px;
    border-radius:6px;
    background:rgba(201,162,39,.12);
    padding:10px 12px;
    color:#62551f;
    font-size:11.5px;
  }

  /* Deploy workspace */
  .deploy-view{min-height:calc(100vh - 78px)}
  .deploy-shell{max-width:1080px;margin:0 auto;padding:52px 24px 84px}
  .deploy-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:28px;
  }
  .deploy-heading h1{margin:5px 0 0;font-size:clamp(34px,5vw,52px);text-align:left}
  .deploy-heading p{max-width:510px;color:var(--muted)}
  .plan-pill{
    flex:0 0 auto;
    border:1px solid rgba(58,125,110,.28);
    border-radius:999px;
    background:rgba(58,125,110,.1);
    padding:7px 12px;
    color:var(--teal);
    font-family:var(--mono);
    font-size:11px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
  }
  .deploy-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:22px}
  .panel{
    border:1px solid var(--line);
    border-radius:12px;
    background:rgba(255,252,247,.72);
    box-shadow:0 12px 32px -30px rgba(22,26,34,.5);
  }
  .panel-head{padding:22px 22px 15px;border-bottom:1px solid var(--line)}
  .panel-label{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
  .panel-head h2{margin-top:5px;font-family:var(--display);font-size:25px}
  .panel-head p{margin-top:4px;color:var(--muted);font-size:13px}
  .panel-body{padding:22px}
  .drop-zone{
    display:grid;
    place-items:center;
    min-height:250px;
    border:2px dashed rgba(22,26,34,.22);
    border-radius:10px;
    background:rgba(244,239,230,.55);
    padding:28px;
    text-align:center;
    transition:border-color .15s,background .15s,transform .15s;
  }
  .drop-zone.drag-over{border-color:var(--teal);background:rgba(58,125,110,.09);transform:scale(1.005)}
  .drop-zone.is-locked{opacity:.5;pointer-events:none;background:rgba(22,26,34,.04)}
  .upload-icon{
    display:grid;
    place-items:center;
    width:58px;
    height:58px;
    margin:0 auto 15px;
    border-radius:12px;
    background:var(--ink);
    color:var(--brass);
    font-family:var(--mono);
    font-size:21px;
    font-weight:700;
  }
  .drop-zone h3{font-family:var(--display);font-size:22px}
  .drop-zone p{margin:6px auto 17px;color:var(--muted);font-size:13px}
  .file-buttons{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}
  .small-button{
    border:1.5px solid var(--ink);
    border-radius:6px;
    background:var(--ink);
    color:var(--paper);
    padding:9px 13px;
    font-size:12px;
    font-weight:700;
    cursor:pointer;
  }
  .small-button.secondary{background:transparent;color:var(--ink)}
  .small-button:disabled{opacity:.4;cursor:not-allowed}
  .limit-copy{margin-top:13px!important;font-family:var(--mono);font-size:10.5px!important;opacity:.75}
  .file-summary{
    display:flex;
    justify-content:space-between;
    gap:14px;
    margin-top:18px;
    padding-bottom:10px;
    border-bottom:1px solid var(--line);
    font-size:12px;
    font-weight:600;
  }
  .file-list{list-style:none;margin-top:3px}
  .file-item{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    padding:10px 0;
    border-bottom:1px solid var(--line);
    font-family:var(--mono);
    font-size:11px;
  }
  .file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .file-size{color:var(--muted)}
  .file-empty{padding:16px 0;color:var(--muted);font-size:13px;text-align:center}
  .file-warning{margin-top:12px;color:var(--rust);font-size:12px}
  .settings-list{display:grid;gap:17px}
  .setting{display:grid;gap:7px}
  .setting label{font-size:13px;font-weight:600}
  .setting-help{color:var(--muted);font-size:11.5px}
  .url-preview{
    display:flex;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:7px;
    background:#fff;
  }
  .url-preview input{min-width:0;flex:1;border:0;outline:0;background:transparent;padding:11px 12px;font-family:var(--mono);font-size:12px}
  .refresh-slug{border:0;border-left:1px solid var(--line);background:var(--paper);padding:0 12px;font-size:16px;cursor:pointer}
  .toggle-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    border:1px solid var(--line);
    border-radius:7px;
    background:#fff;
    padding:11px 12px;
  }
  .toggle-copy strong{display:block;font-size:13px}
  .toggle-copy span{color:var(--muted);font-size:11px}
  .switch{position:relative;width:42px;height:23px;flex:0 0 auto}
  .switch input{position:absolute;opacity:0}
  .switch-track{position:absolute;inset:0;border-radius:999px;background:#bbb;cursor:pointer;transition:.15s}
  .switch-track::after{content:'';position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:#fff;transition:.15s}
  .switch input:checked + .switch-track{background:var(--teal)}
  .switch input:checked + .switch-track::after{transform:translateX(19px)}
  .free-box{
    border:1px solid rgba(201,162,39,.32);
    border-radius:8px;
    background:rgba(201,162,39,.08);
    padding:13px;
    font-size:12px;
  }
  .free-box strong{display:block;margin-bottom:3px}
  .deploy-button{
    width:100%;
    border:0;
    border-radius:7px;
    background:var(--ink);
    color:var(--paper);
    padding:13px 18px;
    font-weight:700;
    cursor:pointer;
  }
  .deploy-button:disabled{cursor:not-allowed;opacity:.4}
  .deploy-button:not(:disabled):hover{background:var(--teal)}
  .deploy-button.is-upgrade{background:var(--brass);color:var(--ink)}
  .deploy-button.is-upgrade:hover{background:var(--rust);color:var(--paper)}
  .deploy-status{min-height:19px;margin-top:8px;color:var(--muted);font-size:11.5px;text-align:center}
  .success-card{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:18px;
    border:1px solid rgba(58,125,110,.25);
    border-radius:12px;
    background:rgba(58,125,110,.09);
    padding:20px 22px;
  }
  .success-mark{
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    border-radius:50%;
    background:var(--teal);
    color:#fff;
    font-size:22px;
    font-weight:700;
  }
  .success-card h3{font-family:var(--display);font-size:22px}
  .success-card p{color:var(--muted);font-size:12px}
  .success-url{display:block;margin-top:3px;color:var(--teal);font-family:var(--mono);font-size:13px;font-weight:700}
  .success-actions{display:flex;gap:8px}

  /* Dashboard */
  .dashboard-view{min-height:calc(100vh - 78px)}
  .dashboard-shell{max-width:1080px;margin:0 auto;padding:52px 24px 84px}
  .dashboard-heading{
    display:flex;flex-direction:column;align-items:flex-start;
    gap:14px;margin-bottom:32px;
  }
  .dashboard-heading h1{margin:5px 0 0;font-size:clamp(30px,4.5vw,46px)}
  .dashboard-heading p{max-width:480px;color:var(--muted)}
  .demo-plan-switch{
    display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);
    border-radius:7px;padding:8px 12px;font-size:12px;color:var(--muted);
    font-family:var(--mono);background:#fff;max-width:100%;
  }
  .demo-plan-switch select{border:1px solid var(--line);border-radius:5px;padding:5px 8px;font-size:12px}

  .ticket-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:48px 36px}

  /* Empty project slot */
  .ticket-slot{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
    min-height:160px;border:2px dashed var(--line);border-radius:14px;
    color:var(--muted);background:transparent;cursor:pointer;width:100%;
    font-family:var(--body);font-size:13px;text-align:center;padding:24px;
    transition:border-color .18s,color .18s,background .18s;
  }
  .ticket-slot:hover{border-color:var(--brass);color:var(--ink);background:rgba(201,162,39,.05)}
  .ticket-slot .slot-plus{font-size:32px;line-height:1;font-family:var(--display);font-weight:900;color:var(--brass)}

  /* ── Site card ────────────────────────────────────────── */
  .site-card{
    position:relative;
    display:flex;
    flex-direction:column;
    border:0;
    border-radius:14px;
    background:var(--ink);
    color:var(--paper);
    padding:24px 22px 22px;
    text-align:left;
    cursor:pointer;
    width:100%;
    box-shadow:0 16px 40px -18px rgba(22,26,34,.55);
    transition:transform .2s cubic-bezier(.34,1.4,.64,1), box-shadow .22s ease;
  }
  .site-card:hover{
    transform:translateY(-5px);
    box-shadow:0 24px 50px -18px rgba(22,26,34,.6);
  }
  .site-card-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:16px;
  }
  .site-card .ticket-label{
    font-family:var(--mono);font-size:10px;
    letter-spacing:.2em;text-transform:uppercase;opacity:.45;
  }
  .live-badge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    border-radius:999px;
    background:rgba(201,162,39,.16);
    padding:5px 10px;
    font-family:var(--mono);
    font-size:10px;
    font-weight:700;
    letter-spacing:.14em;
    color:var(--brass);
  }
  .live-badge::before{
    content:'';
    width:6px;height:6px;
    border-radius:50%;
    background:var(--brass);
  }

  .site-card .ticket-file{margin-bottom:16px;font-family:var(--mono);font-size:13px;opacity:.8}
  .site-card .ticket-arrow{margin-bottom:6px;font-family:var(--mono);font-size:12px;opacity:.38}
  .site-card .ticket-url{
    color:var(--brass);font-family:var(--mono);font-size:16px;font-weight:700;
    word-break:break-all;line-height:1.35;
  }
  .site-card-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid rgba(244,239,230,.12);
  }
  .site-card-action{
    border:1.5px solid rgba(244,239,230,.35);
    border-radius:6px;
    background:transparent;
    color:var(--paper);
    padding:8px 14px;
    font-size:12px;
    font-weight:600;
    cursor:pointer;
    transition:background .15s,border-color .15s;
  }
  .site-card-action:hover{background:rgba(244,239,230,.1);border-color:var(--paper)}

  .ticket-feature-list{display:grid;gap:10px;padding:22px 32px 0}

  .danger-zone{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin:22px 32px 30px;
    padding-top:18px;
    border-top:1px solid var(--line);
  }
  .danger-zone-copy strong{display:block;font-size:13px;color:var(--rust)}
  .danger-zone-copy span{display:block;margin-top:3px;color:var(--muted);font-size:11.5px;max-width:280px}
  .danger-button{
    flex:0 0 auto;
    border:1.5px solid var(--rust);
    border-radius:6px;
    background:transparent;
    color:var(--rust);
    padding:9px 14px;
    font-size:12.5px;
    font-weight:700;
    cursor:pointer;
    transition:background .15s,color .15s;
  }
  .danger-button:hover{background:var(--rust);color:#fff}
  .danger-button.is-confirm{background:var(--rust);color:#fff}

  @media (max-width:880px){
    .plans{grid-template-columns:1fr 1fr}
    .steps{grid-template-columns:1fr;gap:40px}
    .deploy-grid{grid-template-columns:1fr}
  }
  @media (max-width:680px){
    nav{padding:17px 18px}
    .nav-links{display:none}
    .user-email{display:none}
    .nav-button,.nav-cta{padding:8px 11px;font-size:12px}
    .hero{padding-top:58px}
    .ticket{flex-direction:column}
    .ticket-stub{width:100%;height:48px;border-top:2px dashed rgba(244,239,230,.25);border-left:0}
    .ticket-stub::before,.ticket-stub::after{display:none}
    .stub-mark{transform:none;font-size:16px}
    .plans{grid-template-columns:1fr}
    .modal-top{padding:28px 22px 0}
    .auth-tabs{margin:22px 22px 0}
    .auth-form{padding:20px 22px 24px}
    .field-row,.social-grid{grid-template-columns:1fr}
    .deploy-shell{padding:38px 18px 64px}
    .deploy-heading{align-items:flex-start;flex-direction:column}
    .panel-body,.panel-head{padding-left:17px;padding-right:17px}
    .success-card{grid-template-columns:auto 1fr}
    .success-actions{grid-column:1/-1}
    .success-actions .small-button{flex:1}
    .dashboard-shell{padding:38px 18px 64px}
    .ticket-grid{grid-template-columns:1fr}
  }
  @media (prefers-reduced-motion:reduce){
    *{scroll-behavior:auto!important;transition:none!important}
  }