/* Saved layout 2026-09-06 12:53:14. Original JSON is preserved.
   Header regions retain explicit relative coordinates; the short comment remains in normal flow so long content can expand all six cards equally. */
#score-grid{
 --frame-h:80px;
 --gap-x:6px;
 --gap-y:6px;
 --bottom-padding:3px;
 --value-font:28px;
 --comment-font:11.5px;
 --unit-font:9px;
 --unit-w:22px;
 --unit-gap:3px;
 --comment-padding:9px;
 --font-total:14px;
 --font-popularity:13px;
 --font-scarcity:13px;
 --font-price-growth:13px;
 --font-liquidity:13px;
 --font-psa10-premium:11.5px;
 --name-x:45px;
 --name-y:5px;
 --name-w:57px;
 --name-h:33px;
 --icon-x:9px;
 --icon-y:5px;
 --icon-w:33px;
 --icon-h:33px;
 --value-x:10px;
 --value-y:44px;
 --value-w:84px;
 --value-h:30px;
 --comment-x:104px;
 --comment-y:12px;
 --comment-w:162px;
 --comment-h:64px;
 --comment-subtract:110px;
 --comment-line:1.3499999999999999;--name-line:1.2;--columns:1;--status-font:11px;
 --name-horizontal:center;--name-vertical:center;
 --value-horizontal:right;--value-vertical:center;
 --comment-horizontal:left;--comment-vertical:start;
 --number-columns:minmax(0,1fr) var(--unit-w);--number-rows:var(--number-line);--suffix-col:2;--suffix-row:1;--suffix-align:left;--suffix-gap:var(--unit-gap);--comment-border:1px solid #d6d6d0;
}

@media(min-width:375px){#score-grid{
 --frame-h:115px;
 --gap-x:6px;
 --gap-y:6px;
 --bottom-padding:clamp(0px,calc(182px + -46.6666667vw),7px);
 --value-font:24px;
 --comment-font:clamp(9.5px,calc(-3px + 3.3333333vw),10px);
 --unit-font:8px;
 --unit-w:42px;
 --unit-gap:0px;
 --comment-padding:0px;
 --font-total:11.5px;
 --font-popularity:12px;
 --font-scarcity:12px;
 --font-price-growth:10px;
 --font-liquidity:12px;
 --font-psa10-premium:clamp(9px,calc(22px + -3.3333333vw),9.5px);
 --name-x:clamp(2px,calc(28px + -6.6666667vw),3px);
 --name-y:clamp(33px,calc(-67px + 26.6666667vw),37px);
 --name-w:clamp(46px,calc(98px + -13.3333333vw),48px);
 --name-h:clamp(27px,calc(2px + 6.6666667vw),28px);
 --icon-x:clamp(9px,calc(113px + -26.6666667vw),13px);
 --icon-y:clamp(6px,calc(32px + -6.6666667vw),7px);
 --icon-w:clamp(27px,calc(-48px + 20vw),30px);
 --icon-h:clamp(27px,calc(-48px + 20vw),30px);
 --value-x:clamp(48px,calc(23px + 6.6666667vw),49px);
 --value-y:clamp(15px,calc(93px + -20vw),18px);
 --value-w:50px;
 --value-h:clamp(33px,calc(-292px + 86.6666667vw),46px);
 --comment-x:clamp(1px,calc(53px + -13.3333333vw),3px);
 --comment-y:clamp(66px,calc(16px + 13.3333333vw),68px);
 --comment-w:clamp(95px,calc(-80px + 46.6666667vw),102px);
 --comment-h:clamp(41px,calc(-84px + 33.3333333vw),46px);
 --comment-subtract:clamp(4px,calc(56px + -13.3333333vw),6px);
 --comment-line:1.25;--name-line:1.2;--columns:3;--status-font:11px;
 --name-horizontal:center;--name-vertical:center;
 --value-horizontal:center;--value-vertical:start;
 --comment-horizontal:left;--comment-vertical:start;
 --number-columns:minmax(0,1fr);--number-rows:var(--number-line) calc(var(--unit-font)*1.2);--suffix-col:1;--suffix-row:2;--suffix-align:center;--suffix-gap:0px;--comment-border:0;
}
}
@media(min-width:390px){#score-grid{
 --frame-h:115px;
 --gap-x:6px;
 --gap-y:6px;
 --bottom-padding:0px;
 --value-font:24px;
 --comment-font:10px;
 --unit-font:8px;
 --unit-w:42px;
 --unit-gap:0px;
 --comment-padding:0px;
 --font-total:11.5px;
 --font-popularity:12px;
 --font-scarcity:12px;
 --font-price-growth:10px;
 --font-liquidity:12px;
 --font-psa10-premium:9px;
 --name-x:2px;
 --name-y:37px;
 --name-w:46px;
 --name-h:28px;
 --icon-x:9px;
 --icon-y:6px;
 --icon-w:30px;
 --icon-h:30px;
 --value-x:49px;
 --value-y:15px;
 --value-w:50px;
 --value-h:46px;
 --comment-x:1px;
 --comment-y:68px;
 --comment-w:102px;
 --comment-h:46px;
 --comment-subtract:4px;
 --comment-line:1.25;--name-line:1.2;--columns:3;--status-font:11px;
 --name-horizontal:center;--name-vertical:center;
 --value-horizontal:center;--value-vertical:start;
 --comment-horizontal:left;--comment-vertical:start;
 --number-columns:minmax(0,1fr);--number-rows:var(--number-line) calc(var(--unit-font)*1.2);--suffix-col:1;--suffix-row:2;--suffix-align:center;--suffix-gap:0px;--comment-border:0;
}
}
@media(min-width:768px){#score-grid{
 --frame-h:clamp(109px,calc(167px + -5.6640625vw),123.5px);
 --gap-x:12px;
 --gap-y:12px;
 --bottom-padding:clamp(6.5px,calc(-4px + 1.3671875vw),10px);
 --value-font:clamp(28px,calc(11.5px + 2.1484375vw),33.5px);
 --comment-font:13px;
 --unit-font:clamp(9px,calc(3px + 0.78125vw),11px);
 --unit-w:clamp(22px,calc(10px + 1.5625vw),26px);
 --unit-gap:clamp(3px,calc(0px + 0.390625vw),4px);
 --comment-padding:0px;
 --font-total:clamp(13px,calc(-8px + 2.734375vw),20px);
 --font-popularity:clamp(13px,calc(-8px + 2.734375vw),20px);
 --font-scarcity:clamp(13px,calc(-8px + 2.734375vw),20px);
 --font-price-growth:clamp(13px,calc(7px + 0.78125vw),15px);
 --font-liquidity:clamp(13px,calc(-8px + 2.734375vw),20px);
 --font-psa10-premium:clamp(13px,calc(4px + 1.171875vw),16px);
 --name-x:clamp(51px,calc(0px + 6.640625vw),68px);
 --name-y:clamp(12px,calc(16px + -0.390625vw),13px);
 --name-w:clamp(65px,calc(-85px + 19.53125vw),115px);
 --name-h:clamp(33px,calc(18px + 1.953125vw),38px);
 --icon-x:clamp(9px,calc(-9px + 2.34375vw),15px);
 --icon-y:clamp(9px,calc(3px + 0.78125vw),11px);
 --icon-w:clamp(40px,calc(28px + 1.5625vw),44px);
 --icon-h:clamp(40px,calc(28px + 1.5625vw),44px);
 --value-x:clamp(118px,calc(-86px + 26.5625vw),186px);
 --value-y:clamp(12px,calc(9px + 0.390625vw),13px);
 --value-w:clamp(78px,calc(18px + 7.8125vw),98px);
 --value-h:clamp(33px,calc(18px + 1.953125vw),38px);
 --comment-x:clamp(8px,calc(-13px + 2.734375vw),15px);
 --comment-y:clamp(57px,calc(51px + 0.78125vw),59px);
 --comment-w:clamp(204px,calc(4.03125px + 26.0375977vw),270.65625px);
 --comment-h:clamp(39px,calc(119px + -7.8125vw),59px);
 --comment-subtract:clamp(9.328125px,calc(-46.6875px + 7.2937012vw),28px);
 --comment-line:1.5;--name-line:1.25;--columns:3;--status-font:13px;
 --name-horizontal:center;--name-vertical:center;
 --value-horizontal:right;--value-vertical:start;
 --comment-horizontal:left;--comment-vertical:start;
 --number-columns:minmax(0,1fr) var(--unit-w);--number-rows:var(--number-line);--suffix-col:2;--suffix-row:1;--suffix-align:left;--suffix-gap:var(--unit-gap);--comment-border:0;
}
}
@media(min-width:1024px){#score-grid{
 --frame-h:109px;
 --gap-x:12px;
 --gap-y:12px;
 --bottom-padding:clamp(1px,calc(46px + -3.515625vw),10px);
 --value-font:clamp(33.5px,calc(7.5px + 2.5390625vw),40px);
 --comment-font:clamp(13px,calc(9px + 0.390625vw),14px);
 --unit-font:11px;
 --unit-w:26px;
 --unit-gap:4px;
 --comment-padding:0px;
 --font-total:clamp(20px,calc(4px + 1.5625vw),24px);
 --font-popularity:clamp(20px,calc(4px + 1.5625vw),24px);
 --font-scarcity:clamp(20px,calc(4px + 1.5625vw),24px);
 --font-price-growth:clamp(15px,calc(-5px + 1.953125vw),20px);
 --font-liquidity:clamp(20px,calc(4px + 1.5625vw),24px);
 --font-psa10-premium:clamp(16px,calc(0px + 1.5625vw),20px);
 --name-x:clamp(65px,calc(80px + -1.171875vw),68px);
 --name-y:clamp(4px,calc(44px + -3.125vw),12px);
 --name-w:clamp(100px,calc(175px + -5.859375vw),115px);
 --name-h:clamp(38px,calc(-26px + 6.25vw),54px);
 --icon-x:clamp(13px,calc(23px + -0.78125vw),15px);
 --icon-y:clamp(5px,calc(35px + -2.34375vw),11px);
 --icon-w:clamp(44px,calc(32px + 1.171875vw),47px);
 --icon-h:clamp(44px,calc(32px + 1.171875vw),47px);
 --value-x:clamp(173px,calc(238px + -5.078125vw),186px);
 --value-y:clamp(9px,calc(29px + -1.5625vw),13px);
 --value-w:clamp(96px,calc(106px + -0.78125vw),98px);
 --value-h:clamp(38px,calc(26px + 1.171875vw),41px);
 --comment-x:clamp(9px,calc(39px + -2.34375vw),15px);
 --comment-y:clamp(59px,calc(51px + 0.78125vw),61px);
 --comment-w:clamp(270.65625px,calc(-46.71875px + 30.9936523vw),350px);
 --comment-h:clamp(39px,calc(11px + 2.734375vw),46px);
 --comment-subtract:clamp(23.328125px,calc(46.6875px + -1.8249512vw),28px);
 --comment-line:1.5;--name-line:1.25;--columns:3;--status-font:13px;
 --name-horizontal:center;--name-vertical:center;
 --value-horizontal:center;--value-vertical:center;
 --comment-horizontal:left;--comment-vertical:start;
 --number-columns:minmax(0,1fr) var(--unit-w);--number-rows:var(--number-line);--suffix-col:2;--suffix-row:1;--suffix-align:left;--suffix-gap:var(--unit-gap);--comment-border:0;
}
}
@media(min-width:1280px){#score-grid{
 --frame-h:109px;
 --gap-x:12px;
 --gap-y:12px;
 --bottom-padding:1px;
 --value-font:40px;
 --comment-font:14px;
 --unit-font:11px;
 --unit-w:26px;
 --unit-gap:4px;
 --comment-padding:0px;
 --font-total:24px;
 --font-popularity:24px;
 --font-scarcity:24px;
 --font-price-growth:20px;
 --font-liquidity:24px;
 --font-psa10-premium:20px;
 --name-x:65px;
 --name-y:4px;
 --name-w:100px;
 --name-h:54px;
 --icon-x:13px;
 --icon-y:5px;
 --icon-w:47px;
 --icon-h:47px;
 --value-x:173px;
 --value-y:9px;
 --value-w:96px;
 --value-h:41px;
 --comment-x:9px;
 --comment-y:61px;
 --comment-w:350px;
 --comment-h:46px;
 --comment-subtract:23.328125px;
 --comment-line:1.5;--name-line:1.25;--columns:3;--status-font:13px;
 --name-horizontal:center;--name-vertical:center;
 --value-horizontal:left;--value-vertical:center;
 --comment-horizontal:left;--comment-vertical:start;
 --number-columns:minmax(0,1fr) var(--unit-w);--number-rows:var(--number-line);--suffix-col:2;--suffix-row:1;--suffix-align:left;--suffix-gap:var(--unit-gap);--comment-border:0;
}
}
#score-grid{display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));grid-template-rows:none;grid-auto-rows:1fr;gap:var(--gap-y) var(--gap-x);margin-top:8px}
#score-grid .score-card[data-parts]{display:flex;flex-direction:column;position:relative;align-items:stretch;min-width:0;min-height:var(--frame-h);height:auto;grid-column:auto;padding:0 0 var(--bottom-padding);margin:0;border:1px solid #d6d6d0;border-radius:4px;background:#fff}
#score-grid .score-card.total{background:#fafaf7;box-shadow:inset 0 2px #d6b500}
#score-grid .score-card>[data-region]{box-sizing:border-box;min-width:0;min-height:0;max-width:none;padding:0;margin:0}
#score-grid [data-region="name"],#score-grid [data-region="icon"],#score-grid [data-region="value"]{position:absolute}
#score-grid [data-region="name"]{left:calc(var(--name-x) - 1px);top:calc(var(--name-y) - 1px);width:var(--name-w);height:var(--name-h);display:flex;flex-direction:column;justify-content:var(--name-vertical);font-size:var(--font-total);font-weight:700;line-height:var(--name-line);text-align:var(--name-horizontal);white-space:normal}
#score-grid .total [data-region="name"]{font-size:var(--font-total)}
#score-grid [data-metric="popularity"] [data-region="name"]{font-size:var(--font-popularity)}
#score-grid [data-metric="scarcity"] [data-region="name"]{font-size:var(--font-scarcity)}
#score-grid [data-metric="price_growth"] [data-region="name"]{font-size:var(--font-price-growth)}
#score-grid [data-metric="liquidity"] [data-region="name"]{font-size:var(--font-liquidity)}
#score-grid [data-metric="psa10_premium"] [data-region="name"]{font-size:var(--font-psa10-premium)}
#score-grid .region-content{display:block;width:100%;flex-shrink:0}
#score-grid [data-region="name"]>.region-content>span{display:block;white-space:nowrap}
#score-grid .total [data-region="name"]>.region-content>span{display:inline}
#score-grid [data-region="icon"]{left:calc(var(--icon-x) - 1px);top:calc(var(--icon-y) - 1px);width:var(--icon-w);height:var(--icon-h);display:block}
#score-grid .metric-icon{display:block;width:100%;height:100%;max-width:none;margin:0;object-fit:contain}
#score-grid [data-region="value"]{--render-value-font:var(--value-font);--number-line:calc(var(--render-value-font)*1.05);left:calc(var(--value-x) - 1px);top:calc(var(--value-y) - 1px);width:var(--value-w);height:var(--value-h);display:grid;grid-template-columns:var(--number-columns);grid-template-rows:var(--number-rows);column-gap:var(--suffix-gap);row-gap:0;align-content:var(--value-vertical);align-items:baseline;font-size:var(--render-value-font);line-height:1.05;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:0;white-space:nowrap}
#score-grid [data-region="value"].unknown{--render-value-font:var(--status-font)}
#score-grid .score-value{grid-column:1;grid-row:1;font-size:inherit;line-height:inherit;text-align:var(--value-horizontal);white-space:nowrap;align-self:baseline}
#score-grid [data-region="value"] small{grid-column:var(--suffix-col);grid-row:var(--suffix-row);display:block;margin:0;font-size:var(--unit-font);font-weight:500;line-height:1.2;text-align:var(--suffix-align);white-space:nowrap}
#score-grid .score-card>[data-region="comment"]{position:relative;display:flex;flex-direction:column;justify-content:var(--comment-vertical);flex:1 0 auto;align-self:flex-start;margin:calc(var(--comment-y) - 1px) 0 0 calc(var(--comment-x) - 1px);width:calc(100% - var(--comment-subtract));height:auto;min-height:var(--comment-h);padding-left:var(--comment-padding);border:0;border-left:var(--comment-border);font-size:var(--comment-font);line-height:var(--comment-line);font-weight:400;color:#222;text-align:var(--comment-horizontal);overflow:visible}
#score-grid .score-card>.id-chip{top:-9px}
@media(max-width:374px){#score-grid .total{box-shadow:inset 2px 0 #d6b500}#score-grid .score-card>.id-chip{top:-10px}}
@media(min-width:768px){#score-grid{margin-top:12px}#score-grid .score-card>.id-chip{top:-7px}}

/* v1.16: total-score suffix sits beside the digits at mobile widths.
   Keep the original baseline, numeral size, five metric values and other regions.
   The total-only value area extends left; the suffix has its own 17px track. */
@media(min-width:375px) and (max-width:767.98px){
 #score-grid .score-card.total>[data-region="value"]{
  left:40px;width:60px;
  grid-template-columns:42px 17px;grid-template-rows:var(--number-line);column-gap:1px;
 }
 #score-grid .score-card.total .score-value{text-align:right}
 #score-grid .score-card.total [data-region="value"] small{grid-column:2;grid-row:1;text-align:left}
}

/* v1.17: saved user layout. Only 320px names and the 375px profile change. */
@media(max-width:374.98px){#score-grid{--name-x:43px;--name-y:7px;}}
@media(min-width:375px) and (max-width:389.98px){
 #score-grid{
  --name-x:clamp(1px,calc(-24px + 6.66667vw),2px);
  --name-y:clamp(37px,calc(63px + -6.66667vw),38px);
  --name-w:46px;
  --name-h:clamp(24px,calc(-76px + 26.6667vw),28px);
  --icon-x:9px;
  --icon-y:clamp(6px,calc(84px + -20vw),9px);
  --icon-w:clamp(27px,calc(-48px + 20vw),30px);
  --icon-h:clamp(27px,calc(-48px + 20vw),30px);
  --value-x:49px;
  --value-y:clamp(15px,calc(41px + -6.66667vw),16px);
  --value-w:50px;
  --value-h:clamp(33px,calc(-292px + 86.6667vw),46px);
  --font-total:clamp(11px,calc(-1.5px + 3.33333vw),11.5px);
  --font-popularity:12px;
  --font-scarcity:12px;
  --font-price-growth:10px;
  --font-liquidity:12px;
  --font-psa10-premium:clamp(9px,calc(22px + -3.33333vw),9.5px);
 }
 #score-grid .score-card.total>[data-region="value"]{
  left:calc(clamp(41px,calc(145px + -26.6667vw),45px) - 1px);
  top:calc(clamp(15px,calc(41px + -6.66667vw),16px) - 1px);
  width:clamp(57px,calc(-18px + 20vw),60px);
  height:clamp(27px,calc(-448px + 126.667vw),46px);
  grid-template-columns:clamp(39px,calc(-36px + 20vw),42px) 17px;grid-template-rows:var(--number-line);column-gap:1px;align-content:center;
 }
 #score-grid .score-card.total .score-value{text-align:center}
}

/* Local candidate: preserve the saved value region, font size and baseline.
   Size the numeral and denominator tracks from their actual text widths. */
@media(min-width:375px) and (max-width:767.98px){
  #score-grid .score-card.total>[data-region="value"]{
    grid-template-columns:max-content max-content;
    justify-content:end;
    column-gap:2px;
  }
}
