@charset "UTF-8";

:root {
  --u: calc(100vw / 1920);
  --paper: #141A0F;
  --bg: #141A0F;
  --nav: #11190E;
  --surface: #0C170E;
  --raised: #1D281E;
  --deep: #061008;
  --hairline: #2C331F;
  --frame: #3A5031;
  --text: #EDEFE6;
  --muted: #8B9480;
  --sunken: #555E4C;
  --ticket: #E3DAC5;
  --cyan: #49F1E1;
  --pink: #FF4FB8;
  --green: #20F0A0;
  --font-display: Montserrat, sans-serif;
  --font-body: Karla, sans-serif;
  --font-mono: "DM Mono", monospace;
  --panel-frame-width: max(1px, calc(2 * var(--u)));
  --panel-frame-color: #53694a;
  --panel-frame-radius: calc(7 * var(--u));
  --mechanical-ease: cubic-bezier(.18,.88,.28,1.18);
  --quick: 210ms;
  --settle: 620ms;
}

*, *::before, *::after { box-sizing: border-box; }
html { margin: 0; width: 100%; min-width: 0; background: var(--paper); color-scheme: dark; -webkit-text-size-adjust: 100%; }
body { margin: 0; width: 100%; min-width: 0; min-height: 100vh; overflow-x: hidden; background: var(--paper); color: var(--text); font-family: var(--font-body); font-size: max(12px, calc(16 * var(--u))); line-height: 1.4; display: flex; flex-direction: column; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
img, svg, video, canvas { display: block; max-width: 100%; }
:focus-visible { outline: 1px solid var(--cyan); outline-offset: calc(3 * var(--u)); }

/* One frame owns ground and gutters for every route. */
.page-frame { flex: 1 0 auto; width: 100%; min-height: calc(240 * var(--u)); padding-inline: calc(18 * var(--u)); overflow: clip; background: var(--paper); transform-origin: 50% 0; }
.route-mount { width: 100%; min-height: calc(12 * var(--u)); }
main.is-leaving { opacity: .72; transform: translateX(calc(-8 * var(--u))) rotate(-.04deg); transition: opacity var(--quick) linear, transform var(--quick) var(--mechanical-ease); }

/* Authored desktop navigation chrome. */
[data-chrome="nav"] { width: 100%; height: calc(112 * var(--u)); padding: calc(12 * var(--u)) calc(18 * var(--u)); background: #141a0f; border-bottom: 1px solid #405336; font-family: Karla, Arial, sans-serif; position: relative; z-index: 50; }
[data-chrome="nav"] > .case { height: calc(88 * var(--u)); display: flex; align-items: center; gap: 0; background: linear-gradient(180deg, #10170d, #121a0f); border: calc(2 * var(--u)) solid #3a5031; border-radius: calc(6 * var(--u)); box-shadow: inset 0 0 0 calc(3 * var(--u)) #0b1109, inset 0 0 0 calc(4 * var(--u)) #263720; padding: 0 calc(20 * var(--u)); }
[data-chrome="nav"] .brand { width: calc(276 * var(--u)); height: calc(64 * var(--u)); display: flex; align-items: center; gap: calc(14 * var(--u)); padding: calc(5 * var(--u)) calc(12 * var(--u)) calc(5 * var(--u)) calc(5 * var(--u)); border-right: 1px solid #3b4b32; flex: none; }
[data-chrome="nav"] .brand img { width: calc(75 * var(--u)); height: calc(54 * var(--u)); object-fit: contain; }
[data-chrome="nav"] .brand b { font-family: Montserrat, Arial, sans-serif; font-size: calc(25 * var(--u)); letter-spacing: calc(4 * var(--u)); }
[data-chrome="nav"] .links { height: 100%; display: flex; align-items: center; flex: 1; min-width: 0; }
[data-chrome="nav"] .route { position: relative; height: calc(64 * var(--u)); display: grid; place-items: center; padding: 0 calc(26 * var(--u)); border-right: 1px solid #33452b; font-size: max(12px, calc(16 * var(--u))); font-weight: 600; white-space: nowrap; }
[data-chrome="nav"] .route::after { content: ""; position: absolute; left: calc(24 * var(--u)); right: calc(24 * var(--u)); bottom: calc(2 * var(--u)); height: calc(3 * var(--u)); background: transparent; transform: scaleX(.08); transition: transform var(--quick) var(--mechanical-ease), background-color var(--quick) linear; }
[data-chrome="nav"] .route.is-active { color: #49f1e1; }
[data-chrome="nav"] .route.is-active::after { background: #49f1e1; box-shadow: 0 0 calc(10 * var(--u)) rgba(73,241,225,.6); transform: scaleX(1); }
[data-chrome="nav"] .actions { display: flex; align-items: center; gap: calc(14 * var(--u)); margin-left: calc(18 * var(--u)); }
[data-chrome="nav"] .button { height: calc(54 * var(--u)); display: grid; place-items: center; border: 1px solid #3f5935; border-radius: calc(5 * var(--u)); background: #11180e; font-weight: 700; font-size: max(12px, calc(17 * var(--u))); transition: transform var(--quick) var(--mechanical-ease); }
[data-chrome="nav"] .button:hover { transform: translateY(calc(2 * var(--u))) scale(.985); }
[data-chrome="nav"] .x { width: calc(60 * var(--u)); font-family: Montserrat, Arial, sans-serif; font-size: calc(25 * var(--u)); }
[data-chrome="nav"] .telegram { width: calc(126 * var(--u)); }
.menu-toggle, .mobile-drawer { display: none; }

/* Authored footer chrome. */
[data-chrome="footer"] { width: 100%; height: calc(124 * var(--u)); padding: calc(8 * var(--u)) calc(18 * var(--u)) calc(10 * var(--u)); background: #141a0f; font-family: Karla, Arial, sans-serif; flex: none; }
[data-chrome="footer"] > .case { height: calc(106 * var(--u)); display: grid; grid-template-columns: calc(250 * var(--u)) 1fr auto; grid-template-rows: calc(66 * var(--u)) calc(28 * var(--u)); align-items: center; border: calc(2 * var(--u)) solid #3a5031; border-radius: calc(6 * var(--u)); box-shadow: inset 0 0 0 calc(3 * var(--u)) #0b1109, inset 0 0 0 calc(4 * var(--u)) #263720; background: linear-gradient(180deg,#11190e,#10170d); padding: calc(4 * var(--u)) calc(20 * var(--u)) 0; }
[data-chrome="footer"] .brand { grid-row: 1; display: flex; align-items: center; gap: calc(12 * var(--u)); border-right: 1px solid #3b4b32; height: calc(52 * var(--u)); }
[data-chrome="footer"] .brand img { width: calc(62 * var(--u)); height: calc(44 * var(--u)); object-fit: contain; }
[data-chrome="footer"] .brand b { font-family: Montserrat, Arial, sans-serif; font-size: calc(22 * var(--u)); letter-spacing: calc(3 * var(--u)); }
[data-chrome="footer"] .voice { padding-left: calc(28 * var(--u)); font-family: 'DM Mono', monospace; font-size: max(12px, calc(15 * var(--u))); letter-spacing: calc(.1 * var(--u)); }
[data-chrome="footer"] .actions { display: flex; gap: calc(12 * var(--u)); }
[data-chrome="footer"] .button { height: calc(44 * var(--u)); display: grid; place-items: center; border: 1px solid #3f5935; border-radius: calc(5 * var(--u)); background: #11180e; font-weight: 700; font-size: max(12px, calc(16 * var(--u))); transition: transform var(--quick) var(--mechanical-ease); }
[data-chrome="footer"] .button:hover { transform: translateY(calc(2 * var(--u))) scale(.985); }
[data-chrome="footer"] .x { width: calc(58 * var(--u)); font-family: Montserrat, Arial, sans-serif; font-size: calc(23 * var(--u)); }
[data-chrome="footer"] .telegram { width: calc(128 * var(--u)); }
[data-chrome="footer"] .ca { width: calc(210 * var(--u)); height: calc(44 * var(--u)); display: grid; grid-template-columns: auto 1fr; place-items: center; gap: calc(12 * var(--u)); padding: 0 calc(16 * var(--u)); border: 1px solid #ff4fb8; border-radius: calc(5 * var(--u)); background: #ff4fb8; color: #141a0f; font: 800 max(12px, calc(16 * var(--u))) var(--font-body); }
[data-chrome="footer"] .ca span { padding-right: calc(12 * var(--u)); border-right: 1px solid rgba(20,26,15,.4); }
[data-chrome="footer"] .source { grid-column: 1 / 4; align-self: stretch; display: flex; align-items: center; border-top: 1px solid #33452b; font-family: 'DM Mono', monospace; font-size: max(12px, calc(11 * var(--u))); color: #c8d0c4; }

/* TARIFF motion helpers: needle settle and ticket-feed mechanics. */
[data-tariff-reveal] { opacity: 0; transform: translateX(calc(-12 * var(--u))) rotate(-.16deg); transform-origin: 0 50%; }
[data-tariff-reveal][data-revealed="true"] { opacity: 1; transform: translateX(0) rotate(0); transition: opacity 180ms linear, transform var(--settle) var(--mechanical-ease); }
[data-motion="needle"] { transform-origin: var(--needle-origin, 50% 88%); animation: needle-settle var(--settle) var(--mechanical-ease) both; }
[data-motion="ticket"] { transform-origin: 50% 0; animation: ticket-print 720ms steps(7, end) both; }
[data-grow] { transform: scaleX(.02); transform-origin: 0 50%; opacity: .72; }
[data-grow][data-revealed="true"], [data-grow].is-live { transform: scaleX(1); opacity: 1; transition: transform var(--settle) var(--mechanical-ease), opacity var(--quick) linear; }
.is-ticking { transform: translateY(calc(-1 * var(--u))); }
@keyframes needle-settle { 0% { transform: rotate(-22deg); } 48% { transform: rotate(7deg); } 72% { transform: rotate(-2.5deg); } 88% { transform: rotate(1deg); } 100% { transform: rotate(0); } }
@keyframes ticket-print { 0% { opacity: .2; transform: translateY(calc(-20 * var(--u))) scaleY(.18); } 72% { opacity: 1; transform: translateY(calc(2 * var(--u))) scaleY(1.012); } 100% { opacity: 1; transform: translateY(0) scaleY(1); } }

/* Shared nine-slice-style industrial edge. Route panels keep one crisp frame, with
   the texture, bevel, and corner fasteners living in this reusable component. */
.page-frame .industrial-frame {
  position: relative;
  border-color: transparent !important;
  box-shadow: none !important;
}
.page-frame .industrial-frame__edge {
  all: initial;
  box-sizing: border-box;
  display: block;
  position: absolute;
  inset: 0;
  z-index: 24;
  pointer-events: none;
  border: var(--panel-frame-width) solid var(--panel-frame-color);
  border-radius: var(--panel-frame-radius);
  background:
    radial-gradient(circle at calc(13 * var(--u)) calc(13 * var(--u)), #081009 0 calc(3 * var(--u)), #70826a calc(3.5 * var(--u)) calc(5 * var(--u)), transparent calc(5.5 * var(--u))),
    radial-gradient(circle at calc(100% - 13 * var(--u)) calc(13 * var(--u)), #081009 0 calc(3 * var(--u)), #70826a calc(3.5 * var(--u)) calc(5 * var(--u)), transparent calc(5.5 * var(--u))),
    radial-gradient(circle at calc(13 * var(--u)) calc(100% - 13 * var(--u)), #081009 0 calc(3 * var(--u)), #70826a calc(3.5 * var(--u)) calc(5 * var(--u)), transparent calc(5.5 * var(--u))),
    radial-gradient(circle at calc(100% - 13 * var(--u)) calc(100% - 13 * var(--u)), #081009 0 calc(3 * var(--u)), #70826a calc(3.5 * var(--u)) calc(5 * var(--u)), transparent calc(5.5 * var(--u)));
  box-shadow: none;
}

.page-frame .h13-hero::after {
  border: var(--panel-frame-width) solid var(--panel-frame-color);
  box-shadow: none;
}

.page-frame .weigh-route .formula-status {
  color: var(--cyan);
  font: 700 calc(11 * var(--u))/1 "DM Mono", monospace;
  letter-spacing: .12em;
}
.page-frame button.copy-unavailable { display: none !important; }

/* fixU2 route corrections: consistent rhythm and user-reviewed detail states. */
.page-frame .declaration-route .compact-ledger,
.page-frame .declaration-route .ledger-spacer { display: none !important; }
.page-frame .declaration-route .press-ticket { margin-bottom: calc(14 * var(--u)) !important; }
.page-frame .declaration-route .press-ticket::before {
  content: "2. WEIGH TICKET";
  position: absolute;
  top: calc(18 * var(--u));
  left: calc(25 * var(--u));
  z-index: 18;
  padding: calc(7 * var(--u)) calc(12 * var(--u));
  border: 1px solid #53694a;
  border-radius: calc(4 * var(--u));
  background: rgba(6,16,8,.9);
  color: var(--text);
  font: 500 calc(18 * var(--u))/1 var(--font-mono);
  letter-spacing: calc(1 * var(--u));
}
.page-frame .declaration-route .full-ledger { margin-bottom: calc(14 * var(--u)) !important; }
.page-frame .declaration-route .lower {
  height: calc(426 * var(--u)) !important;
  padding: 0 !important;
  grid-template-rows: calc(270 * var(--u)) calc(142 * var(--u)) !important;
  gap: calc(14 * var(--u)) !important;
  border-top: 0 !important;
  background: transparent !important;
}

.page-frame .heavy-route .detail[data-open="true"] { height: calc(150 * var(--r)) !important; }
.page-frame .heavy-route .detail > div { padding-top: calc(12 * var(--r)) !important; padding-bottom: calc(10 * var(--r)) !important; }
.page-frame .heavy-route .detail p { margin-bottom: calc(8 * var(--r)) !important; }
.page-frame .heavy-route .aftertable { height: calc(40 * var(--r)) !important; border: 0 !important; }
.page-frame .heavy-route .railgap { height: calc(24 * var(--r)) !important; border: 0 !important; }
.page-frame .heavy-route .ticketframe { height: calc(372 * var(--r)) !important; }
.page-frame .heavy-route .ticket { grid-template-rows: calc(78 * var(--r)) 1fr calc(76 * var(--r)) !important; }
.page-frame .heavy-route .ticketmeta { position: relative; z-index: 3; line-height: 1.35; }

.page-frame .seconds-route .dialcopy { text-shadow: 0 calc(2 * var(--u)) calc(3 * var(--u)) #000; }
.page-frame .seconds-route .dialcopy .top { padding-top: calc(50 * var(--u)) !important; font-size: calc(19 * var(--u)) !important; }
.page-frame .seconds-route .dialcopy .center { margin-top: calc(44 * var(--u)) !important; }
.page-frame .seconds-route .dialcopy strong { font-size: calc(44 * var(--u)) !important; line-height: 1 !important; }
.page-frame .seconds-route .dialcopy em { margin-top: calc(3 * var(--u)); font-size: calc(24 * var(--u)) !important; }
.page-frame .seconds-route .ticklabel { padding: calc(2 * var(--u)) calc(5 * var(--u)); border-radius: calc(3 * var(--u)); background: rgba(5,12,7,.72); }
.page-frame .seconds-route .t0 { left: 24% !important; bottom: calc(42 * var(--u)) !important; }
.page-frame .seconds-route .t2475 { left: 20% !important; top: calc(178 * var(--u)) !important; }
.page-frame .seconds-route .t4950 { right: 19% !important; top: calc(178 * var(--u)) !important; }
.page-frame .seconds-route .t7425 { right: 19% !important; bottom: calc(42 * var(--u)) !important; }
.page-frame .seconds-route .dialcopy .basis { bottom: calc(20 * var(--u)) !important; left: 41% !important; }

.page-frame .cal-route .break,
.page-frame .cal-route .midgap,
.page-frame .cal-route .invgap,
.page-frame .cal-route .footgap { height: calc(15 * var(--u)) !important; border: 0 !important; }

.page-frame .tare-route .mid-gap,
.page-frame .tare-route .section-gap,
.page-frame .tare-route .contact-gap,
.page-frame .tare-route .slogan-gap { height: 24px !important; border: 0 !important; background: transparent !important; }
.page-frame .tare-route .contact-option {
  height: 92px !important;
  grid-template-columns: 58px 1fr auto !important;
  gap: 16px;
  padding: 10px 16px !important;
  border-width: 2px !important;
  background: linear-gradient(180deg,#0d1a10,#08120a);
}
.page-frame .tare-route .contact-option svg { width: 44px !important; height: 44px !important; }
.page-frame .tare-route .contact-option div { padding-left: 16px !important; }
.page-frame .tare-route .contact-option .contact-action {
  padding: 8px 10px;
  border: 1px solid currentColor;
  border-radius: 4px;
  font: 700 12px/1 var(--font-mono);
  white-space: nowrap;
}
.page-frame .tare-route .contact-option.ca-status .contact-action { color: var(--muted); border-color: #526b57; }

@media (max-width: 1023px) {
  :root { --u: 1px; }
  body { font-size: 16px; }
  [data-chrome="nav"] { height: 78px; padding: 8px 10px; }
  [data-chrome="nav"] > .case { height: 62px; padding: 0 12px; border-width: 2px; border-radius: 6px; box-shadow: inset 0 0 0 3px #0b1109, inset 0 0 0 4px #263720; }
  [data-chrome="nav"] .brand { width: auto; height: 52px; gap: 8px; padding: 4px 12px 4px 3px; border: 0; }
  [data-chrome="nav"] .brand img { width: 50px; height: 42px; }
  [data-chrome="nav"] .brand b { font-size: 18px; letter-spacing: 3px; }
  [data-chrome="nav"] .links, [data-chrome="nav"] > .case > .actions { display: none; }
  .menu-toggle { margin-left: auto; width: 82px; height: 42px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid #3f5935; border-radius: 5px; background: #11180e; font-weight: 700; }
  .menu-toggle i, .menu-toggle i::before, .menu-toggle i::after { width: 14px; height: 1px; display: block; background: var(--cyan); content: ""; transition: transform var(--quick) var(--mechanical-ease); }
  .menu-toggle i::before { transform: translateY(-5px); }
  .menu-toggle i::after { transform: translateY(4px); }
  .menu-open .menu-toggle i { background: transparent; }
  .menu-open .menu-toggle i::before { transform: rotate(45deg); }
  .menu-open .menu-toggle i::after { transform: translateY(-1px) rotate(-45deg); }
  .mobile-drawer { position: absolute; top: 77px; left: 10px; right: 10px; display: grid; gap: 10px; padding: 12px; border: 2px solid var(--frame); border-radius: 6px; background: var(--nav); box-shadow: inset 0 0 0 3px #0b1109, inset 0 0 0 4px #263720; opacity: 0; transform: translateY(-8px) scaleY(.96); transform-origin: 50% 0; pointer-events: none; transition: opacity var(--quick) linear, transform var(--quick) var(--mechanical-ease); }
  .menu-open .mobile-drawer { opacity: 1; transform: translateY(0) scaleY(1); pointer-events: auto; }
  .mobile-drawer nav { display: grid; grid-template-columns: 1fr 1fr; }
  [data-chrome="nav"] .mobile-drawer .route { height: 43px; padding: 0 10px; border-right: 0; border-bottom: 1px solid var(--hairline); justify-items: start; font-size: 14px; }
  [data-chrome="nav"] .mobile-drawer .route::after { left: 9px; right: auto; width: 28px; bottom: 4px; height: 2px; }
  .mobile-actions { display: grid; grid-template-columns: 52px 1fr; gap: 8px; }
  [data-chrome="nav"] .mobile-actions .button { width: auto; height: 44px; font-size: 14px; }
  .page-frame { padding-inline: 10px; min-height: 24px; }
  [data-chrome="footer"] { height: auto; min-height: 218px; padding: 8px 10px 10px; }
  [data-chrome="footer"] > .case { height: auto; min-height: 200px; grid-template-columns: 1fr; grid-template-rows: auto; gap: 8px; padding: 12px; }
  [data-chrome="footer"] .brand { grid-row: auto; height: 48px; border-right: 0; border-bottom: 1px solid #3b4b32; }
  [data-chrome="footer"] .brand img { width: 54px; height: 39px; }
  [data-chrome="footer"] .brand b { font-size: 19px; }
  [data-chrome="footer"] .voice { padding: 0; font-size: 12px; }
  [data-chrome="footer"] .actions { display: grid; grid-template-columns: 52px 1fr 1.5fr; gap: 8px; }
  [data-chrome="footer"] .button, [data-chrome="footer"] .x, [data-chrome="footer"] .telegram, [data-chrome="footer"] .ca { width: auto; height: 40px; font-size: 12px; }
  [data-chrome="footer"] .source { grid-column: 1; min-height: 34px; font-size: 12px; line-height: 1.25; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
  main.is-leaving, [data-tariff-reveal], [data-grow], [data-motion] { opacity: 1 !important; transform: none !important; }
}