:root{--ink:#2b1b35;--muted:#807286;--bg:#f8f5fa;--line:#e8e0ed;--green:#176b4c;--dark:#8e01b1}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 "Segoe UI",Arial,sans-serif}button,input,select{font:inherit}button,.button,.upload{cursor:pointer;border:0;border-radius:9px;padding:11px 16px;background:var(--dark);color:#fff;text-decoration:none;font-weight:600}button:hover,.button:hover,.upload:hover{filter:brightness(1.1)}button:disabled{opacity:.6;cursor:wait}.secondary{background:#fff;border:1px solid var(--line);color:var(--ink)}input,select{padding:11px 13px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);min-width:0}input:focus,select:focus{outline:2px solid #ba73cc;outline-offset:1px}.hidden{display:none!important}#workspace{display:flex;min-height:100vh}aside{width:242px;flex-shrink:0;padding:28px 17px;background:#fff;border-right:1px solid var(--line);position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:5px}.logo{display:flex;gap:11px;align-items:center;color:var(--ink);text-decoration:none;font-weight:700;font-size:19px;margin:0 5px 30px}.mark{background:var(--dark);color:#fff;border-radius:10px;display:grid;place-items:center;width:42px;height:42px;font-weight:800;font-size:18px;letter-spacing:1px}.logo small{display:block;font-size:10px;letter-spacing:1px;color:var(--muted)}.navlabel{color:var(--muted);font-size:10px;font-weight:700;letter-spacing:1.5px;margin:17px 12px 9px}.nav{background:transparent;color:#596c66;text-align:left;font-weight:500;font-size:12px;width:100%;padding:12px 11px;display:flex;gap:6px;align-items:center;justify-content:space-between}.nav.active{background:#e9f1e9;color:var(--dark);font-weight:700}.nav span{font-size:10px;background:#e7ede8;padding:1px 5px;border-radius:4px}.brand{display:block;background:none;color:var(--ink);margin:4px 0;text-align:left;width:100%}.brand.active{background:#f2f5f0}.brand[data-brand=HOCO]{font-size:22px;font-weight:800}.brand[data-brand=BOROFONE]{font-size:13px;letter-spacing:1.3px}.aside-note{margin-top:auto;padding:18px 12px;border-top:1px solid var(--line);color:var(--green);font-weight:700}.aside-note small{display:block;color:var(--muted);font-weight:400;margin-top:6px;font-size:11px}main{padding:36px 42px;max-width:1620px;width:100%;min-width:0}header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:26px}h1{font-size:29px;letter-spacing:-.8px;margin:5px 0}h2{margin:0;font-size:17px}p{color:var(--muted);margin:4px 0}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:var(--green)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:22px}.metrics>div{background:#fff;padding:20px 23px;border:1px solid var(--line);border-radius:12px}.metrics span{display:block;color:var(--muted);font-size:12px}.metrics strong{display:block;margin-top:7px;font-size:28px;font-weight:650;letter-spacing:-.5px}.metrics>div:nth-child(2) strong{color:var(--green)}.intake{background:#f1e7f7;border:1px solid #e5d3ef;border-radius:13px;padding:20px 23px;display:grid;grid-template-columns:1fr auto;gap:15px;margin-bottom:25px}.intake>div:first-child{grid-column:1/-1}.intake p{font-size:12px}.intake form{display:flex;gap:8px}.intake input{width:100%}.upload{background:#fff;color:var(--ink);border:1px solid #dccae6;white-space:nowrap;align-self:start}.upload input{display:none}#jobs{grid-column:1/-1;font-size:12px;color:var(--muted)}.toolbar{display:flex;gap:9px;margin-bottom:18px}.toolbar>input{flex:1}.toolbar select{max-width:220px}.toolbar button{white-space:nowrap}.list-heading{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin:16px 2px 10px}.doc{background:#fff;border:1px solid var(--line);border-radius:11px;padding:20px 23px;margin:10px 0;display:grid;grid-template-columns:minmax(230px,1fr) 175px 155px auto;gap:25px;align-items:center}.doc h3{font-size:15px;margin:0 0 5px;word-break:break-word}.doc h3 a{color:var(--ink);text-decoration:none}.doc .product{font-size:12px;color:var(--muted);margin-top:7px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:650px}.meta{font-size:11px;color:var(--muted)}.chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}.chip{font-size:10px;background:#f3edf7;color:#715280;padding:2px 7px;border-radius:4px}.badge{display:inline-block;padding:4px 9px;border-radius:6px;font-size:11px;font-weight:650;background:#edf0ed;color:#67756e}.badge.good{background:#e4f4e9;color:#267443}.badge.bad{background:#fbeae6;color:#a64337}.badge.warn{background:#fff1d5;color:#986c18}.status-cell small,.expiry small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.expiry strong{font-size:16px;font-weight:600}.doc .open{padding:8px 12px;background:#f4edf8;color:var(--ink);white-space:nowrap;font-size:12px}.empty{background:#fff;border:1px dashed var(--line);border-radius:12px;padding:45px;text-align:center;color:var(--muted)}.file{grid-template-columns:minmax(220px,1fr) 155px 150px auto}.file h3{font-size:13px}dialog{border:0;border-radius:15px;padding:27px;width:min(950px,95vw);max-height:90vh;color:var(--ink);box-shadow:0 30px 90px #3b145640}dialog::backdrop{background:#22132c99}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.icon{background:#f1eaf6;color:var(--ink);font-size:24px;padding:0;width:35px;height:35px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#f7f2fa;border-radius:10px;padding:17px}.detail-grid label{display:block;color:var(--muted);font-size:11px}.detail-section{margin-top:22px}.detail-section h3{font-size:14px;margin:10px 0}.detail-section p{color:var(--ink)}.file-link{display:block;border:1px solid var(--line);padding:10px;margin:7px 0;border-radius:6px;color:var(--dark);text-decoration:none;word-break:break-word}.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.edit-form{display:grid;gap:9px;margin-top:12px}.edit-form label{display:grid;gap:4px;color:var(--muted);font-size:12px}.history{border-bottom:1px solid var(--line);padding:8px 0;font-size:12px}.ocr{white-space:pre-wrap;font:12px/1.7 monospace;max-height:350px;overflow:auto;background:#f7f2fa;border-radius:9px;padding:15px}.login{display:grid;place-items:center;min-height:100vh}.login form{padding:38px;width:min(440px,95vw);background:#fff;border:1px solid var(--line);border-radius:16px}.login h1{font-size:25px;margin-top:20px}.login label{display:grid;gap:5px;margin-top:17px}.login button{width:100%;margin-top:22px}.login #loginError{color:#a64337}#toast{position:fixed;bottom:25px;right:25px;border-radius:10px;padding:15px 22px;background:var(--dark);color:#fff;max-width:min(450px,90vw);box-shadow:0 5px 30px #0002;z-index:50}@media(max-width:1150px){main{padding:28px 24px}.doc{grid-template-columns:1fr 130px 120px;gap:12px}.doc .open{grid-column:1/-1;justify-self:end}.toolbar{flex-wrap:wrap}.toolbar input{min-width:220px}.metrics>div{padding:16px}.metrics strong{font-size:23px}}@media(max-width:760px){#workspace{display:block}aside{width:100%;height:auto;position:static;display:block;padding:15px}.logo{margin:0 0 12px}.nav{display:inline-flex;width:auto;font-size:11px}.navlabel,.aside-note{display:none}#logout{float:right;width:auto}#brands{display:flex;gap:4px;margin-top:10px}.brand{width:auto;padding:7px 11px}.brand[data-brand=HOCO]{font-size:18px}main{padding:22px 15px}h1{font-size:24px}header .button{font-size:11px;padding:8px}header p{font-size:12px}.metrics{grid-template-columns:1fr 1fr;gap:8px}.intake{display:block;padding:16px}.intake form{margin:14px 0}.upload{display:block;text-align:center}.toolbar select{flex:1;max-width:none}.toolbar>button{flex:1}.list-heading span:last-child{display:none}.doc{grid-template-columns:1fr 1fr;padding:17px}.doc>div:first-child{grid-column:1/-1}.doc .open{grid-column:2;justify-self:end}.doc.file{grid-template-columns:1fr 1fr}.detail-grid{grid-template-columns:1fr}dialog{padding:18px}.metrics strong{font-size:24px}}

.connection-notice{padding:16px 20px;background:#fff4de;border:1px solid #ecd8ad;border-radius:12px;color:#775b23;line-height:1.5}

button.danger{color:#a33131;border-color:#e3baba;margin:10px 0}

/* Diforce identity: supplied transparent logo and shared project monogram. */
:root{--brand:#8e01b1;--brand-deep:#6c008a;--brand-soft:#f1e7f7}
aside{width:260px;background:linear-gradient(165deg,#321041 0%,#24102f 65%,#2d123c 100%);border-right:0;padding:22px 16px;color:#fff}
.logo{display:block;margin:0 0 3px;padding:0;text-decoration:none}
.logo img{display:block;width:100%;height:auto;max-width:228px}
.catalog-label{font-size:12px;font-weight:600;color:#f4e8fa;margin:0 11px 22px}
.catalog-label small{display:block;color:#bfa8ca;font-size:10px;letter-spacing:1.4px;margin-top:4px}
.navlabel{color:#bba1c8}
.nav{color:#e5d6ee;border:1px solid transparent}
.nav:hover{background:#ffffff0b;filter:none}
.nav.active{background:#8e01b1;color:#fff;border-color:#b846cf;box-shadow:0 4px 16px #18001d26}
.nav span{background:#ffffff12;color:#e8d9f1}
.nav.active span{background:#ffffff22;color:#fff}
.brand{color:#efe4f6}.brand.active{background:#ffffff12;color:#fff}
.aside-note{border-color:#ffffff18;color:#e2acef}.aside-note small{color:#bfa8ca}
.eyebrow{color:var(--brand)}
.metrics>div:nth-child(2) strong{color:var(--brand)}
.intake{background:var(--brand-soft);border-color:#e5d3ef;box-shadow:0 2px 10px #71009504}
button:not(.nav):not(.brand):not(.secondary):not(.open):not(.icon):hover,.button:not(.secondary):hover{background:var(--brand-deep);filter:none}
.secondary:hover,.upload:hover,.open:hover{border-color:#c69bd6;background:#faf6fc;filter:none}
.doc h3 a:hover,.file-link:hover{color:var(--brand);text-decoration:underline}
button:focus-visible,a:focus-visible,.upload:focus-within{outline:3px solid #c987dd;outline-offset:3px}
.login{background:radial-gradient(ellipse at 50% 12%,#ecd9f3 0%,#f8f5fa 65%)}
.login form{box-shadow:0 18px 65px #45105e0b;padding:30px}
.login-brand{background:#2c1039;border-radius:13px;padding:4px 20px}
.login-brand img{display:block;width:100%;height:auto}
.login h1{font-size:24px}
@media(max-width:760px){aside{width:100%;padding:14px 15px}.logo{display:inline-block;margin:0;vertical-align:middle}.logo img{width:190px}.catalog-label{display:inline-block;margin:0 0 0 12px;vertical-align:middle}.nav{margin-top:8px}.brand.active{background:#ffffff18}}
aside{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#6d397f transparent}@media(max-width:760px){aside{overflow:visible}.catalog-label{margin-left:8px;font-size:10px}.catalog-label small{font-size:9px;letter-spacing:.8px}}
@media(max-width:760px){#logout{float:none;display:block;margin:8px 0 0 auto;width:auto;padding:7px 11px}}
.trade-search{background:white;border:1px solid var(--line);border-radius:14px;padding:24px;margin-top:20px}.trade-search textarea{display:block;width:100%;box-sizing:border-box;margin:10px 0;padding:14px;border:1px solid var(--line);border-radius:8px;font:inherit;resize:vertical}.trade-result{background:white;border:1px solid var(--line);border-radius:12px;padding:20px;margin-top:14px}.trade-result pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.6}.trade-result .actions{flex-wrap:wrap}.trade-result .actions button{white-space:normal;text-align:left}.trade-result p,.trade-result h3{overflow-wrap:anywhere}#customsFilter{width:100%;box-sizing:border-box;margin:18px 0}@media(max-width:760px){.trade-search,.trade-result{padding:16px}}

.trade-search > .upload{display:inline-flex;align-items:center;margin:16px 0 4px;background:white;color:var(--ink);border:1px solid var(--line)}