/* PistonTribe — plate lookup, verified specs, declarations, clips. GENERATED by Plan/build-vrm-css.py from the mockup's <style>. Do not edit by hand. */

/* ═══ ADDITIONS — not in the mockup ═══
   Isolation from the host page (sell-a-part.css and the theme style bare buttons/inputs/headings), a hidden state, and one
   token for the clip thumbnail placeholder the mockup drew inline. No new sizes. */
.pt-vrm{display:block;font-family:var(--sans);color:var(--ink);text-align:left;--th:#CFCCC3}
.pt-vrm[hidden],.pt-vrm [hidden]{display:none !important}
.pt-vrm *{box-sizing:border-box}
.pt-vrm button{font:inherit;line-height:normal;border-radius:0;box-shadow:none;text-transform:none;letter-spacing:0;height:auto;min-height:0;margin:0;color:inherit;background:none;text-shadow:none}
.pt-vrm button:hover{opacity:.9}
.pt-vrm .chip.on,.pt-vrm .btn{opacity:1}
.pt-vrm .chip{transition:none}
.pt-vrm h3{margin:0;font-family:inherit;text-transform:none;letter-spacing:0;border:0;padding:0;line-height:1.3}
.pt-vrm h3::before,.pt-vrm h3::after{content:none}
.pt-vrm input[type=text],.pt-vrm input[type=number]{height:auto;min-height:0;border-radius:0;box-shadow:none;margin:0}
.pt-vrm .plate input{padding:12px 0;width:170px;border:0;box-shadow:none;background:transparent}
.pt-vrm .status[hidden]{display:none !important}
.pt-vrm ul{margin:0;padding:0;list-style:none}
.pt-vrm .adv{margin-top:8px;font-size:14px;color:var(--ink-2);line-height:1.5}
.pt-vrm .adv li{padding:6px 0;border-top:1px solid var(--line)}
.pt-vrm .adv li:first-child{border-top:0}
.pt-vrm .adv .t{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-right:8px}
.pt-vrm .adv .t.warn{color:var(--amber)}
.pt-vrm .note{font-size:13.5px;color:var(--amber);margin-top:6px}
.pt-vrm .vbox video{width:64px;height:44px;object-fit:cover;background:var(--th);flex:0 0 auto}
.pt-vrm .vbox .rm{margin-left:auto;font-size:16px;width:32px;height:32px;border:1px solid var(--line-2);background:var(--white);color:var(--ink-3);cursor:pointer;flex:0 0 auto}
.pt-vrm .vbox .busy{color:var(--amber)}
.pt-vrm .strength .bar i[data-w="0"]{width:0}.pt-vrm .strength .bar i[data-w="10"]{width:10%}.pt-vrm .strength .bar i[data-w="20"]{width:20%}.pt-vrm .strength .bar i[data-w="30"]{width:30%}.pt-vrm .strength .bar i[data-w="40"]{width:40%}.pt-vrm .strength .bar i[data-w="50"]{width:50%}.pt-vrm .strength .bar i[data-w="60"]{width:60%}.pt-vrm .strength .bar i[data-w="70"]{width:70%}.pt-vrm .strength .bar i[data-w="80"]{width:80%}.pt-vrm .strength .bar i[data-w="90"]{width:90%}.pt-vrm .strength .bar i[data-w="100"]{width:100%}
/* Listing page: the same grid inside the sidebar card, chips are read-only there. */
.pt-vrm.is-listing .spec{margin-top:10px;grid-template-columns:1fr 1fr}   /* the sidebar card is ~420px: two columns, ten cells */
.pt-vrm.is-listing .says .k.mt{margin-top:12px}
.pt-vrm.is-listing .chips .chip{cursor:default}
.pt-vrm.is-listing .chips .chip:hover{opacity:1}
.pt-vrm.is-listing .says{margin-top:14px}
.pt-vrm.is-listing .says .k{display:block;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);font-weight:600;margin-bottom:8px}
.pt-vrm.is-listing .faults-list{margin:10px 0 0 18px;padding:0;list-style:disc;font-size:14px;color:var(--ink-2);line-height:1.5}
.pt-vrm .hist{margin-top:12px;font-size:14px;color:var(--ink-2)}
.pt-vrm .hist a{color:var(--blue)}
.pt-vrm.pt-vrm--inline{display:inline-flex;vertical-align:middle;margin-left:10px;white-space:nowrap}
.pt-gallery-layout-final .pt-thumb-item video,.pt-gallery-layout-final .pt-gallery-main-image-item video{width:100%;height:100%;object-fit:cover;display:block;background:#000}
.pt-gallery-layout-final .pt-gallery-main-image-item video{object-fit:contain}
.pt-gallery-layout-final .pt-gallery-main-image-item iframe{width:100%;height:100%;border:0;display:block;background:#000}
.pt-gallery-layout-final .pt-thumb-item.is-clip img{width:100%;height:100%;object-fit:cover;display:block}
.pt-vrm .vbox img.th{width:64px;height:44px;object-fit:cover;background:var(--th);flex:0 0 auto}
.pt-vrm .vbox span.th{width:64px;height:44px;background:var(--th);flex:0 0 auto;display:block}
.pt-gallery-layout-final .pt-thumb-item.is-clip{position:relative}
.pt-gallery-layout-final .pt-thumb-item.is-clip::after{content:"▶";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#fff;font-size:18px;text-shadow:0 0 6px rgba(0,0,0,.6);pointer-events:none}

/* ═══ THE MOCKUP'S COMPONENT RULES, VERBATIM, SCOPED ═══ */
.pt-vrm{--ink:#1A1A1A;--ink-2:#5C5A54;--ink-3:#8A887F;--line:#E4E2DB;--line-2:#C9C7BF;--paper:#FAF9F6;--white:#fff;
    --amber:#A86A00;--amber-bg:#F7F0E1;--green:#2E7D4F;--green-bg:#E7F1EA;--blue:#1D4ED8;--plate:#F5D33F;
    --mono:"JetBrains Mono","SF Mono",ui-monospace,Menlo,monospace;--sans:-apple-system,BlinkMacSystemFont,"Inter","Helvetica Neue",Arial,sans-serif}
.pt-vrm .mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.pt-vrm .lbl{display:block;font-size:17px;font-weight:600;margin:22px 0 10px}
.pt-vrm .lbl i{font-style:normal;font-weight:400;color:var(--ink-3)}
.pt-vrm .in{width:100%;font:inherit;font-size:17px;padding:16px 18px;border:1px solid var(--line-2);background:var(--white);color:var(--ink)}
.pt-vrm .in::placeholder{color:var(--ink-3)}
.pt-vrm .grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pt-vrm .btn{font:inherit;font-size:16px;font-weight:500;padding:14px 22px;border:1px solid var(--ink);background:var(--ink);color:var(--white);cursor:pointer;white-space:nowrap}
.pt-vrm .btn.sec{background:var(--white);color:var(--ink);border-color:var(--line-2)}
.pt-vrm .btn.sm{font-size:14px;padding:9px 14px}
.pt-vrm .link{color:var(--blue);background:none;border:0;font:inherit;cursor:pointer;padding:0;font-size:inherit}
.pt-vrm .fine{font-size:13.5px;color:var(--ink-3);line-height:1.5;margin-top:10px}
.pt-vrm .sub{border:1px solid var(--line);background:var(--paper);padding:20px 22px;margin-top:18px}
.pt-vrm .sub h3{font-size:17px;font-weight:600}
.pt-vrm .plate-row{display:flex;gap:12px;align-items:stretch;margin-top:12px}
.pt-vrm .plate{display:flex;align-items:center;border:2px solid var(--ink);background:var(--plate);font-family:var(--mono);font-size:26px;font-weight:600;letter-spacing:.08em;padding:0 18px;min-width:280px}
.pt-vrm .plate .gb{background:#1D3F9A;color:#fff;font-family:var(--sans);font-size:11px;font-weight:700;padding:14px 8px;margin:-2px 14px -2px -18px;align-self:stretch;display:grid;place-items:center}
.pt-vrm .plate input{font:inherit;background:transparent;border:0;outline:0;width:170px;text-transform:uppercase;color:var(--ink)}
.pt-vrm .plate input::placeholder{color:#7a6c1c;font-weight:400}
.pt-vrm .status{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-2);margin-top:10px}
.pt-vrm .status .dot{width:8px;height:8px;background:var(--green)}
.pt-vrm .status.busy .dot{background:var(--amber)}
.pt-vrm .spec{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:14px}
.pt-vrm .spec div{background:var(--white);padding:10px 12px}
.pt-vrm .spec .k{display:block;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.pt-vrm .spec .v{display:block;font-size:15.5px;margin-top:3px}
.pt-vrm .spec .v.mono{font-size:15px}
.pt-vrm .spec .v.amber{color:var(--amber)}
.pt-vrm .badge{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:3px 9px;background:var(--green-bg);color:var(--green)}
.pt-vrm .mot{display:flex;gap:10px;align-items:center;margin-top:12px;font-size:14px;color:var(--ink-2);flex-wrap:wrap}
.pt-vrm .mot .m{font-family:var(--mono);color:var(--ink)}
.pt-vrm .qrow{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.pt-vrm .qrow:first-of-type{border-top:0}
.pt-vrm .qrow .q{font-size:15px;font-weight:600}
.pt-vrm .qrow .q small{display:block;font-weight:400;color:var(--ink-3);font-size:12.5px}
.pt-vrm .chips{display:flex;gap:6px;flex-wrap:wrap}
.pt-vrm .chip{font:inherit;font-size:14px;padding:8px 12px;border:1px solid var(--line-2);background:var(--white);color:var(--ink-2);cursor:pointer}
.pt-vrm .chip.on{background:var(--ink);color:var(--white);border-color:var(--ink)}
.pt-vrm .chip.warn.on{background:var(--amber);border-color:var(--amber)}
.pt-vrm .faults{margin-top:8px}
.pt-vrm .faults .fl{display:flex;gap:6px;margin-top:6px}
.pt-vrm .faults .fl:first-child{margin-top:0}
.pt-vrm .faults input{flex:1;font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--line-2)}
.pt-vrm .faults .rm{font:inherit;font-size:16px;width:42px;border:1px solid var(--line-2);background:var(--white);color:var(--ink-3);cursor:pointer}
.pt-vrm .vid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px}
.pt-vrm .vbox{border:1px dashed var(--line-2);background:var(--white);padding:18px;text-align:center;cursor:pointer}
.pt-vrm .vbox b{display:block;font-size:15px;font-weight:600}
.pt-vrm .vbox span{display:block;font-size:13px;color:var(--ink-3);margin-top:4px}
.pt-vrm .vbox.done{border:1px solid var(--ink);text-align:left;display:flex;gap:12px;align-items:center}
.pt-vrm .vbox.done .th{width:64px;height:44px;background:#CFCCC3;flex:0 0 auto}
.pt-vrm .strength{display:flex;align-items:center;gap:14px;margin-top:18px;padding:12px 14px;border:1px solid var(--line);background:var(--paper);font-size:14px}
.pt-vrm .strength .bar{flex:1;height:6px;background:var(--line);position:relative}
.pt-vrm .strength .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--ink)}
.pt-vrm .strength b{white-space:nowrap}
.pt-vrm .strength .t{color:var(--ink-2)}
@media (max-width:720px){
.pt-vrm .grid2,.pt-vrm .vid{grid-template-columns:1fr}
.pt-vrm .spec{grid-template-columns:1fr 1fr}
.pt-vrm .plate{min-width:0;flex:1}
.pt-vrm .plate input{width:100%}
.pt-vrm .qrow{grid-template-columns:1fr}
.pt-vrm .plate-row{flex-direction:column}
}

/* ═══ THE MOCKUP'S INLINE STYLES, AS RULES (after the verbatim block so they win, as inline did) ═══ */
.pt-vrm .sub h3 .fine{display:inline;margin:0 0 0 8px}
.pt-vrm .vhead{display:flex;justify-content:space-between;align-items:center;margin-top:22px;gap:12px;flex-wrap:wrap}
.pt-vrm .mot .link{font-size:14px}
.pt-vrm .grid2.tight{margin-top:16px}
.pt-vrm .lbl.first{margin-top:0}
.pt-vrm .fine.tight{margin-top:6px}
.pt-vrm .chips.tight{margin-top:4px}
.pt-vrm .quick-rows{margin-top:8px}
/* The remove [×] buttons (fault lines, modification lines, clip tiles): the "×" was a TEXT glyph, so its size and position
   depended on the font and on the theme's button padding — small and off-centre (Leon 19 Sep). Now the glyph is hidden and the
   cross is DRAWN, dead centre, in a square that matches the input's height. */
.pt-vrm .rm{position:relative;flex:0 0 auto;padding:0;font-size:0;line-height:0;min-width:0;min-height:0;border-radius:0;box-shadow:none}
.pt-vrm .faults .fl{align-items:stretch}
.pt-vrm .faults .rm{width:44px;border:1px solid var(--line-2);background:var(--white);color:var(--ink-2)}
.pt-vrm .rm::before,.pt-vrm .rm::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:currentColor;transform:translate(-50%,-50%) rotate(45deg)}
.pt-vrm .rm::after{transform:translate(-50%,-50%) rotate(-45deg)}
.pt-vrm .vbox .rm::before,.pt-vrm .vbox .rm::after{width:12px}
.pt-vrm .rm:hover{border-color:var(--ink);color:var(--ink);opacity:1}
/* V5C follow-up (Leon 19 Sep 2026): a second question that only exists under "Yes", in the row's own column; the why-line reuses .faults */
/* A row whose right side grows (fault lines, modification lines, the V5C follow-up) keeps its label on the FIRST line of answers,
   not floating in the middle of the block. One-line rows look exactly as the mockup: the label's padding centres it on a chip. */
.pt-vrm .qrow{align-items:start}
.pt-vrm .qrow .q{padding-top:8px}
@media (max-width:720px){.pt-vrm .qrow .q{padding-top:0}}   /* stacked on a phone: the label sits above the answers, no offset needed */
.pt-vrm .qrow.qrow--sub{border-top-style:dashed}   /* a follow-up row (V5C → whose name → why): a row like the others, the dashed rule ties it to the row above */
.pt-vrm .qrow--sub .faults{margin-top:0}
.pt-vrm .qrow .fine{margin-bottom:0}   /* the theme gives every <p> a bottom margin; inside a row it made that row taller than its neighbours */
.pt-vrm .faults .fine{margin-top:6px}
.pt-vrm .faults .link{font-size:14px;margin-top:8px}
.pt-vrm .mhead{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.pt-vrm .mhead .btn{flex:0 0 auto}
.pt-media-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}   /* the mockup's card head: title + note left, the button right */
.pt-media-head>div{min-width:0}
.pt-media-head .pt-vrm--inline{margin:0;flex:0 0 auto}
.pt-vrm .faults .link{color:var(--ink);font-weight:500;text-decoration:none}   /* the form's own text-button style (Dimensions toggle), not a blue link: it is an action */
.pt-vrm .chip:focus:not(:focus-visible),.pt-vrm .btn:focus:not(:focus-visible){outline:none}
#pt-vrm-media .vid{margin-top:0}
#pt-vrm-media{margin-bottom:14px}
.pt-vrm .strength{margin-top:18px}
/* REQUIRED = a red * (Leon 19 Sep 2026) — same mark as the rest of the create form (sell-a-part.css); the one deliberate exception to "red is for disputes" */
.pt-vrm .lbl i.req{font-weight:600;color:var(--pt-red-deep)}

/* ── STRENGTH BAR READS AS STATE (Leon 21 Sep 2026: "make it a different colour so it grabs attention") ──
   It was ink on paper: honest, but it said nothing and nobody looked at it. Colour is state on this platform,
   so the bar uses the state it is actually in — amber while the listing is still missing something (a task
   waiting on the seller), green once it is Strong (done). Never red: a Basic listing is not a failure, it is
   an unfinished one. The level comes from the same score the JS already computes, as data-level on the strip.
   Tokens are the canonical --pt-* ones; the .pt-vrm block keeps its own greys but must not invent a second
   amber or green. */
.pt-vrm .strength .bar i{background:var(--pt-amber-dot);transition:width 180ms ease}
.pt-vrm .strength[data-level="strong"] .bar i{background:var(--pt-green-dot)}
.pt-vrm .strength b{color:var(--pt-amber-text)}
.pt-vrm .strength[data-level="strong"] b{color:var(--pt-green-text)}
/* One quiet dot of emphasis on the edge, so the strip catches the eye without becoming a coloured box. */
.pt-vrm .strength{border-left:3px solid var(--pt-amber-dot)}
.pt-vrm .strength[data-level="strong"]{border-left-color:var(--pt-green-dot)}