/* Fresh Ads page: the original's requests pages (list, "New request" builder, request detail), DESIGN_PARITY.md, on
   the shell's shared parts (styles.css STANDARDS: .page-head, .stat-strip, .card, .table-wrap, .empty / .state-panel,
   .notice, .btn, App.confirm). Tokens only; type sizes 11/12/13/15/17/20/26/32. The --lx-* aliases, ad card, ad panel,
   meter and skeletons come from library.css. */
.frq{max-width:1320px}
.frq-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.frq-hint{font:400 13px/1.5 var(--lx-body);color:var(--text-muted)}
.frq-hint.bad{color:var(--lx-neg)}
.frq-hint.warn{color:var(--lx-warn)}
.frq-msg{margin:0;font:400 13px/1.5 var(--lx-body);color:var(--lx-neg)}
.frq-msg:empty{display:none}
.frq-err{color:var(--lx-neg)}
.frq-notice{margin:0 0 20px}
.frq-notice a{color:var(--lx-acc-text);font-weight:500}

/* states: the shell's .empty / .state-panel with the actions in one row */
.frq-state p{margin:4px 0 0;font-size:13px;line-height:1.55;max-width:64ch}
.frq-state .frq-state-a{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}

/* status pill (the request list) */
.frq-st{display:inline-flex;align-items:center;gap:6px;padding:2px 9px;border-radius:999px;border:1px solid transparent;font:500 12px/1.6 var(--lx-body);white-space:nowrap}
.frq-st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.frq-st.s-act{background:var(--accent-soft);color:var(--lx-acc-text);border-color:color-mix(in oklab,var(--accent) 22%,transparent)}
.frq-st.s-wait{background:var(--surface-2);color:var(--text-muted);border-color:var(--border)}
.frq-st.s-wait::before{animation:lib-pulse 1.6s ease-in-out infinite}
.frq-st.s-ok{background:color-mix(in oklab,var(--lx-pos) 11%,transparent);color:var(--lx-pos);border-color:color-mix(in oklab,var(--lx-pos) 22%,transparent)}
.frq-st.s-bad{background:color-mix(in oklab,var(--lx-neg) 9%,transparent);color:var(--lx-neg);border-color:color-mix(in oklab,var(--lx-neg) 22%,transparent)}
.frq-st.s-done{background:transparent;color:var(--text-muted);border-color:var(--border)}

/* steps (desktop) and "Step 2 of 4 · Your review" (phones) */
.frq-stepsrow{margin:-8px 0 20px}
.frq-steps{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:0;padding:0;list-style:none}
.frq-steps li{display:inline-flex;align-items:center;gap:8px;padding:4px 6px;font:400 13px/1.4 var(--lx-body);color:var(--text-muted)}
.frq-steps li+li::before{content:"";width:16px;height:1px;margin-right:4px;background:var(--border-strong)}
.frq-step-m{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:999px;border:1px solid var(--border-strong);font:500 11px/1 var(--lx-body);font-variant-numeric:tabular-nums;color:var(--text-muted)}
.frq-steps li.done .frq-step-m{background:var(--surface);color:var(--text)}
.frq-steps li.on{color:var(--text);font-weight:500}
.frq-steps li.on .frq-step-m{background:var(--text);border-color:var(--text);color:var(--surface)}
.frq-steps-ph{display:none;margin:0;font:500 13px/1.4 var(--lx-body);color:var(--text-muted)}
/* the request's figures */
.frq-strip{margin:0 0 24px}
.frq-strip .frq-sv-status{font:600 17px/1.35 var(--lx-head);letter-spacing:-.01em}
.frq-strip .frq-sv-act{color:var(--lx-acc-text)}

/* sections */
.frq-sec{margin-top:32px}
.frq-sec-h{flex-wrap:wrap}
.frq-filter{display:inline-flex;align-items:center;gap:10px;font:400 13px/1.4 var(--lx-body);color:var(--text-muted)}
.frq-filter select{min-width:200px}
.frq-skels{display:grid;gap:8px}
.lib-skel.frq-skel-row{height:58px;border-radius:12px}
.frq-more{display:flex;flex-direction:column;align-items:center;gap:8px;padding-top:24px}
.frq-more:empty{display:none}
.frq-more-s{margin:0;font:500 12px/1.4 var(--lx-body);color:var(--text-muted);font-variant-numeric:tabular-nums}

/* request list (the shell's .table-wrap): room between Status and Ads found */
.frq-table th.frq-th-st{width:240px}
.frq-table th.frq-th-ads{width:140px}
.frq-table th.frq-th-when{width:150px;padding-left:40px}
.frq-table .r{text-align:right}
.frq-table td{vertical-align:middle;color:var(--text-muted);font-variant-numeric:tabular-nums}
.frq-table td.frq-when{padding-left:40px;white-space:nowrap}
.frq-table tbody tr{cursor:pointer}
.frq-tdt{min-width:240px}
.frq-rt{display:block;font:500 15px/1.4 var(--lx-body);color:var(--text);text-decoration:none}
.frq-rt:hover{color:var(--lx-acc-text)}
.frq-tdt small{display:block;margin-top:2px;font-size:12px;color:var(--text-muted)}
.frq-tda b{font-weight:500;color:var(--text)}
.frq-tda-l{display:none}

/* updates (notifications), a .card */
.frq-updates{margin:0 0 8px;padding:0;overflow:hidden}
.frq-uh{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 20px;border-bottom:1px solid var(--border)}
.frq-uh h3{display:flex;align-items:baseline;gap:10px;margin:0;font:600 17px/1.35 var(--lx-head);color:var(--text)}
.frq-ucount{font:500 13px/1.4 var(--lx-body);color:var(--lx-acc-text)}
.frq-updates ul{margin:0;padding:0;list-style:none}
.frq-updates li+li{border-top:1px solid var(--border)}
.frq-updates li a{display:flex;align-items:center;gap:12px;padding:11px 20px;text-decoration:none;transition:background var(--lx-fast) var(--lx-ease)}
.frq-updates li a:hover{background:var(--surface-2)}
.frq-udot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none}
.frq-ut{display:flex;flex-direction:column;min-width:0;flex:1}
.frq-ut b{font:500 15px/1.4 var(--lx-body);color:var(--text)}
.frq-ut small{font:400 13px/1.4 var(--lx-body);color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.frq-ugo{display:inline-flex;color:var(--text-muted)}

/* ---------- builder (the original's "New request"): sections in one card + a sticky 320px summary ---------- */
.frq-form{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
.frq-main.card{padding:0;min-width:0}
.frq-s{display:flex;flex-direction:column;gap:16px;padding:20px 24px}
.frq-s+.frq-s{border-top:1px solid var(--border)}
.frq-s-h{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px}
.frq-s-h h2{margin:0;font:600 17px/1.35 var(--lx-head);letter-spacing:-.01em;color:var(--text)}
.frq-fs{margin:0;padding:0;border:0;min-width:0;display:flex;flex-direction:column;gap:8px}
.frq-fs legend{padding:0;margin-bottom:8px;font:500 13px/1.4 var(--lx-body);color:var(--text-muted)}
/* two columns; an odd last card spans both */
.frq-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.frq-opts>.frq-opt:last-child:nth-child(odd){grid-column:1/-1}
.frq-opt{position:relative;display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);cursor:pointer;transition:border-color var(--lx-fast) var(--lx-ease),background var(--lx-fast) var(--lx-ease)}
.frq-opt:hover{border-color:var(--border-strong)}
.frq-opt input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.frq-radio{display:grid;place-items:center;flex:none;width:16px;height:16px;margin-top:3px;border:1px solid var(--border-strong);border-radius:50%;background:var(--surface)}
.frq-radio::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);transform:scale(0);transition:transform var(--lx-fast) var(--lx-ease)}
.frq-opt:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.frq-opt:has(input:checked) .frq-radio{border-color:var(--accent)}
.frq-opt:has(input:checked) .frq-radio::after{transform:scale(1)}
.frq-opt:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.frq-opt-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.frq-opt-t b{font:500 15px/1.4 var(--lx-body);color:var(--text)}
.frq-opt-t small{font:400 13px/1.5 var(--lx-body);color:var(--text-muted)}
.frq-fields{display:flex;flex-direction:column;gap:14px}
.frq-fields:not(:has(>:not([hidden]):not(datalist))){display:none}
.frq-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.frq-f-l{display:flex;justify-content:space-between;gap:12px;font:500 13px/1.4 var(--lx-body);color:var(--text)}
.frq-optional{font-weight:400;font-size:12px;color:var(--text-muted)}
.frq-f small{font:400 12px/1.45 var(--lx-body);color:var(--text-muted)}
.frq .field.bad{border-color:var(--lx-neg);box-shadow:0 0 0 3px color-mix(in oklab,var(--lx-neg) 14%,transparent)}
.frq .frq-f small.frq-ferr{display:flex;align-items:center;gap:6px;font-weight:500;color:var(--lx-neg)}
.frq-ferr::before{content:"!";display:inline-grid;place-items:center;width:14px;height:14px;border-radius:50%;background:var(--lx-neg);color:var(--surface);font:700 11px/1 var(--lx-body)}
.frq-f2{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:12px}
.frq-brand{padding:14px 16px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}
.frq-brand p{margin:0;font:400 15px/1.5 var(--lx-body);color:var(--text)}
.frq-brand p span{color:var(--text-muted)}
.frq-brand .btn{align-self:flex-start;margin:2px 0 0 -8px}
.frq-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.frq .frq-chips .chip{color:var(--text);font-size:13px}
.frq-num{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.frq-stepper{display:inline-flex;align-items:center;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface);overflow:hidden;transition:border-color var(--lx-fast) var(--lx-ease),box-shadow var(--lx-fast) var(--lx-ease)}
.frq-stepper:focus-within{outline:2px solid var(--accent);outline-offset:3px;border-color:color-mix(in oklab,var(--accent) 55%,transparent)}
.frq-stepper.bad{border-color:var(--lx-neg);box-shadow:0 0 0 3px color-mix(in oklab,var(--lx-neg) 14%,transparent)}
.frq-stepper.bad:focus-within{outline-color:var(--lx-neg)}
.frq-stepper button{width:40px;height:40px;border:0;background:none;font:400 17px/1 var(--lx-body);color:var(--text-muted);cursor:pointer}
.frq-stepper button:hover{color:var(--text);background:var(--surface-2)}
.frq-stepper button:focus-visible{outline:none;background:var(--accent-soft);color:var(--text)}
.frq-stepper button:disabled{opacity:.4;pointer-events:none}
.frq-stepper input{width:56px;height:40px;border:0;border-inline:1px solid var(--border);background:transparent;text-align:center;font:500 15px/1 var(--lx-body);font-variant-numeric:tabular-nums;color:var(--text);-moz-appearance:textfield;appearance:textfield}
.frq-stepper input::-webkit-outer-spin-button,.frq-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.frq-stepper input:focus,.frq-stepper input:focus-visible{outline:none}
.frq-stepper.bad input{color:var(--lx-neg)}
/* summary aside (.card.compact) */
.frq-sum{position:sticky;top:var(--sticky-top,24px);display:flex;flex-direction:column;gap:16px}
.frq-sum h2{margin:0;font:600 17px/1.35 var(--lx-head);letter-spacing:-.01em;color:var(--text)}
.frq-dl{display:grid;grid-template-columns:88px minmax(0,1fr);gap:8px 12px;margin:0;font:400 13px/1.5 var(--lx-body)}
.frq-dl dt{color:var(--text-muted)}
.frq-dl dd{margin:0;color:var(--text);overflow-wrap:anywhere}
.frq-sum-b{display:flex;flex-direction:column;gap:6px;padding-top:16px;border-top:1px solid var(--border)}
.frq-sum-l{margin:0;font:400 13px/1.5 var(--lx-body);color:var(--text-muted)}
.frq-cn{margin:0;display:flex;align-items:baseline;gap:6px}
.frq-cn b{font:700 20px/1.25 var(--lx-head);letter-spacing:-.02em;color:var(--text);font-variant-numeric:tabular-nums}
.frq-cn span{font:400 15px/1.5 var(--lx-body);color:var(--text-muted)}
.frq-bal{margin:0;font:400 13px/1.5 var(--lx-body);color:var(--text-muted);font-variant-numeric:tabular-nums}
.frq-short{margin:0 0 4px;font:400 13px/1.5 var(--lx-body);color:var(--lx-warn)}
#faBal .btn{align-self:flex-start}
.frq-how{margin:4px 0 0;font:400 12px/1.5 var(--lx-body);color:var(--text-muted)}
.frq-under{margin:0;font:400 13px/1.5 var(--lx-body);color:var(--text-muted)}

/* ---------- request detail ---------- */
.frq-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
.frq-col{display:flex;flex-direction:column;gap:20px;min-width:0}
.frq-col>.frq-sec{margin-top:0}
/* the plan (.card, no padding, no clip: the Approve bar sticks to the bottom of the window while you read) */
.frq-plan.card{padding:0}
.frq-plan-h{padding:20px 24px 16px;border-bottom:1px solid var(--border)}
.frq-plan-h h2{margin:0;font:600 17px/1.35 var(--lx-head);letter-spacing:-.01em;color:var(--text)}
.frq-plan-h p{margin:4px 0 0;font:400 13px/1.55 var(--lx-body);color:var(--text-muted)}
.frq-pc+.frq-pc{border-top:1px solid var(--border)}
.frq-pch{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;padding:12px 24px;background:var(--surface-2);border-bottom:1px solid var(--border)}
.frq-pch b{font:500 13px/1.4 var(--lx-body);color:var(--text)}
.frq-pch span{font:400 12px/1.4 var(--lx-body);color:var(--text-muted)}
.frq-plist{margin:0;padding:6px 0;list-style:none;counter-reset:frq-p}
.frq-plist li{counter-increment:frq-p;display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:10px;align-items:center;padding:5px 16px 5px 24px}
.frq-plist li::before{content:counter(frq-p);font:500 12px/1 var(--lx-body);color:var(--text-muted);font-variant-numeric:tabular-nums}
.frq-plist.ro{padding:0}
.frq-plist.ro li{grid-template-columns:24px minmax(0,1fr);padding-block:11px}
.frq-plist.ro li+li{border-top:1px solid var(--border)}
.frq-ptext{font:400 15px/1.55 var(--lx-body);color:var(--text)}
/* prompts look like what they are: fields you can type in */
.frq .frq-pin{min-height:40px;padding:8px 12px;font-size:15px;background:var(--lx-s1);border:1px solid var(--border);box-shadow:var(--lx-shadow-inset);cursor:text}
.frq .frq-pin:hover{border-color:var(--border-strong)}
.frq-px{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:8px;background:none;color:var(--text-muted);cursor:pointer}
.frq-px:hover,.frq-px:focus-visible{background:color-mix(in oklab,var(--lx-neg) 9%,transparent);color:var(--lx-neg)}
.frq-px svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.frq-add{margin:6px 24px 16px}
.frq-approve{position:sticky;bottom:0;z-index:3;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px 12px;padding:14px 24px;border-top:1px solid var(--border);border-radius:0 0 var(--card-r,16px) var(--card-r,16px);background:color-mix(in oklab,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 -10px 24px -18px color-mix(in oklab,var(--text) 40%,transparent)}
.frq-approve-t{margin-right:auto;min-width:0}
.frq-approve .frq-hint.warn{font-weight:500}
.frq-pmsg{padding:0 24px 16px}
/* finished requests: the plan folded away (the original's disclosure, a .card) */
.frq-fold.card{padding:0}
.frq-fold summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:12px 16px 12px 24px;cursor:pointer;list-style:none;border-radius:var(--card-r,16px)}
.frq-fold summary::-webkit-details-marker{display:none}
.frq-fold:hover{border-color:var(--border-strong)}
.frq-fold-t{display:flex;flex-direction:column;min-width:0}
.frq-fold-t b{font:600 15px/1.35 var(--lx-head);color:var(--text)}
.frq-fold-t small{font:400 13px/1.4 var(--lx-body);color:var(--text-muted)}
.frq-fold-ic{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:999px;background:var(--surface-2);color:var(--text-muted);transition:transform .26s var(--lx-ease)}
.frq-fold-ic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.frq-fold[open] .frq-fold-ic{transform:rotate(45deg);color:var(--accent);background:var(--accent-soft)}
.frq-fold-b{border-top:1px solid var(--border)}
.frq-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:20px}
/* side card (.card.compact) */
.frq-side{display:flex;flex-direction:column;gap:16px;position:sticky;top:var(--sticky-top,24px)}
.frq-card{display:flex;flex-direction:column;gap:10px}
.frq-card h2{margin:0;font:600 17px/1.35 var(--lx-head);letter-spacing:-.01em;color:var(--text)}
.frq-dl-req{grid-template-columns:minmax(88px,auto) minmax(0,1fr)}

/* narrow screens */
@media (max-width:1023px){
  .frq-form,.frq-grid{grid-template-columns:minmax(0,1fr)}
  .frq-sum,.frq-side{position:static}
}
@media (max-width:760px){
  .frq-opts{grid-template-columns:minmax(0,1fr)}
  .frq-opts>.frq-opt:last-child:nth-child(odd){grid-column:auto}
}
@media (max-width:640px){
  .frq .page-actions:has(.btn-primary){width:100%}
  .frq .page-actions .btn-primary{flex:1}
  .frq-s{padding:16px}
  .frq-filter{width:100%}.frq-filter select{flex:1;min-width:0}
  /* the request table becomes stacked rows */
  .frq-table thead{display:none}
  .frq-table,.frq-table tbody{display:block}
  .frq-table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:12px 14px;border-top:1px solid var(--border)}
  .frq-table tr:first-child{border-top:0}
  .frq-table td{display:block;padding:0!important;border:0;background:none!important}
  .frq-table .frq-tdt{grid-column:1/-1;min-width:0}
  .frq-table .r{text-align:left}
  .frq-tda-l{display:inline}
  .frq-table td.frq-when{grid-column:1/-1;font-size:12px}
  .frq-steps{display:none}
  .frq-steps-ph{display:block}
  .frq-plist li{padding-left:14px;grid-template-columns:20px minmax(0,1fr) auto}
  .frq-pch,.frq-plan-h,.frq-approve{padding-inline:16px}
  .frq-approve .btn{flex:1 1 auto}
  .frq-add{margin-inline:16px}
}
