/* D142 · Fit the screen. Loaded last on Discover/Launch. Laptop and desktop only; phones keep their layout. */

/* Discover: slightly smaller token cards, so more fit per row (6 at 1440, 8 at 1920). */
@media (min-width:1101px){
  .card-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
}

/* Launch token: the whole form fits one laptop screen (Chrome on a 1440×900 MacBook shows ~790px).
   One page grid: title and availability across the top, the form on the left, the token preview and the
   four steps in the side column. Phones keep the stacked layout. */
@media (min-width:1100px){
  #launch-view:is(:not([hidden]),html[data-route=launch] *){display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:20px;
    grid-template-areas:"title title" "avail avail" "form aside" "form steps";grid-template-rows:auto auto auto 1fr;align-items:start}
  #launch-view>.title-row{grid-area:title;margin:8px 0 2px;align-items:flex-end}
  #launch-view .launch-about,#launch-view .launch-layout{display:contents}
  #launch-view #launch-availability{grid-area:avail;margin:0 0 8px}
  #launch-view #launch-form{grid-area:form}
  #launch-view .preview-column{grid-area:aside;position:static}
  #launch-view .launch-steps{grid-area:steps}
  #launch-view .title-row h1{font-size:32px;margin:2px 0 2px}
  #launch-view .title-row .subtitle{margin:0;font-size:14px}
  #launch-view .title-row .eyebrow{margin:0}

  /* Side column: compact preview card, then the four steps (two lines each; full text on hover/focus). */
  #launch-view .preview-column>.eyebrow{margin:0 0 8px}
  #launch-view .preview-card{min-height:0;padding:14px 16px}
  #launch-view .preview-card .card-head img{width:56px;height:56px}
  #launch-view .preview-card h2{font-size:20px;margin:8px 0 2px}
  #launch-view .preview-card p{margin:8px 0 10px;min-height:0}
  #launch-view .preview-column .quiet-note{display:none}
  #launch-view .launch-steps{grid-template-columns:1fr;gap:6px;margin:10px 0 0}
  #launch-view .launch-steps li{padding:8px 12px;gap:2px;border-radius:10px}
  #launch-view .launch-steps strong{font-size:13px}
  #launch-view .launch-steps span{font-size:12px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  #launch-view .launch-steps li:hover span,#launch-view .launch-steps li:focus-within span{-webkit-line-clamp:unset;line-clamp:unset}

  /* Form: your token on the left, pair and fees on the right. */
  #launch-form.panel{padding:14px 18px}
  #edit-fields{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);column-gap:20px;
    grid-template-areas:"upload policy" "fields policy" "desc policy" "links policy" "actions policy" ". policy";grid-template-rows:auto auto auto auto auto 1fr;align-items:start}
  #edit-fields>.upload{grid-area:upload;height:76px!important;margin:0 0 10px!important;justify-content:flex-start;padding:0 14px}
  #edit-fields>.upload #upload-copy{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;text-align:left}
  #edit-fields>.upload .upload-symbol{grid-row:span 2;margin:0}
  #edit-fields>.upload small{font-size:11px}
  #edit-fields>.upload img{width:60px;height:60px}
  #edit-fields>.field-pair{grid-area:fields;gap:12px}
  #edit-fields>label[for=token-description]{grid-area:desc}
  #edit-fields>label[for=token-description] textarea{min-height:56px;height:56px}
  #edit-fields>.launch-policy{grid-area:policy;margin:0;padding:8px 14px 10px}
  #edit-fields>.links{grid-area:links;margin:6px 0 8px;padding:8px 0}
  #edit-fields .links-fields{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  #edit-fields .links-fields label{margin:0;font-size:12px}
  #edit-fields .links-fields input{padding-top:8px;padding-bottom:8px}
  #edit-fields>.field-pair label small,#edit-fields>label[for=token-description] small{font-size:10.5px}
  #edit-fields>.form-actions{grid-area:actions;margin-top:4px}
  #edit-fields label{margin-bottom:6px}
  #edit-fields label small{margin-top:2px}

  /* Pair & rewards: two clean sections with even spacing. */
  #edit-fields>.launch-policy{display:flex;flex-direction:column;gap:8px}
  .launch-policy>legend{padding:0 6px}
  .launch-policy .choice-heading{margin:2px 0 0;gap:10px;align-items:center}
  .launch-policy .choice-heading h3{font-size:14px;margin:0}
  .launch-policy .choice-heading p{font-size:12px;margin:0}
  .launch-policy .fee-heading{margin-top:2px}
  .launch-policy .quote-inspection{padding:2px 0 10px}
  .launch-policy #pair-policy{margin:0}
  .launch-policy .mode-explanation{min-height:0}
  .launch-policy .pair-selection{display:flex;flex-direction:column;gap:6px}
  .launch-policy .pair-cards,.launch-policy .fee-mode-cards{gap:6px;margin:0}
  .launch-policy .pair-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .launch-policy .pair-cards button,.launch-policy .fee-mode-cards button{padding:8px 10px;min-height:0!important;height:auto!important;position:relative}
  .launch-policy .pair-cards button{padding-right:30px}
  .launch-policy .pair-cards button{gap:9px}
  .launch-policy .pair-cards small{margin-top:1px}
  .launch-policy .pair-mark{transform:scale(.8);margin:-4px}
  .launch-policy .fee-mode-cards button{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;text-align:left}
  .launch-policy .fee-mode-cards .mode-icon{grid-row:span 2;transform:scale(.8);margin:-4px}
  .launch-policy .fee-mode-cards small{margin:0}
  .launch-policy .choice-check{position:absolute;top:50%;right:8px;transform:translateY(-50%) scale(.75)}
  .launch-policy .fee-mode-cards button[aria-pressed=true]::after{top:6px;right:6px;width:14px;height:14px;font-size:9px}
  .launch-policy .fee-mode-cards small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .launch-policy .mode-explanation,.launch-policy .fine,.launch-policy .pair-availability{font-size:11.5px;margin:0;line-height:1.4;color:var(--muted)}
  .launch-policy .mode-explanation:empty,.launch-policy .fine:empty{display:none}
  .launch-policy details{margin:0;font-size:12px}
  .launch-policy .policy-explainer{margin:2px 0 0;font-size:12px;align-self:flex-start}
}

/* D144: Launch fills the screen. The page takes the full window height (footer below the fold); its parts keep
   the compact laptop sizes up to a 790px-tall view and grow on taller screens. */
@media (min-width:1100px){
  #launch-view:is(:not([hidden]),html[data-route=launch] *){min-height:calc(100vh - 96px);grid-template-rows:auto auto auto 1fr;padding-bottom:clamp(16px,calc(16px + (100vh - 790px) * 0.0851),40px);box-sizing:border-box}
  #launch-view #launch-form{align-self:stretch;display:flex;flex-direction:column}
  #launch-view #form-error:empty,#launch-view #launch-status:empty{display:none}
  #launch-view #edit-fields{flex:1;row-gap:clamp(0px,calc(0px + (100vh - 790px) * 0.0284),14px)}
  #launch-view .title-row h1{font-size:clamp(32px,calc(32px + (100vh - 790px) * 0.1305),48px)}
  #launch-view>.title-row{margin:clamp(8px,calc(8px + (100vh - 790px) * 0.0568),28px) 0 clamp(2px,calc(2px + (100vh - 790px) * 0.0227),10px)}
  #launch-view #launch-availability{margin-bottom:clamp(8px,calc(8px + (100vh - 790px) * 0.0454),20px)}
  #launch-form.panel{padding:clamp(14px,calc(14px + (100vh - 790px) * 0.0624),28px) clamp(18px,calc(18px + (100vh - 790px) * 0.0568),28px)}
  #edit-fields>.upload{height:clamp(76px,calc(76px + (100vh - 790px) * 0.3406),150px)!important}
  #edit-fields>.upload img{width:clamp(60px,calc(60px + (100vh - 790px) * 0.2838),120px);height:clamp(60px,calc(60px + (100vh - 790px) * 0.2838),120px)}
  #edit-fields>label[for=token-description] textarea{height:clamp(56px,calc(56px + (100vh - 790px) * 0.2838),140px);min-height:56px}
  #edit-fields .links-fields input{padding-top:clamp(8px,calc(8px + (100vh - 790px) * 0.0341),12px);padding-bottom:clamp(8px,calc(8px + (100vh - 790px) * 0.0341),12px)}
  #edit-fields>.launch-policy{gap:clamp(8px,calc(8px + (100vh - 790px) * 0.0426),16px);padding:clamp(8px,calc(8px + (100vh - 790px) * 0.0454),20px) clamp(14px,calc(14px + (100vh - 790px) * 0.0454),20px)}
  .launch-policy .pair-cards,.launch-policy .fee-mode-cards,.launch-policy .pair-selection{gap:clamp(6px,calc(6px + (100vh - 790px) * 0.0284),12px)}
  .launch-policy .pair-cards button,.launch-policy .fee-mode-cards button{padding-top:clamp(8px,calc(8px + (100vh - 790px) * 0.0454),18px);padding-bottom:clamp(8px,calc(8px + (100vh - 790px) * 0.0454),18px)}
  .launch-policy .choice-heading h3{font-size:clamp(14px,calc(14px + (100vh - 790px) * 0.0539),17px)}
  #launch-view .preview-card{padding:clamp(14px,calc(14px + (100vh - 790px) * 0.0568),24px) clamp(16px,calc(16px + (100vh - 790px) * 0.0568),24px)}
  #launch-view .preview-card .card-head img{width:clamp(56px,calc(56px + (100vh - 790px) * 0.2554),104px);height:clamp(56px,calc(56px + (100vh - 790px) * 0.2554),104px)}
  #launch-view .preview-card h2{font-size:clamp(20px,calc(20px + (100vh - 790px) * 0.0795),28px)}
  #launch-view .launch-steps{gap:clamp(6px,calc(6px + (100vh - 790px) * 0.0284),12px)}
  #launch-view .launch-steps li{padding:clamp(8px,calc(8px + (100vh - 790px) * 0.0397),16px) 12px}
}

/* Social links: always shown (no dropdown). */
.links .links-title{margin:0 0 10px;font-size:12px;font-weight:600;color:var(--ink)}
.links .links-title span{color:var(--muted);float:right;font-size:11px;font-weight:400}
.links .links-fields{display:grid;gap:10px}
.links .links-fields label{margin:0}

/* D158 Part 5: the launch grid applies from the first paint (the route rule used to force block layout until the
   script un-hid the view, so the page jumped 0.68 into its grid). */
@media (min-width:1100px){html[data-route=launch] #launch-view[hidden]{display:grid!important}}
