/* Claude v3.3 (E5): графика интерактивных схем гидов — макет настоящей шины и диска.
   Разметка — inc/guide-v3.php (hg_gw_*_art), поведение — assets/guide-widgets.js. Механика, тексты и данные схем прежние, меняется только рисунок.
   Палитры — переменными на .hg-gw: у ночи своя, не инверсия. Движение — transform/opacity; prefers-reduced-motion — без движения.
   Листы подключаются после guide-v3.css (inc/front-v33.php, только страницы гидов): правила здесь перекрывают прежние по специфичности. */

/* --- Палитры: день --- */
.hg-gw{
 --gw-stage-a:#f5f6f8;--gw-stage-b:#e2e5e9;--gw-stage-line:#d3d7dc;
 --gw-r1:#1c1e22;--gw-r2:#32353b;--gw-r3:#232529;
 --gw-tread-a:#101113;--gw-tread-b:#2b2e33;
 --gw-letter:#6b717a;--gw-letter-week:#e0634f;--gw-letter-year:#b4bac2;
 --gw-cap:#3a3d44;--gw-cap-in:#2a2d32;
 --gw-card:#fff;--gw-card-line:#dcdfe3;--gw-chip-li:#202226;--gw-chip-li-fg:#fff;
 --gw-f1:#50545c;--gw-f2:#2c2f35;--gw-lid1:#6c727b;--gw-lid2:#8c929c;--gw-sd1:#2a2d31;--gw-sd2:#1b1d20;--gw-floor:#0f1012;
 --gw-plat-f:#8d7640;--gw-plat-l:#aa9358;--gw-slip-f:#8b4640;--gw-slip-l:#aa6159;
}
/* --- Палитры: ночь (свои тона: резина холоднее и светлее фона, подсветка острее) --- */
html[data-theme=dark] .hg-gw{
 --gw-stage-a:#2b2e33;--gw-stage-b:#202225;--gw-stage-line:#3a3d42;
 --gw-r1:#191b1f;--gw-r2:#2e3136;--gw-r3:#212328;
 --gw-tread-a:#0c0d0f;--gw-tread-b:#272a2f;
 --gw-letter:#767d87;--gw-letter-week:#ff7a63;--gw-letter-year:#c4cad2;
 --gw-cap:#3c4047;--gw-cap-in:#292c31;
 --gw-card:#26282b;--gw-card-line:#383b40;--gw-chip-li:#e6e8eb;--gw-chip-li-fg:#16181a;
 --gw-f1:#4a4e56;--gw-f2:#2a2d32;--gw-lid1:#656b75;--gw-lid2:#868c97;--gw-sd1:#232529;--gw-sd2:#17181b;--gw-floor:#0b0c0d;
 --gw-plat-f:#9a824a;--gw-plat-l:#b69f66;--gw-slip-f:#9a4c45;--gw-slip-l:#b96b62;
}

/* --- Общее: полотно схемы --- */
.hg-gw .gw3-svg{display:block;width:100%;height:auto;overflow:visible}
.gw3-r1{stop-color:var(--gw-r1)}.gw3-r2{stop-color:var(--gw-r2)}.gw3-r3{stop-color:var(--gw-r3)}
.gw3-sheen{stop-color:#fff;stop-opacity:.1}.gw3-sheen0{stop-color:#fff;stop-opacity:0}
.gw3-frame{fill:none;stroke:#fff;stroke-opacity:.1;stroke-width:1}

/* --- Боковина шины --- */
.gw3-ribs{fill:none;stroke-width:.6;opacity:.13}
.gw3-grain{fill:#fff;opacity:.085;pointer-events:none}
.gw3-tread{fill:var(--gw-tread-a)}
.gw3-teeth{fill:none;stroke:var(--gw-tread-b);stroke-width:13;stroke-dasharray:29 6}
.gw3-shoulder{fill:none;stroke:#fff;stroke-opacity:.22;stroke-width:1.2}
.gw3-guard-hi{fill:none;stroke:#fff;stroke-opacity:.16;stroke-width:1.4}
.gw3-guard{fill:none;stroke:var(--gw-r2);stroke-width:5}
.gw3-guard-lo{fill:none;stroke:#000;stroke-opacity:.55;stroke-width:2.4}
.gw3-void{fill:#09090b}
.gw3-lip{fill:none;stroke-width:10}
.gw3-lip-hi{fill:none;stroke:#fff;stroke-opacity:.55;stroke-width:.9}
.gw3-emb-sh{flood-color:#000}

/* --- Тиснёные буквы и цифры: фильтр feSpecularLighting даёт свет сверху слева и тень снизу справа --- */
.gw3-emb text{font-family:RoadRadio,Montserrat,'Noto Sans JP',sans-serif;font-weight:700;text-anchor:middle;fill:var(--gw-letter);letter-spacing:0}
.gw3-t.is-dot{font-size:22px}
.gw3-t.is-grp{font-size:19px}
.gw3-t.is-dim{opacity:.82}
.gw3-emb .gw3-t.is-micro{font-size:10px;font-weight:600;opacity:.7}
.gw3-pin{fill:var(--gw-letter)}

/* --- Капсула с кодом (DOT) --- */
.gw3-cap-sh{fill:#000;opacity:.5}
.gw3-cap-glow{fill:none;stroke:var(--hg-red);stroke-width:4;opacity:.5}
.gw3-cap{fill:var(--gw-cap)}
.gw3-cap-in{fill:var(--gw-cap-in);stroke:#000;stroke-opacity:.45;stroke-width:1}
.gw3-cap-ring{fill:none;stroke:var(--hg-red);stroke-width:1.6}
.gw3-svg .hg-gw__digit{font:700 26px/1 RoadRadio,Montserrat,'Noto Sans JP',sans-serif;fill:var(--gw-letter-year);text-anchor:middle;transform-box:fill-box;transform-origin:50% 50%}
.gw3-svg .hg-gw__digit.is-week{fill:var(--gw-letter-week)}
.gw3-svg .hg-gw__digit.is-year{fill:var(--gw-letter-year)}
.gw3-tag{stroke:#000;stroke-opacity:.25;stroke-width:.6}
.gw3-tag.is-week{fill:#c8372b}
.gw3-tag.is-year{fill:#e8eaed}
.gw3-tagtext{font:700 10px/1 Montserrat,'Noto Sans JP',sans-serif;fill:#fff;text-anchor:middle}
.gw3-tag.is-year+.gw3-tagtext{fill:#1b1d20}

/* --- «91H»: боковина с размером и кодом, под ней приборы --- */
.gw3-st1{stop-color:var(--gw-stage-a)}.gw3-st2{stop-color:var(--gw-stage-b)}
.gw3-emb .gw3-t.is-size{font-size:24px;fill:#7a808a}
.gw3-emb .gw3-code{font-size:40px;font-weight:700}
.gw3-emb .gw3-code.is-li{text-anchor:end;fill:#8e949d}
.gw3-emb .gw3-code.is-sr{text-anchor:start;fill:#8e949d}
.gw3-ul{transition:opacity .2s ease}
.gw3-ul.is-li{fill:#eef0f2}
.gw3-ul.is-sr{fill:var(--hg-red)}
.gw3-card{fill:var(--gw-card);stroke:var(--gw-card-line);stroke-width:1}
.gw3-chip.is-li{fill:var(--gw-chip-li)}
.gw3-chip.is-sr{fill:#cf382c}
.gw3-chiptext{font:700 11px/1 Montserrat,'Noto Sans JP',sans-serif;fill:#fff;text-anchor:middle;letter-spacing:.04em}
.gw3-chip.is-li+.gw3-chiptext{fill:var(--gw-chip-li-fg)}
.gw3-big{font:800 26px/1 Montserrat,'Noto Sans JP',sans-serif;fill:var(--hg-ink);text-anchor:middle;font-variant-numeric:tabular-nums}
.gw3-track{fill:var(--hg-line)}
.gw3-fill{fill:var(--hg-ink);transform-box:fill-box;transform-origin:0 50%;transform:scaleX(0);transition:transform .75s cubic-bezier(.2,.8,.2,1)}
.gw3-scale{fill:none;stroke:var(--hg-muted);stroke-width:1.2}
.gw3-scaletext{font:600 9.5px/1 Montserrat,'Noto Sans JP',sans-serif;fill:var(--hg-muted);text-anchor:start}
.gw3-scaletext.is-end{text-anchor:end}
.gw3-face{fill:#15171b}
.gw3-bezel{fill:none;stroke-width:3.4}
.gw3-dial .hg-gw__arc{stroke:#3a3d43;stroke-width:8}
.gw3-dial .hg-gw__arcfill{stroke:var(--hg-red);stroke-width:8;opacity:0;transition:stroke-dashoffset .75s cubic-bezier(.2,.8,.2,1),opacity .2s ease}
.gw3-dial .hg-gw__ticks path{stroke:#9ba1a9;stroke-width:1.4}
.gw3-dial .hg-gw__ticks text{fill:#c8cdd3;font-size:9px;font-weight:600}
.gw3-dial .hg-gw__needle path{stroke:#f4f5f7;stroke-width:3}
.gw3-dial .hg-gw__needle circle{fill:#c5cad0;stroke:#15171b;stroke-width:2}

/* --- Износ: косой вид протектора с разрезом --- */
.gw3-f1{stop-color:var(--gw-f1)}.gw3-f2{stop-color:var(--gw-f2)}
.gw3-l1{stop-color:var(--gw-lid1)}.gw3-l2{stop-color:var(--gw-lid2)}
.gw3-sd1{stop-color:var(--gw-sd1)}.gw3-sd2{stop-color:var(--gw-sd2)}
.gw3-pat{transition:opacity .28s ease}
.hg-gw--wear .gw3-pat[data-pat=summer],.hg-gw--wear[data-kind=summer] .gw3-pat[data-pat=winter]{opacity:0;pointer-events:none}
.hg-gw--wear[data-kind=summer] .gw3-pat[data-pat=summer]{opacity:1}
.gw3-floor{fill:var(--gw-floor)}
.gw3-slit{fill:none;stroke:#0b0c0e;stroke-width:1.3;transition:opacity .25s ease}
.gw3-cut path{fill:#0b0c0e}
.gw3-sipe{fill:none;stroke:#0f1012;stroke-width:.85;stroke-linejoin:round;opacity:.9;transition:opacity .25s ease}
.gw3-edge{fill:none;stroke:#fff;stroke-opacity:.34;stroke-width:1.2;stroke-linecap:round}
.gw3-front path.gw3-hl{fill:none;stroke:#fff;stroke-opacity:.17;stroke-width:1.2;stroke-linecap:round}
.gw3-sipe.is-groove{fill:#0f1012;stroke:none}
.gw3-cut{transition:opacity .25s ease}
.hg-gw--wear[data-sipes=off] :is(.gw3-sipe,.gw3-slit,.gw3-cut){opacity:0}
.gw3-front path,.gw3-lid{stroke:#fff;stroke-opacity:.07;stroke-width:.7}
.gw3-bar-f{fill:var(--gw-bar-f);transition:fill .25s ease}
.gw3-bar-l path{fill:var(--gw-bar-l);transition:fill .25s ease}
.gw3-bar.is-plat{--gw-bar-f:var(--gw-plat-f);--gw-bar-l:var(--gw-plat-l)}
.gw3-bar.is-slip{--gw-bar-f:var(--gw-slip-f);--gw-bar-l:var(--gw-slip-l)}
.gw3-bar.is-plat.is-out{--gw-bar-f:#e8a81f;--gw-bar-l:#ffd35c}
.gw3-bar.is-slip.is-out{--gw-bar-f:#e1402f;--gw-bar-l:#ff7360}
.gw3-bar.is-out .gw3-bar-f{filter:drop-shadow(0 0 3px color-mix(in srgb,var(--gw-bar-f) 70%,transparent))}
.hg-gw--wear .hg-gw__surface{transition:none;stroke-width:1.4}
.hg-gw--wear .hg-gw__tick.is-plat{fill:#8c5c00}
html[data-theme=dark] .hg-gw--wear .hg-gw__tick.is-plat{fill:#f2b65a}
.hg-gw--wear .hg-gw__axis .is-plat{transition:opacity .25s ease}
.hg-gw--wear[data-kind=summer] .hg-gw__axis .is-plat{opacity:0}
.gw3-l{stroke:#000;stroke-opacity:.4;stroke-width:.5}
.gw3-l.is-under{fill:#2a2c31}.gw3-l.is-belt{fill:#1b1c1f}.gw3-l.is-cap{fill:#5d6168}.gw3-l.is-ply{fill:#30323a}.gw3-l.is-liner{fill:#17181b}
.gw3-ls{stroke:#000;stroke-opacity:.35;stroke-width:.5}
.gw3-ls.is-under{fill:#1e2024}.gw3-ls.is-belt{fill:#131416}.gw3-ls.is-cap{fill:#454950}.gw3-ls.is-ply{fill:#22242a}.gw3-ls.is-liner{fill:#101113}
.gw3-cords{fill:none;stroke:#aeb4bb;stroke-width:2;stroke-linecap:round;stroke-dasharray:0 3.6}
.gw3-cords.is-ply{stroke:#8e949c;stroke-width:1.8;stroke-dasharray:0 5}

/* --- PCD: диск анфас, тормозной диск за ним, ступица со шпильками --- */
.gw3-rotor{stroke:#202225;stroke-width:1}
.gw3-vents{fill:none;stroke:#1e2023;stroke-width:9;stroke-dasharray:1 5.6;opacity:.55}
.gw3-hubflange,.gw3-pad,.gw3-padring{transform-origin:0 0;vector-effect:non-scaling-stroke;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.gw3-hubflange{stroke:#6c727a;stroke-width:1.2;opacity:.95}
.gw3-spokes{stroke:#69707a;stroke-width:.7;stroke-linejoin:round}
.gw3-spokes [data-hg-gw-spokes]{opacity:0;transition:opacity .3s ease}
.gw3-spokes [data-hg-gw-spokes="5"]{opacity:1}
.hg-gw--pcd[data-wn="4"] .gw3-spokes [data-hg-gw-spokes],.hg-gw--pcd[data-wn="6"] .gw3-spokes [data-hg-gw-spokes]{opacity:0}
.hg-gw--pcd[data-wn="4"] .gw3-spokes [data-hg-gw-spokes="4"],.hg-gw--pcd[data-wn="6"] .gw3-spokes [data-hg-gw-spokes="6"]{opacity:1}
.gw3-lipring{fill:none;stroke-width:11}
.gw3-lipedge{fill:none;stroke:#5b6068;stroke-width:.8}
.gw3-lipin{fill:none;stroke:#1c1e21;stroke-width:1.2;opacity:.8}
.gw3-pad{stroke:#6c727a;stroke-width:1.4}
.gw3-padring{fill:none;stroke:#fff;stroke-opacity:.55;stroke-width:.8}
.gw3-bore{fill:#0e0f11;stroke:#c4c9cf;stroke-width:2.4}
.gw3-boss{fill:#9da3ab;stroke:#4a4f56;stroke-width:2}
.hg-gw--pcd .hg-gw__hole{transform-origin:0 0}
.hg-gw--pcd .hg-gw__hole.is-wheel{fill:inherit;stroke-width:2.2}
.hg-gw--pcd .hg-gw__hole.is-car{fill:inherit;stroke:#3d4146;stroke-width:.8}
.hg-gw--pcd .hg-gw__hole.is-car.is-off{stroke:var(--hg-red);stroke-width:2.2}
.gw3-pcd-under{fill:none;stroke:#fff;stroke-opacity:.85;stroke-width:2.8;vector-effect:non-scaling-stroke;transform-origin:0 0;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.hg-gw--pcd .hg-gw__pcdcircle{stroke:#16181b;stroke-width:1.4;stroke-dasharray:4.5 3.5;transform-origin:0 0}
.hg-gw--pcd .hg-gw__pcdcircle.is-wheel{stroke:var(--hg-red);transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .25s ease}
.hg-gw--pcd .hg-gw__pcdcircle.is-same{opacity:0}
.gw3-legend rect{fill:var(--gw-card);stroke:var(--gw-card-line);stroke-width:1}
.gw3-legend text{font:700 10px/1 Montserrat,'Noto Sans JP',sans-serif;fill:var(--hg-ink);font-variant-numeric:tabular-nums}
.gw3-legend.is-car .gw3-legend-ic{fill:none;stroke:var(--hg-ink);stroke-width:1.4;stroke-dasharray:2.4 1.8}
.gw3-legend.is-wheel .gw3-legend-ic{fill:none;stroke:var(--hg-red);stroke-width:1.8}
.hg-gw--pcd .hg-gw__swatch.is-car{background:repeating-conic-gradient(var(--hg-ink) 0 22.5deg,transparent 22.5deg 45deg);-webkit-mask:radial-gradient(circle,transparent 3.3px,#000 3.8px);mask:radial-gradient(circle,transparent 3.3px,#000 3.8px)}

@media (prefers-reduced-motion:reduce){
 .gw3-svg *{animation:none!important;transition:none!important}
}