/* Card-free detail pages use the actual remaining viewport. The plate is
   contained in both dimensions; intrinsic text and QR rows never overlap. */
html:has(.page-detail){overscroll-behavior:none}
.page-detail{--gold:#ecc773;--text:#faf7ef;--muted:#c4bdb0;--red:#c51f2d;--detail-gap:clamp(6px,1.2vh,12px);display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100vh;height:100dvh;min-height:0;margin:0;background:radial-gradient(ellipse at 8% 0%,#322015 0%,transparent 50%),radial-gradient(ellipse at 100% 95%,#221217 0%,transparent 48%),#090a0c;font-size:14px;line-height:1.45;overscroll-behavior:none}
.page-detail .wrap{width:100%;max-width:1920px;padding-inline:clamp(8px,1vw,14px);min-width:0}
.page-detail .site-header{background:#0c0c0eeb;border-bottom:1px solid #ad814742}
.page-detail .detail-brand{display:flex;align-items:center;gap:8px;min-width:0;line-height:1}
.page-detail .logo-image{width:64px;height:36px;object-fit:contain;flex:none}
.page-detail .brand-name{font-family:'Kanit',sans-serif;font-size:clamp(23px,2.3vw,31px);font-weight:800;letter-spacing:-.045em;white-space:nowrap;line-height:1}
.page-detail .brand-name span{color:inherit;display:inline}
.page-detail .brand-name .brand-ma{color:#ffcf36;text-shadow:1px 1px #463018,-1px -1px #fff7cb,0 2px 8px #dfa42b55}
.page-detail .brand-name .brand-ha{color:#e33b3a;text-shadow:1px 1px #571316,-1px -1px #ffded4,0 2px 8px #e02a3455}
.page-detail .brand-name .brand-tabien{color:#fff9ef;text-shadow:1px 1px #9a3d19,-1px -1px #ffcc5f,0 2px 8px #eb9a4966}
.page-detail .brand-domain{color:#eecf93!important;font-weight:500;font-size:.7em;letter-spacing:-.03em}
.page-detail #main{display:grid;grid-template-rows:minmax(0,1fr);min-width:0;min-height:0;margin:0 auto;padding-block:6px}
.page-detail .plate-detail-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:var(--detail-gap) clamp(10px,2vw,26px);min-width:0;min-height:0;width:100%;height:100%;padding:clamp(4px,.8vw,12px);border:0;border-radius:0;background:none;box-shadow:none}
.page-detail .plate-showcase,.page-detail .plate-info,.page-detail .detail-contact{min-width:0;min-height:0}
.page-detail .plate-showcase{--photo-space:0px;grid-column:1;grid-row:1/3;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;padding:4px;align-self:stretch;border:0;background:none;box-shadow:none;container-type:size}
.page-detail .plate-showcase:has(.photo-action){--photo-space:26px}
.page-detail .plate-visual-wrap{display:flex;align-items:center;justify-content:center;flex:none;min-width:0;min-height:0;width:min(100%,calc((100cqh - var(--photo-space)) * 2.153846));height:auto;aspect-ratio:280/130;container-type:size}
.page-detail .plate-visual-wrap:has(.motorcycle){width:min(65%,calc((100cqh - var(--photo-space)) * 1.27907));aspect-ratio:55/43}
.page-detail .detail-plate-trigger{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0;cursor:zoom-in;border-radius:8px}
.page-detail .detail-plate-trigger:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.page-detail .plate-stage{padding:0;background:none;width:min(100%,calc(100cqh * 2.153846));max-width:100%;margin:auto;min-width:0}
.page-detail .plate{display:block;position:relative;container-type:inline-size;width:100%;aspect-ratio:280/130;border:3px solid #111;border-radius:8px;background-position:center;background-size:100% 100%;background-repeat:no-repeat;box-shadow:0 10px 22px #0009,inset 0 0 10px #fff6;overflow:hidden;margin:auto;color:#111}
.page-detail .plate-number{position:absolute;top:16%;left:50%;transform:translateX(-50%);width:92%;text-align:center;font-family:'Kanit',sans-serif;font-size:17cqi;font-weight:700;line-height:1;letter-spacing:.045em;white-space:nowrap;text-shadow:-.5px -1px #fff9,1px 1.5px #0009}
.page-detail .plate-province{position:absolute;bottom:14%;left:50%;transform:translateX(-50%) scaleX(.95);width:95%;text-align:center;font-family:'Mitr','Kanit',sans-serif;font-size:7.5cqi;font-weight:700;line-height:1;letter-spacing:.07em;white-space:nowrap;text-shadow:-.5px -1px #fff9,1px 1px #0009}
.page-detail .plate-stage:has(.motorcycle){width:100%}
.page-detail .plate.motorcycle{aspect-ratio:55/43;border:0}
.page-detail .motorcycle .plate-number{top:15%;line-height:1.5;white-space:normal}
.page-detail .motorcycle .plate-province{bottom:11%}
.page-detail .plate.motorcycle .plate-top{top:9%;font-size:16cqi;line-height:1.1;white-space:nowrap}
.page-detail .plate.motorcycle .plate-province{top:40%;bottom:auto;font-size:7.2cqi;line-height:1.1;letter-spacing:0;white-space:nowrap}
.page-detail .plate.motorcycle .plate-bottom{top:54%;font-size:18cqi;line-height:1.05;white-space:nowrap}
.page-detail .showcase-footer{display:flex;align-items:center;justify-content:center;margin:0;padding:0}
.page-detail .showcase-footer:empty{display:none}
.page-detail .photo-action{font-size:clamp(11px,1.7vh,15px);line-height:1.4;color:#f0cf8f;text-decoration:underline;text-underline-offset:3px}
.page-detail .plate-info{grid-column:2;grid-row:1;align-self:start}
.page-detail .detail-heading{display:flex;align-items:center;flex-wrap:wrap;gap:5px 10px;min-width:0}
.page-detail .plate-info h1{font-family:'Kanit',sans-serif;font-size:clamp(25px,min(3vw,4.4vh),44px);font-weight:600;line-height:1.3;letter-spacing:0;margin:0;white-space:nowrap}
.page-detail .detail-heading .badge{flex:none;font-size:clamp(9px,1.25vh,12px);letter-spacing:.04em;line-height:1.3;padding:4px 7px;border:1px solid #f27470;background:linear-gradient(130deg,#de3440,#a40f1e);white-space:nowrap}
.page-detail .detail-subtitle{font-size:clamp(13px,1.9vh,19px);color:#c5bcae;line-height:1.4;margin:4px 0 0}
.page-detail .price-block{border:0;border-bottom:1px solid #af844447;padding:0 0 6px;margin:7px 0}
.page-detail .price{display:flex;align-items:baseline;gap:.18em;font-family:'Prompt',sans-serif;font-size:clamp(30px,min(4vw,6.4vh),60px);font-weight:600;line-height:1.2;letter-spacing:-.045em;color:#f3cb75;white-space:nowrap}
.page-detail .price small{font-size:clamp(12px,1.9vh,20px);letter-spacing:0;font-weight:400;color:#ded2bd}
.page-detail .detail-facts{margin:0;display:grid;gap:clamp(3px,.65vh,7px)}
.page-detail .detail-facts>div{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:10px;font-size:clamp(14px,min(1.55vw,2.45vh),22px);line-height:1.4;min-width:0}
.page-detail .detail-facts dt{color:#b6ad9b;white-space:nowrap}
.page-detail .detail-facts dd{margin:0;color:#f2ede4;overflow-wrap:anywhere;min-width:0}
.page-detail .detail-facts .fact-sum dd{display:flex;align-items:center;gap:.4em;white-space:nowrap}
.page-detail .sum-value{flex:none}
.page-detail .plate-stars{display:inline-flex;align-items:center;flex:none;max-width:100%;font-family:Arial,sans-serif;font-size:.85em;line-height:1;letter-spacing:.025em;white-space:nowrap;color:#f1cc70;text-shadow:0 1px 5px #b7791933}
.page-detail .data-note{margin:6px 0 0;font-size:clamp(10px,1.5vh,15px);line-height:1.4;color:#bdb09c;overflow-wrap:anywhere}
.page-detail .detail-contact{grid-column:2;grid-row:2;display:grid;grid-template-columns:clamp(96px,18vh,186px) minmax(0,1fr);grid-template-rows:auto auto;gap:5px 14px;align-items:center;padding:0;border:0;background:radial-gradient(ellipse at 80% 45%,#c2944320,transparent 75%);box-shadow:none;text-align:left}
.page-detail .detail-contact h2{grid-column:2;grid-row:1;align-self:end;font-family:'Kanit',sans-serif;font-size:clamp(19px,3vh,31px);font-weight:600;line-height:1.3;margin:0;letter-spacing:0}
.page-detail .detail-contact .contact-qr-link{display:block;line-height:0;cursor:pointer;grid-column:1;grid-row:1/3;width:100%;max-width:100%;min-width:0;height:auto;aspect-ratio:1;object-fit:contain;background:#fff;border:4px solid #fff;border-radius:7px;margin:0;box-shadow:0 5px 18px #0006}
.page-detail .detail-contact .qr-image{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border:0;border-radius:3px;margin:0}
.page-detail .detail-contact .contact-qr-link:focus-visible{outline:3px solid #f5d38b;outline-offset:3px}
.page-detail .contact-actions{grid-column:2;grid-row:2;display:flex;flex-direction:column;gap:5px;align-self:start;margin:0}
.page-detail .contact-actions .button{width:100%;min-height:clamp(32px,5vh,48px);border-radius:6px;padding:5px 7px;font-size:clamp(14px,min(2.2vh,2vw),20px);line-height:1.25;font-weight:600;white-space:nowrap}
.page-detail .contact-actions .button.primary{background:linear-gradient(135deg,#087f44,#065c32);border-color:#39c580;color:#fff;box-shadow:inset 0 1px #ffffff30,0 3px 10px #0003}
.page-detail .contact-actions .button.primary:hover{background:#096f3c;border-color:#8ce0b3;color:#fff}
.page-detail .contact-actions .button.secondary{background:linear-gradient(120deg,#ffebbc,#e3b45e);border-color:#ffe3a0;color:#251a08;box-shadow:inset 0 1px #fff9,0 3px 12px #0003}
.page-detail .contact-actions .button.primary{text-transform:none;letter-spacing:.015em;font-size:clamp(15px,min(2.5vh,2vw),22px)}
.page-detail .contact-actions .button.secondary{display:flex;align-items:center;justify-content:center;gap:7px;font-size:clamp(15px,min(2.35vh,2vw),21px);letter-spacing:.015em}
.page-detail .contact-actions .button.secondary:hover{background:#fff0cb;border-color:#fff4da;color:#171005}
.page-detail .contact-actions .contact-phone-number{font-variant-numeric:tabular-nums;font-size:1.08em;font-weight:700;letter-spacing:.015em;line-height:1.25}
.page-detail .phone-icon{width:1.15em;height:1.15em;line-height:1;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.page-detail .detail-contact h2{color:#f8d995;text-shadow:0 2px 12px #0006}
.page-detail .detail-footer{min-width:0;padding:8px 0 max(12px,env(safe-area-inset-bottom));border-top:1px solid #a8814530;background:#0d0e10}
.page-detail .related-plates{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;width:100%;max-width:1440px;margin:auto}
.page-detail .related-title{font-size:clamp(11px,1.7vh,16px);font-weight:600;color:#e8c779;white-space:nowrap}
.page-detail .related-plate-list{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(8px,1vw,14px);min-width:0;align-items:center}
.page-detail .related-plate-card{display:flex;align-items:center;justify-content:center;min-width:0;border-radius:5px;text-decoration:none;transition:transform .18s ease,filter .18s ease;transform:translateY(0)}
.page-detail .related-plate-card .plate{display:block;width:100%;max-width:clamp(80px,24vh,230px);aspect-ratio:280/130;margin:0;border:1px solid #111;border-radius:4px;box-shadow:0 3px 8px #0008;container-type:inline-size}
.page-detail .related-plate-card .plate.motorcycle{width:62%;aspect-ratio:55/43}
.page-detail .related-plate-card .plate-number{top:17%;font-size:17cqi;letter-spacing:0}
.page-detail .related-plate-card .plate-province{bottom:12%;font-size:7.5cqi;letter-spacing:0}
.page-detail .related-plate-card .plate.motorcycle .plate-number{font-size:15cqi;line-height:1.25}
.page-detail .related-plate-card:focus-visible{outline:2px solid #f0cb70;outline-offset:3px;transform:translateY(-3px)}
@media(hover:hover) and (pointer:fine){.page-detail .related-plate-card:hover{transform:translateY(-4px);filter:brightness(1.12)}}
/* Tablets and short laptops: the contact area uses the spare space below the
   graphic, while the full facts occupy a separate uninterrupted column. */
@media(min-width:701px) and (max-width:1100px){
 .page-detail .plate-detail-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:9px 16px}
 .page-detail .plate-showcase{grid-column:1;grid-row:1}
 .page-detail .plate-info{grid-column:2;grid-row:1/3}
 .page-detail .detail-contact{grid-column:1;grid-row:2;grid-template-columns:clamp(88px,15vh,146px) minmax(0,1fr);gap:4px 10px}
 .page-detail .detail-contact h2{font-size:clamp(17px,2.7vh,25px)}
 .page-detail .contact-actions .button{font-size:clamp(13px,min(2.1vh,1.7vw),17px)}
 .page-detail .plate-info h1{font-size:clamp(25px,3.3vw,35px)}
 .page-detail .detail-facts>div{font-size:clamp(13px,1.7vw,17px);grid-template-columns:5.5em minmax(0,1fr)}
 .page-detail .related-plate-list{grid-template-columns:repeat(5,minmax(0,1fr))}
 .page-detail .related-plate-card:nth-child(n+6){display:none}
}
/* Portrait tablets share one broad, height-contained hero. Details and QR sit
   side by side below it; neither can increase the hero's available height. */
@media(min-width:701px) and (max-width:1100px) and (min-height:850px) and (orientation:portrait){
 .page-detail .plate-detail-layout{grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);grid-template-rows:minmax(0,1fr) auto;gap:14px 22px}
 .page-detail .plate-showcase{grid-column:1/-1;grid-row:1}
 .page-detail .plate-info{grid-column:1;grid-row:2;align-self:start}
 .page-detail .plate-info h1{font-size:clamp(29px,3.7vw,40px)}
 .page-detail .price{font-size:clamp(40px,5.2vw,56px)}
 .page-detail .detail-facts>div{font-size:clamp(14px,1.95vw,21px)}
 .page-detail .detail-contact{grid-column:2;grid-row:2;display:flex;flex-direction:column;align-self:center;gap:9px;text-align:center}
 .page-detail .detail-contact h2{font-size:clamp(23px,2.8vw,29px);align-self:center}
 .page-detail .detail-contact .contact-qr-link{width:clamp(130px,19vh,218px)}
 .page-detail .contact-actions{width:100%;max-width:290px;align-self:center;gap:7px}
 .page-detail .contact-actions .button{font-size:clamp(14px,1.75vw,18px);min-height:42px}
 .page-detail .related-plate-list{grid-template-columns:repeat(4,minmax(0,1fr))}
 .page-detail .related-plate-card:nth-child(n+5){display:none}
}
/* Phones: every text row is intrinsic; only the picture takes the remaining
   height. This prevents a full-width plate from pushing later rows offscreen. */
@media(max-width:700px){
 .page-detail .wrap{padding-inline:8px}
 .page-detail #main{padding-block:5px}
 .page-detail .plate-detail-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto;gap:clamp(5px,1vh,8px);padding:3px 4px;border:0;border-radius:0;background:none;box-shadow:none}
 .page-detail .plate-showcase{grid-column:1;grid-row:1;padding:0;gap:3px}
 .page-detail .plate-showcase:has(.photo-action){--photo-space:19px}
 .page-detail .plate{border-width:2px;border-radius:6px}
 .page-detail .plate-info{grid-column:1;grid-row:2;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;align-self:stretch;align-items:center}
 .page-detail .detail-heading{grid-column:1/-1;grid-row:1;gap:5px 8px;flex-wrap:nowrap;justify-content:space-between}
 .page-detail .plate-info h1{font-size:clamp(22px,min(6.6vw,3.9vh),34px)}
 .page-detail .detail-heading .badge{font-size:clamp(8px,1.25vh,10px);padding:3px 6px}
 .page-detail .detail-subtitle{grid-column:1;grid-row:2;margin:0;font-size:clamp(11px,1.8vh,15px)}
 .page-detail .price-block{grid-column:2;grid-row:2;margin:0;padding:0;border:0}
 .page-detail .price{justify-content:flex-end;font-size:clamp(25px,min(8vw,4.4vh),38px)}
 .page-detail .price small{font-size:clamp(11px,1.65vh,15px)}
 .page-detail .detail-facts{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(2px,.5vh,5px) 9px;padding-top:4px;margin-top:1px;border-top:1px solid #af844447}
 .page-detail .detail-facts>div{grid-template-columns:auto minmax(0,1fr);gap:5px;font-size:clamp(11px,min(3.55vw,1.85vh),16px);line-height:1.38}
 .page-detail .detail-facts .fact-type{grid-column:1;grid-row:1}
 .page-detail .detail-facts .fact-sum{grid-column:2;grid-row:1}
 .page-detail .detail-facts .fact-group,.page-detail .detail-facts .fact-details{grid-column:1/-1}
 .page-detail .data-note{grid-column:1/-1;margin:1px 0 0;font-size:clamp(9px,1.4vh,12px);line-height:1.35}
 .page-detail .detail-contact{grid-column:1;grid-row:3;grid-template-columns:clamp(76px,15vh,140px) minmax(0,1fr);gap:4px 12px;align-self:stretch}
 .page-detail .detail-contact h2{font-size:clamp(17px,2.8vh,24px)}
 .page-detail .detail-contact .contact-qr-link{border-width:3px}
 .page-detail .contact-actions{gap:4px}
 .page-detail .contact-actions .button{min-height:clamp(28px,4.8vh,40px);font-size:clamp(12px,min(2vh,4vw),17px);padding:4px 6px}
 .page-detail .detail-footer{padding-block:5px max(10px,env(safe-area-inset-bottom))}
 .page-detail .related-plates{grid-template-columns:minmax(0,1fr);gap:3px}
 .page-detail .related-title{font-size:clamp(10px,1.5vh,13px)}
 .page-detail .related-plate-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 .page-detail .related-plate-card:nth-child(n+4){display:none}
 .page-detail .related-plate-card .plate{max-width:140px}
}
/* Compact portrait screens keep the footer title inline to reserve a useful
   hero size; larger phones can use the entire width for three larger plates. */
@media(max-width:700px) and (max-height:568px){
 .page-detail .related-plates{grid-template-columns:auto minmax(0,1fr);gap:7px}
}
@media(max-width:479px) and (max-height:500px){
 .page-detail #main{padding-block:3px}
 .page-detail .plate-detail-layout{gap:4px}
}
/* Taller portrait screens use their spare height for readable facts and
   contact actions. The hero row follows its actual aspect ratio rather than
   retaining invisible empty height below the picture. */
@media(max-width:700px) and (min-height:700px) and (max-aspect-ratio:3/5){
 .page-detail #main{padding-block:clamp(5px,calc(3vh - 16px),8px)}
 .page-detail .plate-detail-layout{grid-template-rows:auto auto minmax(0,1fr);gap:clamp(8px,calc(6vh - 36px),18px)}
 .page-detail .plate-showcase{container-type:inline-size}
 .page-detail .plate-visual-wrap{width:100%}
 .page-detail .plate-visual-wrap:has(.motorcycle){width:65%}
 .page-detail .plate-info h1{font-size:clamp(26px,min(7vw,4.1vh),38px)}
 .page-detail .price{font-size:clamp(30px,min(10vw,5.2vh),44px)}
 .page-detail .detail-facts>div{font-size:clamp(13px,min(4.1vw,2vh),18px)}
 .page-detail .detail-subtitle{font-size:clamp(12px,1.85vh,17px)}
 .page-detail .data-note{font-size:clamp(10px,1.5vh,13px)}
 .page-detail .detail-contact{container-type:size;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:5px 12px}
 .page-detail .detail-contact .contact-qr-link{width:min(100%,100cqh);justify-self:center}
 .page-detail .detail-contact h2{font-size:clamp(18px,10cqh,26px)}
 .page-detail .contact-actions{gap:6px}
 .page-detail .contact-actions .button{min-height:clamp(34px,24cqh,52px);font-size:clamp(14px,min(7cqh,4vw),18px);padding:5px 4px}
}
@media(min-width:701px) and (max-width:1100px) and (min-height:1000px) and (max-aspect-ratio:4/5){
 .page-detail .plate-detail-layout{grid-template-rows:auto minmax(0,1fr);gap:clamp(16px,2vh,26px) 22px}
 .page-detail .plate-showcase{container-type:inline-size}
 .page-detail .plate-visual-wrap{width:100%}
 .page-detail .plate-visual-wrap:has(.motorcycle){width:65%}
 .page-detail .plate-info h1{font-size:clamp(32px,4.2vw,47px)}
 .page-detail .price{font-size:clamp(48px,6.3vw,66px)}
 .page-detail .detail-facts{gap:8px}
 .page-detail .detail-facts>div{font-size:clamp(18px,2.6vw,27px)}
 .page-detail .detail-subtitle{font-size:clamp(17px,2.2vw,24px)}
 .page-detail .data-note{font-size:clamp(13px,1.6vw,17px)}
 .page-detail .detail-contact{--contact-title-size:clamp(25px,3.2vw,35px);--contact-button-height:clamp(44px,5vh,56px);align-self:stretch;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;align-content:start;justify-items:center;container-type:size;gap:10px}
 .page-detail .detail-contact .contact-qr-link{grid-column:1;grid-row:2;width:min(100%,clamp(230px,27vh,380px),calc(100cqh - var(--contact-title-size) * 1.3 - var(--contact-button-height) * 2 - 28px))}
 .page-detail .detail-contact h2{grid-column:1;grid-row:1;font-size:var(--contact-title-size)}
 .page-detail .contact-actions{grid-column:1;grid-row:3;max-width:none;gap:8px}
 .page-detail .contact-actions .button{min-height:clamp(44px,5vh,56px);font-size:clamp(15px,1.9vw,20px)}
}
/* Landscape phones and shallow browser windows need a horizontal composition.
   Text and actions remain readable instead of being uniformly scaled down. */
@media(min-width:480px) and (max-height:500px){
 .page-detail .plate-detail-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-rows:minmax(0,1fr) auto;gap:5px 12px;padding:4px 6px}
 .page-detail .plate-showcase{grid-column:1;grid-row:1;padding:0;gap:2px}
 .page-detail .plate-showcase:has(.photo-action){--photo-space:15px}
 .page-detail .plate-info{grid-column:2;grid-row:1/3;display:block;align-self:start}
 .page-detail .detail-heading{flex-wrap:wrap;justify-content:flex-start;gap:3px 6px}
 .page-detail .plate-info h1{font-size:clamp(21px,3vw,27px)}
 .page-detail .detail-heading .badge{font-size:8px;padding:2px 4px}
 .page-detail .detail-subtitle{font-size:11px;margin-top:2px}
 .page-detail .price-block{margin:4px 0;padding:0 0 4px;border-bottom:1px solid #af844447}
 .page-detail .price{justify-content:flex-start;font-size:clamp(24px,3.6vw,32px)}
 .page-detail .price small{font-size:11px}
 .page-detail .detail-facts{display:grid;grid-template-columns:1fr;gap:2px;margin:0;padding:0;border:0}
 .page-detail .detail-facts>div{grid-template-columns:5.5em minmax(0,1fr);font-size:11px;line-height:1.3;gap:6px}
 .page-detail .detail-facts .fact-type,.page-detail .detail-facts .fact-sum,.page-detail .detail-facts .fact-group,.page-detail .detail-facts .fact-details{grid-column:auto;grid-row:auto}
 .page-detail .data-note{font-size:9px;margin-top:3px;line-height:1.3}
 .page-detail .photo-action{font-size:10px;line-height:1.2}
 .page-detail .detail-contact{grid-column:1;grid-row:2;display:grid;grid-template-columns:70px minmax(0,1fr);grid-template-rows:auto auto;gap:3px 8px;text-align:left}
 .page-detail .detail-contact h2{grid-column:2;grid-row:1;font-size:16px;align-self:end}
 .page-detail .detail-contact .contact-qr-link{grid-column:1;grid-row:1/3;width:70px;border-width:3px}
 .page-detail .contact-actions{grid-column:2;grid-row:2;flex-direction:column;gap:3px;align-self:start;max-width:none}
 .page-detail .contact-actions .button{min-height:28px;font-size:clamp(12px,min(3.2vh,1.9vw),15px);padding:3px 4px}
 .page-detail .detail-footer{padding-block:4px max(8px,env(safe-area-inset-bottom))}
 .page-detail .related-plates{grid-template-columns:auto minmax(0,1fr);gap:7px}
 .page-detail .related-title{font-size:10px}
 .page-detail .related-plate-list{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}
 .page-detail .related-plate-card:nth-child(n){display:flex}
 .page-detail .related-plate-card .plate{max-width:85px}
}
/* Browser toolbars can leave a landscape phone only 280–319px high.
   Tighten whitespace before reducing any text or photographic content. */
@media(min-width:480px) and (max-height:319px){
 .page-detail .plate-detail-layout{padding-block:2px;gap:4px 12px}
 .page-detail .price-block{margin-block:3px;padding-bottom:2px}
 .page-detail .detail-facts{gap:1px}
 .page-detail .data-note{margin-top:2px}
 .page-detail .detail-footer{padding-top:2px}
}
/* At very small effective viewports (including high browser zoom), retain
   natural scrolling rather than concealing content or preventing zoom. */
@media(max-width:319px),(max-height:279px){
 .page-detail{height:auto;min-height:100dvh;display:flex;flex-direction:column}
 .page-detail #main{display:block}
 .page-detail .plate-detail-layout{height:auto;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto}
 .page-detail .plate-showcase{grid-column:1;grid-row:1;min-height:130px}
 .page-detail .plate-visual-wrap{height:130px}
 .page-detail .plate-info{grid-column:1;grid-row:2}
 .page-detail .detail-contact{grid-column:1;grid-row:3}
}
@media(prefers-reduced-motion:reduce){.page-detail{scroll-behavior:auto}.page-detail .related-plate-card{transition:none}.page-detail .related-plate-card:hover,.page-detail .related-plate-card:focus-visible{transform:none}}

/* V10 purchase confidence: fill the former empty area with useful facts.
   Information stays in normal layout flow; nothing is absolutely positioned. */
.page-detail .detail-purchase-summary{min-width:0;margin-top:clamp(7px,1.1vh,12px);padding-top:clamp(7px,1.1vh,12px);border-top:1px solid #bd934b45;display:grid;gap:6px;grid-column:1/-1}
.page-detail .purchase-summary-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;min-width:0}
.page-detail .purchase-summary-points p{margin:0;display:grid;gap:2px;min-width:0;font-size:clamp(11px,min(1.2vw,1.9vh),16px);line-height:1.45;color:#d2c5ac}
.page-detail .purchase-summary-points strong{color:#f6d694;font-weight:600;overflow-wrap:anywhere}
.page-detail .purchase-summary-points span{font-size:.95em;overflow-wrap:anywhere}
.page-detail .purchase-account-note{margin:0;font-size:clamp(11px,min(1.1vw,1.75vh),15px);line-height:1.4;color:#ccc4b7;overflow-wrap:anywhere}
.page-detail .purchase-account-note strong{font-weight:600;color:#fbefdb}
.page-detail .purchase-guide-link{display:flex;align-items:center;justify-content:space-between;gap:9px;width:100%;min-height:35px;padding:6px 11px;border:1px solid #aa8246;border-radius:7px;background:linear-gradient(105deg,#302719,#19191b);color:#f6dbab;font:500 clamp(12px,min(1.3vw,2vh),17px)/1.4 'Kanit',sans-serif;transition:background .16s,border-color .16s}
.page-detail .purchase-guide-link:hover{background:#3e3020;border-color:#f4d18b;color:#fff0d0}
.page-detail .purchase-guide-link:focus-visible{outline:2px solid #f2cd82;outline-offset:3px}
.page-detail .purchase-guide-link span{flex:none;font-size:1.15em}
.page-detail .purchase-exception{font-size:clamp(9px,min(.9vw,1.4vh),12px);line-height:1.4;color:#b9ad99;margin:0;overflow-wrap:anywhere}
.page-detail .related-plates{max-width:1800px}
.page-detail .related-plate-card .plate{max-width:clamp(110px,28vh,260px)}
.page-detail .detail-footer{padding-bottom:max(clamp(12px,1.8vh,22px),env(safe-area-inset-bottom))}
@media(min-width:1101px) and (min-height:601px){
 .page-detail .plate-detail-layout{grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:clamp(10px,1.6vh,18px) clamp(20px,3vw,48px)}
 .page-detail .plate-showcase{grid-column:1;grid-row:1;justify-content:center;align-self:stretch}
 .page-detail .plate-info{grid-column:2;grid-row:1/3;align-self:center}
 .page-detail .detail-contact{grid-column:1;grid-row:2;grid-template-columns:clamp(114px,19vh,194px) minmax(0,1fr);gap:6px clamp(14px,2vw,26px);padding:0 clamp(0px,1vw,16px)}
 .page-detail .detail-contact h2{font-size:clamp(22px,3vh,32px)}
 .page-detail .contact-actions .button{min-height:clamp(38px,5.5vh,56px);font-size:clamp(17px,1.8vw,24px)}
 .page-detail .detail-facts>div{font-size:clamp(16px,min(1.6vw,2.5vh),24px)}
 .page-detail .plate-info h1{font-size:clamp(30px,min(3.1vw,4.8vh),48px)}
 .page-detail .price{font-size:clamp(38px,min(4.2vw,6.5vh),66px)}
 .page-detail .purchase-summary-points p{font-size:clamp(13px,min(1.2vw,1.9vh),18px)}
 .page-detail .data-note{font-size:clamp(12px,min(1.1vw,1.7vh),16px)}
}
@media(min-width:701px) and (max-width:1100px){
 .page-detail .purchase-summary-points{grid-template-columns:1fr;gap:4px}
 .page-detail .purchase-summary-points p{display:flex;flex-wrap:wrap;gap:2px 6px;font-size:clamp(11px,1.5vw,15px)}
 .page-detail .purchase-guide-link{font-size:clamp(12px,1.5vw,16px)}
}
@media(max-width:700px){
 .page-detail .detail-purchase-summary{gap:4px;margin-top:3px;padding-top:5px}
 .page-detail .purchase-summary-points{gap:4px 8px}
 .page-detail .purchase-summary-points p{font-size:clamp(10px,min(3.3vw,1.6vh),14px);line-height:1.35;gap:0}
 .page-detail .purchase-account-note{font-size:clamp(10px,min(3vw,1.5vh),13px);line-height:1.35}
 .page-detail .purchase-guide-link{font-size:clamp(12px,min(3.5vw,1.8vh),15px);min-height:31px;padding:4px 9px}
 .page-detail .purchase-exception{font-size:clamp(9px,min(2.7vw,1.3vh),11px);line-height:1.35}
 .page-detail .related-plate-card .plate{max-width:220px}
 .page-detail .related-title{font-size:clamp(11px,1.5vh,14px)}
}
@media(max-width:700px) and (min-height:850px){
 .page-detail .detail-purchase-summary{gap:6px;padding-top:8px;margin-top:5px}
 .page-detail .purchase-summary-points p{font-size:clamp(13px,3.5vw,16px)}
 .page-detail .purchase-account-note{font-size:clamp(12px,3.2vw,15px)}
 .page-detail .purchase-guide-link{font-size:clamp(14px,3.6vw,17px);min-height:37px}
 .page-detail .related-plate-list{gap:9px}
 .page-detail .detail-footer{padding-top:8px}
}
/* The tiny landscape layout has limited height. Keep all purchase facts in
   reading order and allow the whole document to grow when text needs it. */
@media(max-height:600px){
 .page-detail .detail-purchase-summary{gap:3px;margin-top:5px;padding-top:5px}
 .page-detail .purchase-summary-points p{font-size:10px;line-height:1.3}
 .page-detail .purchase-account-note{font-size:10px;line-height:1.3}
 .page-detail .purchase-guide-link{font-size:11px;min-height:27px;padding:3px 7px}
 .page-detail .purchase-exception{font-size:9px;line-height:1.3}
}
@media(max-height:500px),(max-width:360px) and (max-height:700px){
 .page-detail{height:auto;min-height:100dvh;grid-template-rows:auto minmax(0,1fr) auto}
 .page-detail #main{min-height:0}
 .page-detail .plate-detail-layout{height:auto;min-height:330px}
 .page-detail .plate-showcase{min-height:130px}
 .page-detail .plate-visual-wrap{width:100%;max-width:100%;height:auto}
 .page-detail .plate-visual-wrap:has(.motorcycle){width:65%}
 .page-detail .plate-stage{width:100%}
 .page-detail .plate-info{align-self:start}
 .page-detail .detail-contact{container-type:normal}
 .page-detail .detail-contact .contact-qr-link{width:100%;max-width:130px}
 .page-detail .contact-actions .button{min-height:30px}
 .page-detail .related-plate-card .plate{max-width:130px}
}
@media(prefers-reduced-motion:reduce){.page-detail .purchase-guide-link{transition:none}}

/* V10 review refinements: compact guide, clear payment details and gold phone CTA. */
.page-detail .purchase-bank-summary{display:grid;gap:2px;min-width:0;padding:8px 0}
.page-detail .purchase-bank-name{margin:0;font-size:clamp(12px,1.3vw,18px);line-height:1.4;color:#e0d6bf}
.page-detail .purchase-bank-number{margin:1px 0 0;font:600 clamp(17px,1.9vw,26px)/1.35 'Prompt',sans-serif;letter-spacing:.035em;font-variant-numeric:tabular-nums;color:#f2d795;white-space:nowrap}
.page-detail .purchase-guide-link{display:inline-flex;justify-content:center;justify-self:start;align-self:start;width:fit-content;max-width:100%;gap:10px;padding:7px 13px;text-align:center;text-decoration:none}
.page-detail .contact-actions .button.secondary[href^="tel:"]{background:linear-gradient(125deg,#fff0bf 0%,#e9c775 28%,#c99537 65%,#f4d990 100%);border:1px solid #f8df9d;color:#211706;box-shadow:inset 0 1px 0 #fff7d5,0 5px 16px #b8872736;text-shadow:0 1px 0 #fff4c170;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;font-weight:700;letter-spacing:.025em}
.page-detail .contact-actions .button.secondary[href^="tel:"] .contact-phone-number{color:inherit}
.page-detail .contact-actions .button.secondary[href^="tel:"]:hover{transform:translateY(-3px);border-color:#fff0ba;box-shadow:inset 0 1px 0 #fff9e5,0 9px 24px #c28a3d60;color:#1b1307}
.page-detail .contact-actions .button.secondary[href^="tel:"]:focus-visible{outline:2px solid #ffe4a3;outline-offset:4px}
@media(max-width:700px){.page-detail .purchase-bank-summary{padding:3px 0;gap:1px}.page-detail .purchase-bank-name{font-size:clamp(11px,3vw,14px)}.page-detail .purchase-bank-number{font-size:clamp(16px,4.3vw,21px)}.page-detail .purchase-guide-link{padding:5px 10px;gap:7px}}
@media(prefers-reduced-motion:reduce){.page-detail .contact-actions .button.secondary[href^="tel:"]{transition:none}.page-detail .contact-actions .button.secondary[href^="tel:"]:hover{transform:none}}

/* Intrinsic layout: content determines row height, never a size-contained QR
   or a zero-height track. Small/zoomed viewports retain readable document flow. */
.page-detail{height:auto;min-height:100dvh;grid-template-rows:auto 1fr auto}
.page-detail #main{display:block;align-content:center;padding-block:clamp(4px,.7dvh,8px)}
.page-detail .plate-detail-layout{height:auto;min-height:0;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);grid-template-rows:auto auto;gap:clamp(8px,1dvh,12px) clamp(12px,1.5vw,24px);align-items:center;padding:4px}
.page-detail .plate-showcase{grid-column:1;grid-row:1;container-type:normal;align-self:center;justify-content:center;min-height:0;padding:0;gap:4px}
.page-detail .plate-visual-wrap{width:min(100%,calc(46dvh * 2.153846));height:auto;max-width:100%;aspect-ratio:280/130;container-type:inline-size}
.page-detail .plate-visual-wrap:has(.motorcycle){width:min(65%,calc(46dvh * 1.27907));height:auto;aspect-ratio:55/43}
.page-detail .plate-stage{width:100%;max-width:100%}
.page-detail .plate-info{grid-column:2;grid-row:1/3;display:block;align-self:center;min-width:0}
.page-detail .detail-heading{flex-wrap:wrap;justify-content:flex-start;gap:5px 10px}
.page-detail .plate-info h1{font-size:clamp(25px,3vw,42px);max-width:100%;white-space:normal;overflow-wrap:anywhere}
.page-detail .detail-subtitle{font-size:clamp(13px,1.35vw,18px)}
.page-detail .price-block{margin:5px 0;padding-bottom:5px}
.page-detail .price{justify-content:flex-start;flex-wrap:wrap;font-size:clamp(28px,3.7vw,52px);white-space:normal}
.page-detail .detail-facts{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;margin:0;padding:0;border:0}
.page-detail .detail-facts>div{grid-column:auto;grid-row:auto;grid-template-columns:5.5em minmax(0,1fr);gap:8px;font-size:clamp(13px,1.3vw,18px);line-height:1.4}
.page-detail .detail-facts .fact-type,.page-detail .detail-facts .fact-sum,.page-detail .detail-facts .fact-group,.page-detail .detail-facts .fact-details{grid-column:auto;grid-row:auto}
.page-detail .detail-facts .fact-sum dd{flex-wrap:wrap;white-space:normal}
.page-detail .detail-contact{grid-column:1;grid-row:2;display:grid;grid-template-columns:clamp(86px,10vw,140px) minmax(0,1fr);grid-template-rows:auto auto;container-type:normal;align-self:center;align-content:center;justify-items:start;gap:6px 12px;text-align:left}
.page-detail .detail-contact h2{grid-column:2;grid-row:1;align-self:end;max-width:100%;font-size:clamp(18px,1.9vw,26px);overflow-wrap:anywhere}
.page-detail .detail-contact .contact-qr-link{grid-column:1;grid-row:1/3;width:100%;max-width:140px;height:auto;justify-self:start;align-self:center;box-sizing:border-box;border-width:4px}
.page-detail .contact-actions{grid-column:2;grid-row:2;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;align-content:start;align-self:start;justify-content:flex-start;gap:6px;width:auto;max-width:100%;min-width:0;margin:0}
.page-detail .contact-actions .button,.page-detail .contact-actions .button.primary,.page-detail .contact-actions .button.secondary{display:inline-flex;align-items:center;justify-content:center;flex:0 1 auto;width:fit-content;max-width:100%;min-width:0;min-height:40px;padding:7px clamp(8px,1vw,16px);box-sizing:border-box;font-size:clamp(14px,1.35vw,20px);line-height:1.3;white-space:normal;overflow-wrap:anywhere;text-align:center;letter-spacing:0}
.page-detail .contact-actions .contact-phone-number{min-width:0;font-size:1em;letter-spacing:0;overflow-wrap:anywhere}
.page-detail .detail-purchase-summary{margin-top:6px;padding-top:6px;gap:6px;min-width:0}
.page-detail .purchase-summary-points{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px}
.page-detail .purchase-summary-points p{display:block;font-size:clamp(12px,1.1vw,16px);line-height:1.4}
.page-detail .purchase-summary-points span{display:block;font-size:1em}
.page-detail .purchase-bank-summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 12px;padding:3px 0;min-width:0}
.page-detail .purchase-bank-summary p,.page-detail .purchase-bank-summary strong{margin:0;font-family:'Kanit',sans-serif;font-size:clamp(13px,1.2vw,17px);font-weight:500;line-height:1.5;letter-spacing:0;white-space:normal;overflow-wrap:anywhere}
.page-detail .purchase-bank-name{order:0}.page-detail .purchase-bank-number{order:1;font-variant-numeric:tabular-nums}.page-detail .purchase-account-note{order:2;flex:0 1 auto}
.page-detail .purchase-guide-link{width:fit-content;max-width:100%;min-width:0;min-height:34px;padding:5px 10px;box-sizing:border-box;font-size:clamp(12px,1.15vw,16px);white-space:normal}
.page-detail .detail-footer{padding-bottom:max(14px,env(safe-area-inset-bottom))}
@media(max-width:700px){
 .page-detail #main{padding-block:5px;align-content:start}
 .page-detail .plate-detail-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:8px;padding:2px 4px}
 .page-detail .plate-showcase{grid-column:1;grid-row:1}
 .page-detail .plate-visual-wrap{width:min(100%,calc(23dvh * 2.153846))}
 .page-detail .plate-visual-wrap:has(.motorcycle){width:min(60%,calc(23dvh * 1.27907))}
 .page-detail .plate-info{grid-column:1;grid-row:2;display:block;align-self:start}
 .page-detail .plate-info h1{font-size:clamp(23px,6.5vw,32px)}
 .page-detail .detail-subtitle{font-size:13px;margin-top:2px}
 .page-detail .price{font-size:clamp(27px,7.5vw,38px)}
 .page-detail .detail-facts{gap:2px}
 .page-detail .detail-facts>div{font-size:13px;gap:6px}
 .page-detail .data-note{font-size:11px;margin-top:4px}
 .page-detail .detail-contact{grid-column:1;grid-row:3;grid-template-columns:clamp(78px,22vw,100px) minmax(0,1fr);gap:4px 10px}
 .page-detail .detail-contact h2{font-size:19px}
 .page-detail .detail-contact .contact-qr-link{max-width:100px;border-width:3px}
 .page-detail .contact-actions{gap:5px}
 .page-detail .contact-actions .button,.page-detail .contact-actions .button.primary,.page-detail .contact-actions .button.secondary{font-size:14px;padding:6px 8px;min-height:36px}
 .page-detail .purchase-summary-points p{font-size:12px}
 .page-detail .purchase-bank-summary p,.page-detail .purchase-bank-summary strong{font-size:13px}
 .page-detail .purchase-guide-link{font-size:13px}
}
@media(min-width:701px) and (max-width:1100px) and (orientation:portrait){
 .page-detail .plate-detail-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-rows:auto auto;gap:16px}
 .page-detail .plate-showcase{grid-column:1/-1;grid-row:1}
 .page-detail .plate-visual-wrap{width:min(96%,calc(35dvh * 2.153846))}
 .page-detail .plate-visual-wrap:has(.motorcycle){width:min(65%,calc(35dvh * 1.27907))}
 .page-detail .plate-info{grid-column:1;grid-row:2;align-self:start}
 .page-detail .detail-contact{grid-column:2;grid-row:2;align-self:start;grid-template-columns:clamp(80px,11vw,112px) minmax(0,1fr);gap:6px 10px}
}

/* Plate-first refinement: compact flow, one-line payment when it fits, and
   small, non-layout-changing hover lifts for direct contact controls. */
.page-detail .purchase-bank-summary{column-gap:10px;row-gap:2px}
.page-detail .purchase-bank-summary p{flex:0 1 auto;white-space:nowrap}
.page-detail .contact-actions .button.primary{background:linear-gradient(125deg,#137a49 0%,#0c653d 60%,#155938 100%);border:1px solid #82dca4;box-shadow:inset 0 1px #ceffdf50,0 4px 14px #08734230;text-shadow:0 1px #00351c;gap:6px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.page-detail .detail-contact .contact-qr-link{border:1px solid #e2bd70;background:#fff;padding:4px;box-shadow:0 0 0 1px #ba8f3c24,0 5px 18px #0006;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.page-detail .contact-actions .button.primary:focus-visible{outline:2px solid #a2f2bf;outline-offset:3px}
@media(hover:hover) and (pointer:fine){
 .page-detail .contact-actions .button.primary:hover{transform:translateY(-3px);border-color:#bbf5cc;box-shadow:inset 0 1px #ceffdf60,0 8px 20px #13945945}
 .page-detail .detail-contact .contact-qr-link:hover{transform:translateY(-3px);border-color:#ffe1a0;box-shadow:0 0 0 1px #e5b96045,0 9px 22px #c28a3d35}
}
@media(max-width:700px){
 .page-detail .plate-detail-layout{gap:6px}
 .page-detail .plate-visual-wrap{width:min(100%,calc(26dvh * 2.153846))}
 .page-detail .plate-visual-wrap:has(.motorcycle){width:min(65%,calc(26dvh * 1.27907))}
 .page-detail .purchase-bank-summary{gap:2px 9px}
}
@media(max-width:300px){.page-detail .purchase-bank-summary p{white-space:normal;overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){
 .page-detail .contact-actions .button.primary,.page-detail .detail-contact .contact-qr-link{transition:none}
 .page-detail .contact-actions .button.primary:hover,.page-detail .detail-contact .contact-qr-link:hover{transform:none}
}

/* Each purchase condition is a complete reading line, never split in two columns. */
.page-detail .purchase-summary-points{grid-template-columns:minmax(0,1fr);gap:3px}
.page-detail .purchase-summary-points p{margin:0;font-size:clamp(12px,1.2vw,17px);line-height:1.5}
.page-detail .purchase-summary-points strong{display:inline;white-space:nowrap;overflow-wrap:normal}
@media(max-width:700px){.page-detail .purchase-summary-points p{font-size:clamp(11px,3.35vw,16px)}}
@media(max-width:319px){.page-detail .purchase-summary-points strong{white-space:normal}}

.page-detail .purchase-summary-points{container-type:inline-size}
.page-detail .purchase-summary-points p{font-size:clamp(10px,3.8cqi,17px)}


/* Payment hierarchy: quiet purchase conditions, prominent bank destination. */
.page-detail .purchase-summary-points p{font-weight:400;color:#d2c5ac;white-space:nowrap}
.page-detail .purchase-bank-summary{align-items:center;gap:5px 10px}
.page-detail .purchase-bank-summary p,.page-detail .purchase-bank-summary strong{font-weight:700;color:#f2d795}
.page-detail .purchase-bank-summary .purchase-account-note strong{font-weight:800;color:#fff2cd}
.page-detail .purchase-bank-summary .purchase-account-number{display:inline-block;box-sizing:border-box;max-width:100%;padding:2px 7px;border:1px solid #d5ad61;border-radius:6px;background:linear-gradient(120deg,#cfaa5a19,#f4d6900b);box-shadow:inset 0 1px #ffe7ad22,0 2px 8px #0003;color:#fff0bc;font:inherit;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.025em;line-height:1.4;vertical-align:baseline;white-space:nowrap}
@media(max-width:300px){.page-detail .purchase-bank-summary .purchase-account-number{letter-spacing:0;padding-inline:5px}}

@media(max-width:319px){.page-detail .purchase-summary-points p{white-space:normal}}

/* Bound the page grid to the viewport; allow navigation to shrink within its row. */
.page-detail{grid-template-columns:minmax(0,1fr);min-width:0}
.page-detail>.site-header,.page-detail>#main,.page-detail>.detail-footer{min-width:0;max-width:100%}

/* Keep related plates in document flow and size each viewport intrinsically. */
html:has(.page-detail){scrollbar-gutter:stable}
.page-detail{grid-template-rows:auto auto auto;align-content:start;width:100%;max-width:100%;height:auto}
.page-detail #main{align-content:start}
.page-detail .plate-detail-layout{box-sizing:border-box;max-width:100%}
.page-detail .plate-info,.page-detail .detail-contact,.page-detail .detail-facts dd{overflow-wrap:anywhere}
.page-detail .detail-footer{margin-top:6px}
@media(max-width:700px){
 .page-detail .detail-footer{margin-top:2px}
}
@media(min-width:701px) and (max-width:1100px) and (orientation:portrait){
 .page-detail .wrap{padding-inline:clamp(16px,2.5vw,28px)}
 .page-detail #main{padding-block:12px}
 .page-detail .plate-detail-layout{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);grid-template-rows:auto auto;gap:20px clamp(20px,3vw,32px);padding:0;align-items:start}
 .page-detail .plate-showcase{grid-column:1/-1;grid-row:1;align-self:start;gap:6px}
 .page-detail .plate-visual-wrap{width:100%}
 .page-detail .plate-visual-wrap:has(.motorcycle){width:min(60%,calc(40dvh * 1.27907))}
 .page-detail .photo-action{font-size:16px}
 .page-detail .plate-info{grid-column:1;grid-row:2;align-self:start}
 .page-detail .detail-heading{gap:6px 10px}
 .page-detail .plate-info h1{font-size:clamp(30px,4vw,42px)}
 .page-detail .detail-heading .badge{font-size:12px;padding:5px 8px}
 .page-detail .detail-subtitle{font-size:clamp(16px,2vw,21px)}
 .page-detail .price{font-size:clamp(40px,5.5vw,58px)}
 .page-detail .detail-facts{gap:5px}
 .page-detail .detail-facts>div{grid-template-columns:4.7em minmax(0,1fr);gap:8px;font-size:clamp(17px,2.2vw,23px);line-height:1.45}
 .page-detail .data-note{font-size:clamp(12px,1.6vw,17px);line-height:1.5}
 .page-detail .detail-purchase-summary{margin-top:9px;padding-top:9px;gap:8px}
 .page-detail .purchase-summary-points p{font-size:clamp(16px,2vw,21px);white-space:normal}
 .page-detail .purchase-summary-points strong{white-space:normal}
 .page-detail .purchase-bank-summary p,.page-detail .purchase-bank-summary strong{font-size:clamp(15px,1.9vw,20px);white-space:normal}
 .page-detail .purchase-guide-link{font-size:clamp(15px,1.9vw,20px);min-height:40px;padding:7px 12px}
 .page-detail .detail-contact{grid-column:2;grid-row:2;align-self:center;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:12px;justify-items:center;text-align:center}
 .page-detail .detail-contact h2{grid-column:1;grid-row:1;align-self:auto;font-size:clamp(23px,3vw,31px);margin:0}
 .page-detail .detail-contact .contact-qr-link{grid-column:1;grid-row:2;width:clamp(150px,22vw,230px);max-width:100%;justify-self:center;padding:6px}
 .page-detail .contact-actions{grid-column:1;grid-row:3;width:100%;justify-content:center;gap:9px}
 .page-detail .contact-actions .button,.page-detail .contact-actions .button.primary,.page-detail .contact-actions .button.secondary{font-size:clamp(17px,2.2vw,23px);min-height:46px;padding:10px 12px}
 .page-detail .related-title{font-size:clamp(14px,1.8vw,19px)}
}
@media(min-width:701px) and (max-width:1280px) and (orientation:landscape){
 .page-detail .plate-info h1{font-size:clamp(28px,3.1vw,39px)}
 .page-detail .detail-facts>div{font-size:clamp(15px,1.55vw,20px)}
 .page-detail .detail-subtitle{font-size:clamp(15px,1.55vw,20px)}
 .page-detail .data-note{font-size:clamp(11px,1.2vw,15px)}
 .page-detail .purchase-summary-points p{white-space:normal}
}
@media(min-width:701px) and (max-width:1280px) and (min-height:760px) and (orientation:landscape),(min-width:1101px) and (max-width:1400px) and (min-height:900px) and (orientation:landscape){
 .page-detail .plate-info h1{font-size:clamp(32px,3.6vw,46px)}
 .page-detail .price{font-size:clamp(44px,5.2vw,64px)}
 .page-detail .detail-subtitle{font-size:clamp(18px,1.9vw,24px)}
 .page-detail .detail-facts{gap:5px}
 .page-detail .detail-facts>div{font-size:clamp(18px,1.95vw,24px);line-height:1.45}
 .page-detail .data-note{font-size:clamp(12px,1.25vw,16px);line-height:1.5}
 .page-detail .purchase-summary-points p{font-size:clamp(16px,1.65vw,21px);white-space:normal}
 .page-detail .purchase-summary-points strong{white-space:normal}
 .page-detail .purchase-bank-summary p,.page-detail .purchase-bank-summary strong{font-size:clamp(15px,1.4vw,18px);white-space:normal}
 .page-detail .purchase-guide-link{font-size:clamp(15px,1.45vw,18px);min-height:40px}
 .page-detail .detail-contact{grid-template-columns:clamp(112px,13vw,170px) minmax(0,1fr)}
 .page-detail .detail-contact .contact-qr-link{max-width:170px}
 .page-detail .detail-contact h2{font-size:clamp(22px,2.2vw,28px)}
 .page-detail .contact-actions .button,.page-detail .contact-actions .button.primary,.page-detail .contact-actions .button.secondary{font-size:clamp(16px,1.6vw,21px);min-height:44px}
 .page-detail .related-title{font-size:clamp(14px,1.4vw,18px)}
}

/* Reclaim the removed display-only note as comfortable reading space. */
.page-detail .detail-facts{row-gap:clamp(3px,.45vh,6px)}
.page-detail .plate-info>.detail-purchase-summary{margin-top:8px;padding-top:8px}
.page-detail .plate-showcase .plate-visual-wrap:has(.detail-plate-trigger){border-radius:8px;outline:2px solid transparent;outline-offset:2px;transition:transform .2s ease,outline-color .2s ease,box-shadow .2s ease}
.page-detail .purchase-bank-summary .purchase-account-number{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.page-detail .purchase-bank-summary a.purchase-account-number{text-decoration:none;cursor:zoom-in}
@media(hover:hover) and (pointer:fine){
 .page-detail .purchase-bank-summary .purchase-account-number:hover{transform:translateY(-2px);border-color:#ffe2a0;box-shadow:inset 0 1px #fff0bf55,0 5px 14px #c89a4140;color:#fff6db}
 .page-detail .plate-showcase .plate-visual-wrap:has(.detail-plate-trigger):hover{transform:translateY(-3px);outline-color:#f3ce79;box-shadow:0 0 0 1px #8d6828,0 0 0 4px #d5b06426,0 9px 24px #c99c4938}
}
.page-detail .plate-showcase .plate-visual-wrap:has(.detail-plate-trigger):focus-within{outline-color:#f3ce79;box-shadow:0 0 0 1px #8d6828,0 0 0 4px #d5b06426,0 9px 24px #c99c4938}
@media(prefers-reduced-motion:reduce){
 .page-detail .plate-showcase .plate-visual-wrap:has(.detail-plate-trigger),.page-detail .purchase-bank-summary .purchase-account-number{transition:none}
 .page-detail .plate-showcase .plate-visual-wrap:has(.detail-plate-trigger):hover,.page-detail .purchase-bank-summary .purchase-account-number:hover{transform:none}
}