/* Additional Crextio-inspired direction. Original graphite styles remain intact. */
.bd-appearance{display:flex;align-items:center;gap:3px;padding:3px;border:1px solid #cbd0d5;border-radius:99px;background:#fff8}
.bd-appearance button{display:flex;align-items:center;gap:6px;padding:6px 9px;border:0;border-radius:99px;background:none;color:#525961;font-size:11px}
.bd-appearance button[aria-pressed=true]{background:#fff;box-shadow:0 2px 6px #18212c14;color:#20262e}
.bd-swatch{width:10px;height:10px;border-radius:50%;background:#303b4b}
.bd-swatch-crextio{background:#eb6b20}
.bd-tools{flex-wrap:wrap;align-items:center}

body:has(.bd-crextio){background:#efeee9;color:#33342f}
body:has(.bd-crextio) .shell::before{background:radial-gradient(ellipse at 74% 58%,#8cadcc66,transparent 48%),radial-gradient(ellipse at 14% 82%,#e4ad7766,transparent 45%),linear-gradient(150deg,#f1f2ed,#e4e9ec 65%,#efe4d7)}
body:has(.bd-crextio) .shell::after{background:radial-gradient(circle,#dba97e30,transparent 70%)}
body:has(.bd-crextio) .shell-glow-b{background:radial-gradient(circle,#dcb89640,transparent 70%)}
body:has(.bd-crextio) .main{background:transparent}
body:has(.bd-crextio) #secTitle{font-weight:450;letter-spacing:-1.2px;font-size:34px;line-height:1.1}
body:has(.bd-crextio) #secHint{color:#6f716a;font-size:11px;margin-top:7px}
/* Keep the site's original opaque navy rail and orange navigation unchanged. */
body:has(.bd-crextio) #secActions .btn-p{border-radius:99px}

.bd-crextio{--bd-orange:#e8621a;--bd-text:#33362f;--bd-muted:#6f7369;color:var(--bd-text)}
.bd-crextio .bd-toolbar{margin:3px 0 14px;gap:10px}
.bd-crextio .bd-seg{background:#ffffffa6;border-radius:99px;padding:4px}
.bd-crextio .bd-seg button{border-radius:99px;color:#62665d;font-weight:500}
.bd-crextio .bd-seg button[aria-pressed=true]{background:#373b33;color:#fff;box-shadow:none}
.bd-crextio .bd-tool{border:1px solid #d7d9d0;border-radius:99px;background:#fff8;color:#52564d;box-shadow:none;font-weight:450}
.bd-crextio .bd-appearance{border-color:#d7d9d0;background:#e5e6df}
.bd-crextio .bd-appearance button[aria-pressed=true]{background:#fffdf8;color:#484c42;box-shadow:none}
.bd-crextio button:focus-visible,.bd-detail-crextio button:focus-visible{outline:2px solid #874321;outline-offset:3px}
.bd-crextio .bd-shell{padding:0;border-radius:0;background:none;box-shadow:none;color:var(--bd-text)}
.bd-crextio .bd-summary{display:grid;grid-template-columns:145px repeat(3,minmax(0,1fr));gap:10px;min-height:64px;padding:0;margin-bottom:12px;border-radius:0;background:none;box-shadow:none}
.bd-crextio .bd-summary>b{font-size:11px;font-weight:450;color:#656b60;max-width:100px;line-height:1.5}
.bd-crextio .bd-summary>b:before{content:'';display:block;width:24px;height:3px;border-radius:3px;background:#e8621a;margin-bottom:8px}
.bd-crextio .bd-summary button{height:64px;padding:12px 17px;border-radius:22px;gap:12px;background:#ffffffa6;color:#555b50;font-size:11px;border:1px solid #fff8;justify-content:start}
.bd-crextio .bd-summary button:nth-of-type(1){color:#fff}
.bd-crextio .bd-summary button:nth-of-type(3){background:repeating-linear-gradient(125deg,#ffffff60 0 2px,transparent 2px 7px),#e3e4dc}
.bd-crextio .bd-summary strong{font-size:34px;letter-spacing:-1.4px;font-weight:450;color:inherit}
.bd-crextio .bd-collection{font-size:10px;line-height:1.5;color:#77523a;margin:0 2px 12px}
.bd-crextio .bd-workspace{gap:12px}
.bd-crextio .bd-column{gap:12px}
.bd-crextio .bd-card{--bd-muted:#c0d4ec;border-radius:23px;padding:15px;color:#edf5ff}
.bd-crextio .bd-card-head{font-size:14px;font-weight:500;color:#f2f7ff}
.bd-crextio .bd-card-head>span:last-child{display:grid;place-items:center;min-width:25px;height:25px;background:#ffffff12;border-radius:50%;color:#d1e1f3;font-weight:400}
.bd-crextio .bd-card .bd-seg{padding:3px;background:#ffffff12;border-radius:99px}
.bd-crextio .bd-card .bd-seg button{color:#d4e2f4}
.bd-crextio .bd-card .bd-seg button[aria-pressed=true]{color:#fff}
.bd-crextio .bd-number{align-items:end}
.bd-crextio .bd-number strong{font-weight:450;letter-spacing:-1.2px;font-size:36px;color:#fff}
.bd-crextio .bd-number small{font-size:10px;color:#c0d4ec}
.bd-crextio .bd-number>span{color:#c0d4ec;font-size:10px}
.bd-crextio .bd-money-total{color:#ffb27e;font-size:12px}
.bd-crextio .bd-money-total small{color:#c0d4ec;font-size:9px}
.bd-crextio .bd-split{border-color:#c8ddf129;gap:8px}
.bd-crextio .bd-split>span{color:#c0d4ec;font-size:10px}
.bd-crextio .bd-split b{color:#f2f7ff;font-size:18px;font-weight:500}
.bd-crextio .bd-commerce-split small,.bd-crextio .bd-fbs-card td small{color:#c0d4ec}
.bd-crextio .bd-note{border:0;border-radius:99px;background:#ed8c3920;color:#ffd0aa;font-size:10px!important;padding:6px 10px}
.bd-crextio .bd-note:hover{background:#ed8c3935}
.bd-crextio .bd-note.bd-good{background:#6cc9941a;color:#b5e3c7}
.bd-crextio .bd-note.bd-muted{background:#c0d4ec12;color:#d1e1f3}
.bd-crextio .bd-route{background:#ffffff0d;border-radius:12px;color:#c0d4ec;font-size:11px}
.bd-crextio .bd-route b{color:#f2f7ff}
.bd-crextio .bd-cabinets summary{border:1px solid #d8eaff44;border-radius:99px;background:#ffffff12;color:#edf5ff;font-size:10px;padding:5px 8px}
.bd-crextio .bd-cab-menu{background:#213853;border-color:#d8eaff55;border-radius:19px;box-shadow:0 18px 40px #091e3666}
.bd-crextio .bd-cab-option{color:#edf5ff}
.bd-crextio .bd-cab-option b{color:#ffb27e}
.bd-crextio .bd-cab-option:hover{background:#ffffff12}
.bd-crextio .bd-cab-option:first-child,.bd-crextio .bd-cab-menu>small{border-color:#c8ddf129}
.bd-crextio .bd-cab-menu>small{color:#c0d4ec}

/* Each card and the conveyor share one navy glass surface; gaps stay clear. */
.bd-crextio .bd-center{gap:9px;padding:0;border-radius:0;background:none;border:0;box-shadow:none;color:#edf5ff}
.bd-crextio .bd-flow-tabs{background:#ffffff12;padding:3px;gap:2px;align-self:center}
.bd-crextio .bd-flow-tabs button{font-size:11px;padding:7px 13px;color:#536071}
.bd-crextio .bd-flow-tabs button[aria-pressed=true]{color:#fff}
.bd-crextio .bd-glass{padding:13px;border-radius:23px}
.bd-crextio .bd-card,.bd-crextio .bd-glass{
 position:relative;border:1px solid #e2f2ff99;
 background:radial-gradient(ellipse at 0 0,#ecf8ff20,transparent 55%),linear-gradient(145deg,#18324bdb,#1d3654c9 60%,#294463d1);
 box-shadow:0 14px 30px #12294225,0 2px 6px #12294220,inset 0 2px 2px -1px #ffffffb3,inset 2px 0 2px -1px #e9f7ff80,inset -2px -2px 2px -1px #c6eaff80,inset 0 0 16px #cbeaff12;
 backdrop-filter:blur(24px) saturate(155%);-webkit-backdrop-filter:blur(24px) saturate(155%);
 transition:box-shadow .3s ease,border-color .3s ease;
}
/* Refractive rim and soft reflections sit above the surface, never above input. */
.bd-crextio .bd-card::before,.bd-crextio .bd-glass::before{
 content:'';position:absolute;inset:3px;border-radius:19px;pointer-events:none;
 border:1px solid #ffffff12;border-top-color:#ffffff4d;border-bottom-color:#b8dfff47;
 box-shadow:inset 2px 2px 3px -2px #fff9,inset -2px -2px 4px -2px #b5e3ff99;
 background:linear-gradient(115deg,#ffffff0d,transparent 27% 78%,#c5eaff0c);
}
.bd-crextio .bd-card::after,.bd-crextio .bd-glass::after{
 content:'';position:absolute;left:9%;right:25%;top:0;height:1px;pointer-events:none;
 background:linear-gradient(90deg,transparent,#fff,transparent);box-shadow:0 1px 8px #d9f2ff80;
}
@media(hover:hover){
 .bd-crextio .bd-card:hover,.bd-crextio .bd-glass:hover{border-color:#eaf6ffd1;box-shadow:0 16px 32px #12294230,0 2px 6px #12294220,inset 0 2px 3px -1px #fff,inset 2px 0 3px -1px #e9f7ffa6,inset -2px -2px 3px -1px #c6eaffa6,inset 0 0 20px #cbeaff1a}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .bd-crextio .bd-card,.bd-crextio .bd-glass{background:linear-gradient(145deg,#293f57,#233a55)}
}
@media(prefers-reduced-motion:reduce){
 .bd-crextio .bd-card,.bd-crextio .bd-glass{transition:none}
}
.bd-crextio .bd-conveyor-head{border-color:#c2daef33;padding-bottom:10px}
.bd-crextio .bd-conveyor-head h2{color:#d1e1f3;font-size:12px;font-weight:450}
.bd-crextio .bd-conveyor-head strong{color:#fff;font-size:38px;letter-spacing:-1.5px;font-weight:450}
.bd-crextio .bd-conveyor-head small{color:#c0d4ec;font-size:10px}
.bd-crextio .bd-tempo{border:1px solid #d8eaff44;border-radius:99px;background:#ffffff12;color:#edf5ff;font-size:10px!important;padding:8px 11px}
.bd-crextio .bd-lanes{scrollbar-color:#b9d3ef55 transparent}
.bd-crextio .bd-lane{border-color:#c8ddf129}
.bd-crextio .bd-lane-label b{font-weight:500;color:#f2f7ff}
.bd-crextio .bd-lane-label small{color:#c3d7ed;font-size:9px}
.bd-crextio .bd-track{border:1px solid #e0edff66;border-radius:99px;background:linear-gradient(180deg,#eaf6ff24,#d5eaff09 48%,#c5e6ff1c);box-shadow:inset 0 2px 3px #ffffff24,inset 0 -1px 2px #dcf0ff47,0 1px 2px #071a3026}
.bd-crextio .bd-photo{border:2px solid #fff;background:#dedacb;box-shadow:0 2px 5px #4f4d3319}
.bd-crextio .bd-photo>span{color:#596144}
.bd-crextio .bd-count{font-weight:450;font-size:25px;letter-spacing:-1px;color:#805130}
.bd-crextio .bd-lane-signal{color:#b5e3c7;font-size:9px!important}
.bd-crextio .bd-lane[data-status=quiet] .bd-lane-signal,.bd-crextio .bd-lane[data-status=stale] .bd-lane-signal{color:#ffd39a}
.bd-crextio .bd-lane[data-status=offline] .bd-lane-signal{color:#ffb3a7}
.bd-crextio .bd-lane[data-status=missing] .bd-lane-signal,.bd-crextio .bd-track-empty{color:#c7d9ed}
.bd-crextio .bd-time{color:#bfd2e8;font-size:9px}
.bd-crextio .bd-glass footer{color:#c8dbef;font-size:9px;gap:7px}
.bd-crextio .bd-bottom{color:#747a6b;border-color:#bcc1b34a;font-size:9px;margin-top:12px;padding-top:10px}
.bd-crextio .bd-empty{color:#d1e1f3}
.bd-crextio th,.bd-crextio td{border-color:#c8ddf129}
.bd-crextio thead th{color:#c0d4ec}
.bd-crextio td{color:#ffb27e}
.bd-crextio tbody th{color:#edf5ff}

.bd-detail-crextio{background:#f4f3edf5;color:#353e2e;border-color:#fff;box-shadow:-20px 0 70px #333c292e}
.bd-detail-crextio header{background:#f4f3edf5;border-color:#d9ddcf}
.bd-detail-crextio header small{color:#8b5735}
.bd-detail-crextio h2,.bd-detail-crextio h3{color:#3a4531;font-weight:500}
.bd-detail-crextio header button{color:#606b53;background:#fff;border-color:#d8ddce;border-radius:50%}
.bd-detail-crextio p,.bd-detail-crextio td small,.bd-detail-crextio .bd-split>span{color:#6b765d}
.bd-detail-crextio .bd-split b{color:#39462c}
.bd-detail-crextio .bd-split small{color:#6b765d}
.bd-detail-crextio td,.bd-detail-crextio th,.bd-detail-crextio .bd-split{border-color:#d6dccb}
.bd-detail-crextio .bd-explain{background:#e9ecdf;border-color:#d9dfcd;border-radius:20px}
.bd-detail-crextio .bd-link{border-radius:99px}
.bd-detail-crextio .bd-event{color:#3c4c2c;border-color:#d6dccb}
.bd-detail-crextio .bd-event span{color:#728161}

/* Keep orange controls opaque on the navy glass surfaces. */
body:has(.bd-crextio) #secActions .btn-p,
.bd-crextio .bd-summary button:nth-of-type(1),
.bd-crextio .bd-flow-tabs button[aria-pressed=true],
.bd-crextio .bd-card .bd-seg button[aria-pressed=true],
.bd-detail-crextio .bd-link{
 background:linear-gradient(120deg,#e0651f,#c2470f);
 color:#fff;border:1px solid transparent;box-shadow:0 6px 16px #c2470f30;
 backdrop-filter:none;-webkit-backdrop-filter:none;
}
.bd-crextio .bd-money-total,.bd-crextio .bd-count,.bd-crextio td,.bd-crextio .bd-cab-option b{color:#ffb27e}
.bd-crextio .bd-center .bd-count{color:#ffb27e}
.bd-crextio .bd-card button:focus-visible,.bd-crextio .bd-glass button:focus-visible,.bd-crextio .bd-card summary:focus-visible{outline:2px solid #ffbd82;outline-offset:3px}

@media(min-width:960px){
 .bd-crextio .bd-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);height:clamp(650px,calc(100svh - 290px),880px)}
 .bd-crextio .bd-center{grid-column:auto;grid-row:auto;min-height:0}
 .bd-crextio .bd-column{min-height:0;grid-template-rows:minmax(0,1.24fr) minmax(0,1fr) minmax(0,1.06fr)}
 .bd-crextio .bd-lanes{min-height:0;overflow-y:auto}
 .bd-crextio .bd-card{padding:10px 14px;gap:5px}
 .bd-crextio .bd-card-head>span:last-child{min-width:22px;height:22px}
 .bd-crextio .bd-card .bd-number strong{font-size:32px}
 .bd-crextio .bd-note{padding:4px 10px}
 .bd-crextio .bd-commerce-card .bd-number strong{font-size:31px}
 .bd-crextio .bd-lane{grid-template-columns:76px minmax(0,1fr) 30px;gap:4px 6px;padding:8px 0}
 .bd-crextio .bd-fbs-card td small{font-size:9px;margin-left:3px}
 .bd-crextio .bd-fbs-card td{font-size:11px}
 .bd-crextio .bd-glass{padding:11px;min-height:0}
}
@media(max-width:959px){
 .bd-appearance button{padding:5px 7px}
 .bd-crextio .bd-column{grid-template-rows:repeat(3,minmax(205px,1fr))}
 .bd-crextio .bd-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
 .bd-crextio .bd-summary>b{grid-column:1/-1;max-width:none;display:flex;align-items:center;gap:7px}
 .bd-crextio .bd-summary>b:before{margin:0;width:16px;height:2px}
 .bd-crextio .bd-summary button{height:64px}
 .bd-crextio .bd-lane{padding:11px 0}
}
@media(max-width:650px){
 .bd-appearance{margin-right:auto}
 .bd-tools{width:100%;gap:5px;justify-content:end}
 .bd-tool{padding:8px;font-size:10px!important}
 .bd-crextio .bd-toolbar{gap:8px}
 .bd-crextio .bd-summary{gap:6px}
 .bd-crextio .bd-summary button{padding:10px 9px;gap:4px;align-items:start;height:82px;border-radius:18px;font-size:9px;line-height:1.25}
 .bd-crextio .bd-summary strong{font-size:29px}
 .bd-crextio .bd-center{padding:0;border-radius:0}
 .bd-crextio .bd-glass{padding:10px}
 .bd-crextio .bd-lane{grid-template-columns:68px minmax(0,1fr) 27px;gap:4px}
 .bd-crextio .bd-lane-label b{font-size:10px}
 .bd-crextio .bd-card{min-height:215px;padding:16px}
 .bd-crextio .bd-conveyor-head strong{font-size:32px}
 .bd-crextio .bd-conveyor-head small{font-size:9px}
 .bd-crextio .bd-count{font-size:22px}
 body:has(.bd-crextio) #secTitle{font-size:29px}
}

@media(min-width:960px) and (max-width:1150px){
 .bd-crextio .bd-card{padding:10px;gap:5px;min-height:0}
 .bd-crextio .bd-card .bd-number strong{font-size:27px}
 .bd-crextio .bd-card .bd-number>span{font-size:9px}
 .bd-crextio .bd-card .bd-split{padding-top:5px}
 .bd-crextio .bd-card .bd-split b{font-size:16px}
 .bd-crextio .bd-fbs-card th,.bd-crextio .bd-fbs-card td{padding:2px;font-size:9px}
 .bd-crextio .bd-fbs-card td small{display:block;margin-left:0;font-size:8px}
 .bd-crextio .bd-flow-tabs button{padding:7px 9px;font-size:10px}
 .bd-crextio .bd-lane{grid-template-columns:67px minmax(0,1fr) 27px}
 .bd-crextio .bd-lane-label b{font-size:10px}
 .bd-crextio .bd-time{grid-row:3;text-align:left}
}
