html{scroll-padding-top:72px}
main.dino-stats{padding-top:76px;padding-bottom:48px}

.crumb{padding:0 0 4px;font-size:12.5px;color:var(--text-dim);letter-spacing:.03em}
.crumb a{color:var(--text-secondary);text-decoration:none}
.crumb a:hover{color:var(--cyan)}
.crumb b{color:var(--text-secondary);font-weight:600}

.ds-hero{padding:0 0 16px;border-bottom:1px solid var(--border)}
.ds-hero h1{font-size:30px;font-weight:700;letter-spacing:-0.4px;line-height:1.15;margin:0;text-wrap:balance}
main.dino-stats .eyebrow{font-family:var(--font-mono);font-size:11px;color:var(--text-secondary);letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}
.ds-hero p{color:var(--text-secondary);margin:8px 0 0;font-size:14px;max-width:62ch;line-height:1.6}
.ds-how{margin:10px 0 0;padding-left:1.3em;max-width:62ch;font-size:12.5px;color:var(--text-dim);line-height:1.55}
.ds-how li{margin:0}
.stamp{margin-top:10px;font-family:var(--font-mono);font-size:12px;color:var(--text-dim)}
.stamp b{color:var(--text-secondary);font-weight:500}
.ds-build-note{font-family:var(--font-mono);font-size:11px;color:var(--text-dim)}
.ds-carry-note{display:block;margin-top:6px}

main.dino-stats .page{display:grid;grid-template-columns:320px minmax(0,1fr);grid-template-areas:"rail hdr" "rail content" "rail advanced";grid-template-rows:auto auto 1fr;gap:0 32px;align-items:start;padding-top:18px;padding-bottom:40px}
main.dino-stats .rail{grid-area:rail;position:static;align-self:start;display:grid;gap:12px;padding-bottom:8px}
main.dino-stats .rail.is-fixed{position:sticky;top:76px}
main.dino-stats .rail-top,
main.dino-stats .rail-bottom{display:contents}
main.dino-stats .portrait{order:1}
main.dino-stats .selcard{order:2}
main.dino-stats .ds-data-details{order:3}
main.dino-stats .ds-abilities{order:3}
main.dino-stats .ds-search-field{order:4}
main.dino-stats .results{order:5}
main.dino-stats .hdr{grid-area:hdr}
main.dino-stats .content{grid-area:content;padding-top:18px}
main.dino-stats .ds-advanced{grid-area:advanced;min-width:0}
main.dino-stats .portrait{position:relative;aspect-ratio:1/1;max-width:200px;border:1px solid var(--border);border-radius:12px;background:var(--bg-card);overflow:hidden}
main.dino-stats .portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
main.dino-stats .portrait img[hidden],
main.dino-stats .ds-portrait-ph[hidden]{display:none !important}
main.dino-stats .ds-portrait-ph{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:12px;background:var(--bg-card)}
main.dino-stats .ds-portrait-ph::before{content:"";position:absolute;left:50%;top:40%;width:46%;height:52%;transform:translate(-50%,-50%);background:var(--border-strong);border-radius:42% 42% 32% 32% / 38% 38% 48% 48%;opacity:.9}
main.dino-stats .ds-portrait-ph span{position:relative;font-size:12px;color:var(--text-secondary);line-height:1.5}
.field{margin-bottom:16px}
.field label{display:block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);margin-bottom:7px}
main.dino-stats .inp,main.dino-stats select{width:100%;background:var(--bg-card);border:1px solid var(--border-strong);color:var(--text-primary);border-radius:10px;padding:11px 13px;font-family:var(--font-body);font-size:14px}
main.dino-stats .inp:focus,main.dino-stats select:focus{border-color:var(--cyan-dim)}
main.dino-stats .inp:focus-visible,main.dino-stats select:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
main.dino-stats .inp:disabled,main.dino-stats select:disabled,
main.dino-stats .inp[readonly]{opacity:.55}
main.dino-stats .inp[type="number"],
main.dino-stats .inp[inputmode="decimal"],
main.dino-stats .inp[inputmode="numeric"]{font-family:var(--font-mono)}
main.dino-stats input[type="number"]::-webkit-outer-spin-button,
main.dino-stats input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
main.dino-stats input[type="number"]{-moz-appearance:textfield;appearance:textfield}
main.dino-stats .inp.is-invalid{border-color:var(--red)}
.seg-btn:disabled{opacity:.55;cursor:not-allowed}
.ds-load-status.is-bad{color:var(--red)}
.ds-load-status[hidden]{display:none !important}

.qnote{font-size:11.5px;color:var(--text-dim);margin-top:7px;line-height:1.5}
.selcard{display:flex;align-items:center;gap:12px;background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin-bottom:0}
.selcard b{display:block;font-size:15px}
.selcard span{font-size:12px;color:var(--text-secondary)}
.selcard .chip{margin-top:6px}
#ds-sel-meta[hidden]{display:none !important}

.ds-data-details,
.ds-abilities{margin:0;border:1px solid var(--border);border-radius:12px;padding:10px 14px 12px;background:var(--bg-card)}
.ds-data-details > summary,
.ds-abilities > summary{cursor:pointer;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);list-style:none}
.ds-data-details > summary::-webkit-details-marker,
.ds-abilities > summary::-webkit-details-marker{display:none}
.ds-data-details[open] > summary,
.ds-abilities[open] > summary{margin-bottom:10px}
.ds-abilities[hidden]{display:none !important}
.ds-abil-dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 12px;align-items:start}
.ds-abil-dl dt{font-size:12px;font-weight:600;color:var(--text-secondary)}
.ds-abil-dl dd{margin:0;font-size:13px;color:var(--text-primary);min-width:0}
.ds-abil-dl dd.is-unused{color:var(--text-dim)}
#ds-colors{min-width:0}
#ds-colors .ds-abil-dl dd{overflow-wrap:break-word}
.ds-abil-notes{margin:8px 0 0;padding:0 0 0 16px;font-size:13px;line-height:1.45;color:var(--text-primary)}
.ds-abil-notes li+li{margin-top:4px}
@media(max-width:359px){
  .ds-abil-dl{grid-template-columns:1fr}
}
.ds-data-dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 12px}
.ds-data-dl dt{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}
.ds-data-dl dd{margin:0;font-family:var(--font-mono);font-size:12px;color:var(--text-secondary);word-break:break-all}

#ds-unverified[hidden]{display:none !important}

.seg{display:flex;gap:0;border:1px solid var(--border-strong);border-radius:10px;overflow:hidden}
.seg-btn{flex:1;padding:9px 12px;background:var(--bg-card);border:0;color:var(--text-secondary);font-family:var(--font-body);font-size:13px;cursor:pointer;text-align:center}
.seg-btn+.seg-btn{border-left:1px solid var(--border-strong)}
.seg-btn:hover{color:var(--cyan)}
.seg-btn.active{background:var(--cyan);color:var(--cyan-ink);font-weight:600}

.ds-matches{list-style:none;margin:4px 0 0;padding:0;background:var(--bg-card);border:1px solid var(--border-strong);border-radius:10px;max-height:240px;overflow:auto;position:absolute;top:100%;left:0;right:0;z-index:10}
.ds-matches li{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-bottom:1px solid var(--border);cursor:pointer;font-size:14px}
.ds-matches li:last-child{border-bottom:0}
.ds-matches li:hover,
.ds-matches li.is-active,
.ds-matches li[aria-selected="true"]{background:var(--bg-card-hover)}
.ds-matches b{font-weight:600;color:var(--text-primary)}
.ds-matches small{font-family:var(--font-mono);font-size:11px;color:var(--text-dim)}
.ds-matches .ds-more,
.ds-matches .ds-none{cursor:default;color:var(--text-dim);font-size:12px}
.ds-matches .ds-none{font-style:italic}
.ds-matches .ds-none:hover{background:transparent}

.ds-search-box{position:relative}
.ds-search-box .inp{padding-right:32px}
.ds-search-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--text-dim);font-size:18px;cursor:pointer;padding:4px;line-height:1}
.ds-search-clear:hover{color:var(--text-primary)}
main.dino-stats .ds-search-field{position:relative;margin-bottom:0}

.ds-params-row{display:flex;flex-wrap:wrap;gap:10px 16px;margin-bottom:12px;align-items:flex-end}
.ds-param{flex:1 1 120px;margin-bottom:0}
.ds-param-level{flex:0 0 120px}
.ds-imp-row{display:flex;gap:8px;align-items:center}
.ds-imp-row .inp:first-child{flex:1;min-width:72px}
#ds-imp-num-wrap{display:flex;gap:8px;align-items:center;min-width:0}
#ds-imp-num-wrap[hidden]{display:none !important}
.ds-bonded-sel{flex:0 0 auto;width:auto;min-width:150px}

.ds-points{margin:8px 0 18px}
.ds-stat{display:grid;grid-template-columns:88px repeat(3,minmax(0,1fr)) 36px;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--border);min-width:0}
.ds-stat:last-child{border-bottom:0}
.ds-stat-head{border-bottom:1px solid var(--border-strong);padding-bottom:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim)}
.ds-stat-name{font-size:13.5px;color:var(--text-primary);font-weight:500;min-width:0}
.ds-points[data-mode="wild"] .ds-col-mut,
.ds-points[data-mode="wild"] .ds-col-dom{display:none}
.ds-points[data-mut="off"] .ds-col-mut{display:none}
.ds-points[data-input="points"] .ds-col-lock{display:none}
.ds-points[data-input="points"] .ds-stat{grid-template-columns:88px repeat(3,minmax(0,1fr))}
.ds-points[data-input="points"][data-mut="off"] .ds-stat{grid-template-columns:88px repeat(2,minmax(0,1fr))}
.ds-points[data-mode="wild"][data-input="points"] .ds-stat{grid-template-columns:88px minmax(0,1fr)}
.ds-col-val{display:none;flex-direction:column;align-items:stretch;gap:4px;min-width:0}
.ds-points[data-input="points"] .ds-col-val{display:none}
.ds-points[data-input="values"] .ds-col-val{display:flex;flex-wrap:nowrap;align-items:stretch}
.ds-val-line{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;min-width:0;width:100%}
.ds-points[data-input="values"] .ds-val-line{min-height:42px}
.ds-points[data-input="values"] .ds-val-line .inp{height:42px;box-sizing:border-box}
.ds-points[data-input="values"] .ds-col-wild,
.ds-points[data-input="values"] .ds-col-dom{display:none}
.ds-points[data-input="values"] .ds-stat{grid-template-columns:88px minmax(0,1fr) 36px}
.ds-points[data-input="values"][data-mut="on"] .ds-stat{grid-template-columns:88px minmax(0,1fr) minmax(64px,0.45fr) 36px}
.ds-points[data-input="values"][data-mode="wild"] .ds-stat{grid-template-columns:88px minmax(0,1fr) 36px}
.ds-points[data-input="values"] .ds-col-wild button,
.ds-points[data-input="values"] .ds-col-dom button,
.ds-points[data-input="values"] .ds-col-mut button{display:none}
.ds-points[data-input="values"] .ds-col-mut{min-width:64px}
.ds-points[data-input="values"] .ds-col-mut .inp{min-width:64px}
.ds-points[data-input="values"] .ds-col-mut .ds-cell-label{display:none}
.ds-col-val .inp,.ds-val-line .inp{flex:1 1 0;min-width:0}
.ds-col-val .ds-unit,.ds-val-line .ds-unit{flex:none}
.ds-stat-answer{flex:none;display:flex;flex-wrap:wrap;column-gap:0.35em;row-gap:0;width:100%;min-width:0;margin:0;font-size:11.5px;color:var(--text-secondary);line-height:1.4;font-variant-numeric:tabular-nums;overflow-wrap:normal;word-break:normal}
.ds-stat-answer[hidden]{display:none !important}
.ds-ans-keep{white-space:nowrap}
.ds-step{display:flex;gap:4px;align-items:center;min-width:0}
.ds-cell-label{display:none}
.ds-step .inp{flex:1;min-width:0;width:100%;padding:8px 4px;text-align:center}
.ds-step button{width:36px;height:40px;flex:none;background:var(--bg-card);border:1px solid var(--border-strong);color:var(--text-secondary);border-radius:10px;font-size:18px;cursor:pointer}
.ds-step button:hover{color:var(--cyan);border-color:var(--cyan-dim)}
.is-unverified{opacity:.5}
.btn-ghost{background:none;border:1px solid transparent;color:var(--text-dim);border-radius:8px;padding:4px 6px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.btn-ghost:hover{color:var(--text-secondary);border-color:var(--border)}
.btn-ghost[aria-pressed="true"]{color:var(--cyan-ink);background:var(--cyan);border-color:var(--cyan)}
.ds-col-lock{flex:none}
.ds-stat-torpor .ds-torpor-val{grid-column:2/-1;display:flex;align-items:center;gap:8px;min-width:0}
.ds-points[data-input="values"] .ds-stat-torpor{grid-template-columns:88px minmax(0,1fr)}
.ds-torpor-display{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:14px;color:var(--text-secondary)}
.ds-points[data-input="values"] .ds-torpor-display{display:none}
.ds-points[data-input="points"] .ds-torpor-inp{display:none}
.ds-torpor-inp{flex:1;min-width:0}

.ds-mut-switch{margin:0 0 12px}
.ds-mut-switch[hidden]{display:none !important}
.ds-switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:13.5px;color:var(--text-primary);line-height:1.3}
.ds-switch input{appearance:none;-webkit-appearance:none;flex:none;width:40px;height:24px;margin:0;padding:0;border-radius:999px;background:var(--border-strong);border:1px solid var(--border-strong);position:relative;cursor:pointer}
.ds-switch input::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--text-primary)}
.ds-switch input:checked{background:var(--cyan);border-color:var(--cyan)}
.ds-switch input:checked::after{left:20px;background:var(--cyan-ink)}
#ds-mut-clear-note{margin-top:6px}
#ds-mut-clear-note[hidden]{display:none !important}
#ds-mut-total-field[hidden]{display:none !important}

.ds-torpid-note{font-size:12px;line-height:1.5;margin:6px 0 0;color:var(--text-secondary)}
.ds-torpid-note.is-warn{color:var(--amber)}
.ds-limit-note{font-size:12px;line-height:1.5;margin:12px 0 0;color:var(--text-dim);font-style:italic}
.ds-split-assume-note{font-size:12px;line-height:1.5;margin:8px 0 0;color:var(--amber)}
.ds-split-assume-note[hidden]{display:none !important}

.ds-te-row{display:flex;gap:10px;align-items:center}
.ds-te-row input[type="range"]{flex:1 1 120px;min-width:120px;accent-color:var(--cyan)}
.ds-te-row .inp{min-width:72px;width:auto;flex:0 0 auto}
.ds-unit{font-family:var(--font-mono);font-size:12px;color:var(--text-dim)}
.ds-levels{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.ds-levels .field,.ds-te-details .btn-secondary{margin-top:8px}

.ds-te-details{margin:8px 0 16px;border:1px solid var(--border);border-radius:12px;padding:10px 14px 12px;background:var(--bg-card)}
.ds-te-details > summary{cursor:pointer;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);list-style:none}
.ds-te-details > summary::-webkit-details-marker{display:none}
.ds-te-details[open] > summary{margin-bottom:12px}

.card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px 14px}
.ds-mult-wrap{margin:8px 0 18px;border:1px solid var(--border);border-radius:12px;padding:10px 14px 12px;background:var(--bg-card)}
.ds-mult-wrap > summary{cursor:pointer;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);list-style:none}
.ds-mult-wrap > summary::-webkit-details-marker{display:none}
.ds-mult-wrap[open] > summary{margin-bottom:12px}
.ds-mult-wrap .ds-mult{padding:0;border:0;background:transparent}
.ds-mult.is-locked{opacity:.7}
.ds-imp-scale{margin-bottom:10px}
.ds-fill-plan{margin-top:8px;height:32px;padding:0 12px;font-size:12px}
.ds-fill-plan[hidden]{display:none !important}
#ds-values-extra{margin:0 0 16px}
.ds-solve{font-size:13px;color:var(--text-secondary);margin:0 0 12px;line-height:1.5}
.ds-solve.is-ok{color:var(--green)}
.ds-solve.is-bad{color:var(--red)}
.ds-cands{margin:0 0 16px;padding:0;min-width:0;max-width:100%}
.ds-cands[hidden]{display:none !important}
.ds-cands-host{position:relative;max-width:100%;min-width:0}
.ds-cands-host.is-more::after{content:'';position:absolute;top:0;right:0;bottom:0;width:32px;pointer-events:none;background:linear-gradient(to right,rgba(10,10,15,0),var(--bg-deep));z-index:2}
.ds-cands-scroll{position:relative;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;color-scheme:dark;scrollbar-color:var(--border-strong) var(--bg-card)} /* relative: absolute sr-only text in cells must be clipped by this box, not escape to the page */
.ds-cands-tbl{width:max-content;min-width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:11px;font-variant-numeric:tabular-nums}
.ds-cands-tbl th{font-size:10.5px;color:var(--text-dim);font-weight:500;text-align:left;padding:0 4px 8px 0;border-bottom:1px solid var(--border-strong);vertical-align:bottom}
.ds-cands-tbl td{padding:8px 4px 8px 0;border-bottom:1px solid var(--border);white-space:nowrap;color:var(--text-primary);vertical-align:middle}
.ds-cands-tbl th:first-child,.ds-cands-tbl td:first-child{padding-left:8px}
.ds-cands-tbl th:last-child,.ds-cands-tbl td:last-child{padding-right:8px}
.ds-cand-h{display:block;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.ds-cand-sub{display:block;margin-top:2px;font-size:8.5px;letter-spacing:0;text-transform:none;font-weight:400;color:var(--text-secondary);white-space:normal;line-height:1.25}
.ds-cand-use{font-family:var(--font-body);font-size:11px;font-weight:600;color:var(--text-secondary);text-align:left;white-space:nowrap}
.ds-cand-use::after{content:' \203A';font-weight:700}
.ds-cand-use-h,.ds-cand-te-h,.ds-cand-fits-h{white-space:normal;letter-spacing:0;text-transform:none;font-size:10.5px}
.ds-cand-use-h,.ds-cands-tbl td.ds-cand-use,
.ds-cand-te-h,.ds-cands-tbl td.ds-cand-te,
.ds-cand-fits-h,.ds-cands-tbl td.ds-cand-fits{width:1%}
.ds-cand-fits-h{max-width:4.8em}
.ds-cand-key{font-size:11px;color:var(--text-secondary);margin:8px 0 0;line-height:1.4}
@media(min-width:861px){
  .ds-cands-tbl{width:100%}
}
.ds-cand-row{position:relative;cursor:pointer}
.ds-cand-row:hover,.ds-cand-row:focus-within{background:var(--bg-card-hover)}
.ds-cand-row:hover .ds-cand-use,.ds-cand-row:focus-within .ds-cand-use{color:var(--cyan)}
.ds-cand-hit{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;color:transparent;font-size:0;cursor:pointer}
.ds-cand-hit:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}
.ds-solve:focus{outline:none}
.ds-solve:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.ds-cands .ds-show-all{display:block;width:100%;margin:8px 0 0;padding:10px 12px;background:var(--bg-card);border:1px solid var(--border-strong);border-radius:10px;font-family:var(--font-body);font-size:12px;font-weight:600;text-align:center;color:var(--text-primary);cursor:pointer}
.ds-cands .ds-show-all:hover{border-color:var(--cyan-dim);color:var(--cyan)}
.ds-tb-tag{display:block;font-family:var(--font-body);font-size:11px;color:var(--text-secondary);margin-top:4px}
main.dino-stats[data-input="values"] #ds-te{display:none}
main.dino-stats[data-input="points"] #ds-te-blank-hint{display:none !important}
.tscroll{overflow-x:auto}
.ds-tbl{width:100%;border-collapse:collapse;font-size:14px}
.ds-tbl th{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);font-weight:500;text-align:left;padding:0 12px 10px 0;border-bottom:1px solid var(--border-strong);white-space:nowrap}
.ds-tbl td{padding:9px 12px 9px 0;border-bottom:1px solid var(--border);vertical-align:middle}
.ds-tbl td:last-child,.ds-tbl th:last-child{padding-right:0}
.ds-tbl-mult .inp{padding:7px 8px;font-size:12px;border-radius:8px}
.ds-tbl .ds-v,.ds-tbl .ds-split,.ds-level{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.ds-v{font-size:16px;font-weight:600;color:var(--text-primary)}
.ds-split{color:var(--text-secondary);font-size:12px;white-space:normal;overflow-wrap:anywhere}
@media(max-width:640px){
  .ds-split{white-space:normal;overflow-wrap:anywhere}
  .ds-points[data-input="points"] .ds-stat{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:4px 8px;
    padding:6px 0;
    align-items:end;
  }
  /* Same (0,4,0) as the desktop mut-off rule, later in this query so Wild/Dom are equal columns. */
  .ds-points[data-input="points"][data-mut="off"] .ds-stat{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .ds-points[data-input="points"][data-mut="on"] .ds-stat{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:4px 6px;
  }
  .ds-points[data-mode="wild"][data-input="points"] .ds-stat{
    grid-template-columns:minmax(0,1fr);
  }
  .ds-points[data-input="points"] .ds-stat-name{
    grid-column:1/-1;
    font-size:12.5px;
    line-height:1.2;
  }
  .ds-points[data-input="points"] .ds-stat-head{
    display:grid;
    padding:0 0 4px;
  }
  .ds-points[data-input="points"] .ds-stat-head .ds-stat-name{display:none}
  .ds-points[data-input="points"] .ds-cell-label{display:none}
  .ds-points[data-input="points"] .ds-step{
    flex-wrap:nowrap;
    gap:2px;
    min-width:0;
    width:100%;
  }
  .ds-points[data-input="points"] .ds-step button{
    width:36px;
    height:36px;
    flex:0 0 36px;
    padding:0;
    font-size:16px;
    border-radius:8px;
  }
  .ds-points[data-input="points"] .ds-step .inp{
    flex:1 1 0;
    min-width:calc(3ch + 4px);
    width:auto;
    padding:4px 0;
    height:36px;
    font-size:14px;
  }
  .ds-points[data-input="points"] .ds-stat-torpor,
  .ds-points[data-mode="wild"][data-input="points"] .ds-stat-torpor{
    grid-template-columns:minmax(0,1fr);
  }
  .ds-points[data-input="points"] .ds-stat-torpor .ds-stat-name,
  .ds-points[data-input="points"] .ds-stat-torpor .ds-torpor-val,
  .ds-points[data-input="points"] .ds-stat-note{grid-column:1/-1}
}
.ds-split.is-bad{color:var(--red)}
.ds-k{color:var(--text-primary)}
.is-torpor .ds-v{color:var(--text-secondary);font-weight:500}

.results{background:var(--bg-card);border:1px solid var(--border-strong);border-radius:16px;padding:6px 20px 16px;scroll-margin-top:76px}
.results h3{padding:14px 0 6px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);border-bottom:1px solid var(--border);margin:0;font-weight:600}
.ds-level{margin:12px 0 8px;font-size:13px;color:var(--text-secondary)}
.results .empty{color:var(--text-secondary);font-size:13px;font-style:italic;display:block;padding:12px 0}
.ds-rail-actions{display:grid;gap:8px;margin-top:14px}
.results .btn-secondary{margin-top:0;width:100%;box-sizing:border-box;justify-content:center}

.ds-how-works{margin:0 0 16px;border:1px solid var(--border);border-radius:12px;padding:10px 14px 12px;background:var(--bg-card)}
.ds-how-works > summary{cursor:pointer;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);list-style:none}
.ds-how-works > summary::-webkit-details-marker{display:none}
.ds-how-works > summary .ds-how-chevron{display:inline-block;margin-left:6px;font-size:11px;font-weight:400;line-height:1;vertical-align:middle;transition:transform .15s ease}
.ds-how-works > summary .ds-how-chevron::before{content:'\25BE';content:'\25BE' / ''}
.ds-how-works[open] > summary{margin-bottom:10px}
.ds-how-works[open] > summary .ds-how-chevron{transform:rotate(180deg)}
.ds-how-works .qnote{margin:0 0 8px;max-width:62ch;color:var(--text-secondary)}
.ds-how-works .qnote:last-child{margin-bottom:0}
#ds-lock-legend[hidden],
#ds-extra-tame-note[hidden]{display:none !important}

#ds-mini,.ds-mini{display:none}

#ds-unverified{color:var(--amber);border-color:rgba(227,182,94,0.4)}

@media(max-width:860px){
  html:has(#ds-mini.is-shown){scroll-padding-bottom:56px}
  main.dino-stats{padding-bottom:48px}
  main.dino-stats.is-mini-shown{padding-bottom:88px}
  main.dino-stats .page{grid-template-columns:1fr;grid-template-areas:"hdr" "rail-top" "content" "rail-bottom" "advanced";grid-template-rows:none;gap:16px 0}
  main.dino-stats .rail{display:contents}
  main.dino-stats .rail-top,
  main.dino-stats .rail-bottom{display:grid;gap:12px}
  main.dino-stats .rail-top{grid-area:rail-top}
  main.dino-stats .rail-bottom{grid-area:rail-bottom}
  main.dino-stats .portrait,
  main.dino-stats .selcard,
  main.dino-stats .ds-data-details,
  main.dino-stats .ds-abilities,
  main.dino-stats .ds-search-field,
  main.dino-stats .results{order:unset}
  main.dino-stats .content{padding-top:0}
  .ds-points[data-input="values"] .ds-stat{grid-template-columns:minmax(64px,88px) minmax(0,1fr) 36px}
  .ds-points[data-input="values"][data-mut="on"] .ds-stat{grid-template-columns:minmax(56px,72px) minmax(0,1fr) minmax(64px,72px) 36px}
  .ds-points[data-input="values"] .ds-stat-torpor,
  .ds-points[data-input="values"][data-mut="on"] .ds-stat-torpor{grid-template-columns:minmax(64px,88px) minmax(0,1fr)}
  .ds-points[data-input="values"] .ds-stat-head{display:none}
  .ds-points[data-input="values"][data-mut="on"] .ds-stat-head{display:grid;padding:0 0 4px}
  .ds-stat-name{font-weight:600}
  .ds-stat{position:relative}
  .ds-points[data-input="values"] .ds-col-lock{position:static}
  .ds-points[data-input="values"] .ds-stat-torpor .ds-torpor-val{grid-column:2/-1}
  .ds-points[data-input="values"] .ds-col-mut{flex-wrap:nowrap}
  .ds-points[data-input="values"] .ds-col-mut .ds-cell-label{display:none}
  #ds-mini,.ds-mini{display:none;align-items:center;justify-content:center;position:fixed;left:0;right:0;bottom:0;z-index:90;width:auto;box-sizing:border-box;margin:0;padding:12px 16px;border:0;border-top:1px solid var(--border-strong);border-radius:0;background:var(--bg-card);color:var(--text-primary);font-family:var(--font-mono);font-size:12.5px;font-variant-numeric:tabular-nums;cursor:pointer;text-align:center}
  #ds-mini.is-shown,.ds-mini.is-shown{display:flex}
  #ds-mini:hover,.ds-mini:hover{color:var(--cyan)}
}
@media(max-width:400px){
  #ds-mini.is-shown,.ds-mini.is-shown{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:520px){
  .ds-hero h1{font-size:26px}
  .ds-levels{grid-template-columns:1fr}
  .ds-te-row{flex-wrap:wrap}
}
main.dino-stats{--red:var(--tier-alpha)}
.ds-stat.is-over{border:1px solid var(--red);border-radius:10px;padding:8px;margin:4px 0}
.ds-stat-note{grid-column:1/-1;font-size:11.5px;color:var(--amber);margin:2px 0 0;line-height:1.4}
.ds-stat-note[hidden]{display:none !important}
.ds-dom-cap-note{font-size:12px;color:var(--red);margin:8px 0 0;line-height:1.5}
.ds-dom-cap-note[hidden]{display:none !important}
#ds-extract-hint{max-width:62ch}
#ds-extract-hint[hidden]{display:none !important}
#ds-te-blank-hint{display:none !important}
#ds-te-bred{margin:0;font-size:12px;color:var(--text-secondary);line-height:1.4}
#ds-te-bred[hidden]{display:none !important}
#ds-level-out{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:14px;color:var(--text-primary);padding:11px 13px;background:var(--bg-card);border:1px solid var(--border-strong);border-radius:10px;margin:0;opacity:.55;line-height:1.2}
#ds-level-out[hidden],
#ds-level-in[hidden],
#ds-level-note[hidden]{display:none !important}
.ds-param-level label[hidden],
.ds-param-te label[hidden],
.ds-te-row[hidden]{display:none !important}
.ds-solve .ds-use-nearest{display:inline-block;width:auto;margin:8px 0 0;padding:6px 12px;font-size:12px}
.ds-solve .ds-use-nearest + span,
.ds-solve span + .ds-use-nearest{margin-left:8px}

.ds-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#ds-bonded-note[hidden]{display:none !important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
footer{margin-top:24px}

main.dino-stats .rail > *,
main.dino-stats .rail-top > *,
main.dino-stats .rail-bottom > *{min-width:0;max-width:100%}
main.dino-stats .rail .results{width:100%;box-sizing:border-box;overflow-x:hidden;min-width:0}
main.dino-stats .rail .results table{width:100%;table-layout:fixed}

@media(max-width:520px){ main.dino-stats .ds-imp-row{flex-wrap:wrap} main.dino-stats .ds-bonded-sel{min-width:0;flex:1 1 100%} main.dino-stats .ds-params-row .inp{min-width:0} }

/* Rail portrait: fixed 200px square, centered; params row: Level | TE | Imprint on one line at desktop. */
main.dino-stats .rail .portrait{width:200px;height:200px;max-width:200px;margin:0 auto;box-sizing:border-box}
/* Two-column layout: the portrait fills the rail width as a square and hosts the drag-to-spin turntable (.ds-spin, JS-loaded for species with a sheet). Phones keep the 200px static portrait. */
@media not all and (max-width:860px){main.dino-stats .rail .portrait{width:100%;height:auto;max-width:100%;aspect-ratio:1/1}}
main.dino-stats .portrait .ds-spin{position:absolute;inset:0;background-repeat:no-repeat;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
main.dino-stats .portrait .ds-spin.grabbing{cursor:grabbing}
main.dino-stats .portrait .ds-spin[hidden]{display:none !important}
/* Spinning: the img stays in the accessibility tree (opacity, not visibility). Sheet loading on desktop: placeholder over the img so the dino first appears at spin size. */
main.dino-stats .portrait.is-spinning img,
main.dino-stats .portrait.is-spin-pending img{opacity:0}
main.dino-stats .portrait.is-spinning .ds-portrait-ph{visibility:hidden}
main.dino-stats .portrait.is-spin-pending .ds-portrait-ph{display:flex !important}
/* Spinning keeps the img rendered (at opacity 0) even while [hidden], i.e. before or without its own load, so the alt names the dino; a broken-image glyph stays invisible. Same specificity as img[hidden], later wins. */
main.dino-stats .portrait.is-spinning img{display:block !important}
main.dino-stats .ds-params-row{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end}
main.dino-stats .ds-param-level{flex:0 0 96px}
main.dino-stats .ds-param-te{flex:1 1 200px;min-width:200px}
main.dino-stats .ds-param-imp{flex:0 0 218px;min-width:218px}
main.dino-stats .ds-te-row .inp{width:90px;min-width:72px;flex:0 0 90px}
main.dino-stats .ds-imp-row .inp:first-child{width:72px;flex:0 0 72px}
main.dino-stats .ds-bonded-sel{flex:1 1 130px;min-width:130px}
main.dino-stats .ds-params-row .inp,
main.dino-stats .ds-params-row select{height:42px}
@media(max-width:520px){
  main.dino-stats .ds-params-row{flex-wrap:nowrap;gap:8px}
  main.dino-stats .ds-param-level{flex:0 0 56px;min-width:0}
  main.dino-stats .ds-param-te{flex:1 1 0;min-width:0}
  main.dino-stats .ds-param-imp{flex:1 1 0;min-width:0}
  main.dino-stats .ds-params-row > .field > label{white-space:normal;overflow-wrap:anywhere;letter-spacing:.02em}
  main.dino-stats .ds-te-row .inp{width:auto;min-width:0;flex:1 1 auto}
  main.dino-stats .ds-te-row{flex-wrap:nowrap}
}

/* Merge fixes: the rail wrappers are page-grid items and need min-width:0 so the results table cannot widen the phone column; the TE range keeps no intrinsic width so the unit sign stays inside the column. */
main.dino-stats .page,
main.dino-stats .content,
main.dino-stats .ds-main,
main.dino-stats #ds-points,
main.dino-stats #ds-cands,
main.dino-stats .ds-cands-host,
main.dino-stats .ds-cands-scroll,
main.dino-stats #ds-how-works,
main.dino-stats .rail-top,main.dino-stats .rail-bottom{min-width:0;max-width:100%}
main.dino-stats #ds-te{min-width:0;width:auto;flex:1 1 60px}
/* Phones: the level column sizes to its label ("Current level" in Extract mode) instead of a fixed 56px, so it cannot run into the TE label. */
@media(max-width:520px){ main.dino-stats .ds-param-level{flex:0 0 auto;min-width:56px} main.dino-stats .ds-param-level > label{white-space:nowrap} }

/* Extract: name, Mut, lock sit on the value-input line. Answer wraps under the value. */
.ds-points[data-input="values"] .ds-stat:not(.ds-stat-head){align-items:start}
.ds-points[data-input="values"] .ds-stat:not(.ds-stat-head) .ds-stat-name{display:flex;align-items:center;min-height:42px;line-height:1.2}
.ds-points[data-input="values"] .ds-stat:not(.ds-stat-head) .ds-col-mut{align-self:start;min-height:42px}
.ds-points[data-input="values"] .ds-col-mut .inp{height:42px;box-sizing:border-box;padding:8px 6px}
.ds-points[data-input="values"] button.ds-col-lock{width:36px;min-width:36px;height:42px;min-height:36px;box-sizing:border-box;padding:0;align-self:start}
.ds-points[data-input="values"] .ds-stat-head{align-items:end}
.ds-points[data-input="values"] .ds-stat-head > *{min-height:0;align-self:end;font-size:inherit;font-weight:400;color:inherit;letter-spacing:inherit;text-transform:inherit;line-height:1}
.ds-points[data-input="values"] .ds-stat-head .ds-stat-name{font-size:inherit;font-weight:inherit;color:inherit;display:block}
.ds-points[data-input="values"] .ds-stat-head .ds-col-val{display:block}
.ds-points[data-input="values"][data-mut="on"] .ds-stat-head .ds-col-mut{display:flex;align-items:flex-end;justify-content:center;text-align:center;min-height:0;min-width:0}

/* Rail result table: td stays a table-cell; wrap only between nowrap point groups. */
.results .ds-tbl col.ds-rail-col-stat{width:22%}
.results .ds-tbl col.ds-rail-col-val{width:32%}
.results .ds-tbl col.ds-rail-col-pts{width:46%}
.results .ds-tbl th{white-space:nowrap;overflow-wrap:normal;word-break:normal}
.results .ds-tbl td{overflow-wrap:normal;word-break:normal;vertical-align:middle}
.results .ds-v{white-space:nowrap;overflow-wrap:normal;word-break:normal;padding-right:12px}
.results .ds-split{display:table-cell;vertical-align:middle;white-space:normal;overflow-wrap:normal;word-break:normal}
.results .ds-split-wrap{display:inline-flex;flex-wrap:wrap;align-items:center;column-gap:0.35em;row-gap:0;max-width:100%;min-width:0;vertical-align:middle}
.ds-split-keep{white-space:nowrap}

@media(max-width:860px){
  label.ds-switch{min-height:36px}
  .ds-switch input{width:52px;height:36px}
  .ds-switch input::after{top:4px;left:4px;width:26px;height:26px}
  .ds-switch input:checked::after{left:22px}
}

/* 360px Tamed Plan: Bonded stacks under Level/TE so the TE label cannot run into the note. */
@media(max-width:400px){
  main.dino-stats .ds-params-row{flex-wrap:wrap}
  main.dino-stats .ds-param-imp{flex:1 1 100%;min-width:0}
  .ds-points[data-input="points"][data-mut="on"] .ds-step{gap:0;max-width:100%;width:100%;min-width:0;box-sizing:border-box}
  .ds-points[data-input="points"][data-mut="on"] .ds-step button{width:36px;min-width:36px;max-width:36px;flex:0 0 36px;box-sizing:border-box}
  .ds-points[data-input="points"][data-mut="on"] .ds-step .inp{flex:1 1 0;min-width:3.5ch;width:auto;max-width:100%;padding:4px 1px;font-size:13px;box-sizing:border-box}
}
@media(max-width:340px){
  .ds-points[data-input="points"][data-mut="on"] .ds-stat:not(.ds-stat-torpor){grid-template-columns:repeat(2,minmax(0,1fr))}
  /* 8ch must use the value input's monospace 14px, not the row's body font,
     and must cover the input's horizontal padding + border. */
  .ds-points[data-input="values"][data-mut="on"] .ds-stat:not(.ds-stat-torpor){
    font-family:var(--font-mono);
    font-size:14px;
    grid-template-columns:minmax(56px,72px) minmax(calc(8ch + 10px),1fr) minmax(0,56px) 36px;
  }
  .ds-points[data-input="values"][data-mut="on"] .ds-stat-name{font-family:var(--font-body);font-size:13.5px}
  .ds-points[data-input="values"][data-mut="on"] .ds-stat-head{font-size:11px}
  .ds-points[data-input="values"][data-mut="on"] .ds-stat-answer{font-family:var(--font-body);font-size:11.5px}
  .ds-points[data-input="values"][data-mut="on"] .ds-val-line .inp{padding-left:4px;padding-right:4px;box-sizing:border-box}
  .ds-points[data-input="values"][data-mut="on"] .ds-col-mut{min-width:0;max-width:56px;width:56px}
  .ds-points[data-input="values"][data-mut="on"] .ds-col-mut .inp{min-width:0;max-width:56px;width:100%;box-sizing:border-box}
}
