@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;600;700;800;900&display=swap');

:root{
  --black:#050505;
  --white:#ffffff;
  --bone:#f5f2ed;
  --bone2:#ebe5dc;
  --cedar:#a86f3c;
  --cedar2:#6f411f;
  --ink:#0b0b0b;
  --muted:#706a62;
  --line:#ded8cf;
  --danger:#b3261e;
  --success:#2d7b4f;
  --shadow:0 24px 70px rgba(0,0,0,.12);
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;background:var(--bone);color:var(--ink);overflow-x:hidden}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
input,select,textarea{width:100%;min-height:52px;border:1px solid var(--line);border-radius:18px;background:var(--white);padding:14px 15px;outline:none;color:var(--ink);transition:border-color .2s var(--ease),box-shadow .2s var(--ease),transform .2s var(--ease)}
textarea{min-height:112px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--black);box-shadow:0 0 0 4px rgba(5,5,5,.08);transform:translateY(-1px)}
label{display:flex;flex-direction:column;gap:8px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:850;color:var(--muted)}
.site-bg{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 20% 0%,rgba(255,255,255,.95),transparent 30%),radial-gradient(circle at 84% 8%,rgba(168,111,60,.22),transparent 28%),linear-gradient(135deg,#fbfaf8,#e7dfd5)}
.grain{position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.18;background-image:linear-gradient(rgba(5,5,5,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(5,5,5,.04) 1px,transparent 1px);background-size:46px 46px}
.button{border:0;border-radius:999px;min-height:48px;padding:13px 18px;font-weight:900;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease)}
.button:hover{transform:translateY(-2px)}
.button.black{background:var(--black);color:var(--white);box-shadow:0 14px 30px rgba(0,0,0,.16)}
.button.white{background:var(--white);color:var(--black);border:1px solid var(--line)}
.button.cedar{background:var(--cedar);color:var(--white)}
.overline{display:block;color:var(--cedar);text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:900;margin-bottom:10px}
.nav-glass{position:sticky;top:18px;z-index:50;margin:18px auto 0;max-width:1180px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.88);backdrop-filter:blur(22px);border-radius:24px;padding:10px 12px;box-shadow:0 16px 44px rgba(0,0,0,.08)}
.logo-lock{display:flex;align-items:center;gap:10px;font-weight:900}
.logo-lock img{width:40px;height:40px;object-fit:contain;border-radius:12px}
.nav-links{display:flex;gap:6px;align-items:center}
.nav-links a,.nav-links button{border:0;background:transparent;border-radius:999px;padding:10px 13px;font-weight:800;color:#2c2a27}
.nav-links a:hover,.nav-links button:hover{background:var(--bone)}
.hero-site{max-width:1180px;margin:38px auto 0;display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:center;padding:0 16px}
.hero-copy h1{font-size:84px;line-height:.86;letter-spacing:-.105em;margin:0 0 22px}
.hero-copy p{font-size:19px;line-height:1.55;color:var(--muted);max-width:650px;margin:0 0 28px;font-weight:650}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.product-scene{height:620px;border-radius:42px;background:var(--black);position:relative;overflow:hidden;box-shadow:var(--shadow);transform-style:preserve-3d}
.product-scene:before{content:"";position:absolute;inset:auto -120px -160px auto;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,var(--cedar),transparent 66%);opacity:.8;animation:drift 8s infinite}
.product-scene:after{content:"";position:absolute;left:40px;right:40px;top:40px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent)}
.scene-card{position:absolute;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(20px);border-radius:30px;color:white;padding:22px;box-shadow:0 30px 80px rgba(0,0,0,.25);animation:float 7s infinite var(--delay,0s)}
.scene-card.one{width:320px;left:42px;top:78px}
.scene-card.two{width:250px;right:34px;top:230px;--delay:.8s}
.scene-card.three{width:290px;left:78px;bottom:78px;--delay:1.5s}
.scene-card span{color:#d7c6b3;text-transform:uppercase;font-size:12px;letter-spacing:.14em;font-weight:900}
.scene-card b{display:block;font-size:46px;letter-spacing:-.08em;margin-top:8px}
.scene-line{height:8px;border-radius:999px;background:rgba(255,255,255,.14);overflow:hidden;margin-top:18px}
.scene-line i{display:block;width:54%;height:100%;border-radius:999px;background:var(--cedar);animation:sweep 3.2s infinite}
.section{max-width:1180px;margin:80px auto 0;padding:0 16px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}
.section-head h2{font-size:54px;line-height:.92;letter-spacing:-.085em;margin:0;max-width:720px}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.experience-card{background:var(--white);border:1px solid var(--line);border-radius:30px;padding:24px;min-height:280px;box-shadow:0 16px 44px rgba(0,0,0,.06);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.experience-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.experience-card .num{width:46px;height:46px;background:var(--black);color:var(--white);border-radius:16px;display:grid;place-items:center;font-weight:900;margin-bottom:40px}
.experience-card h3{font-size:28px;line-height:1;letter-spacing:-.06em;margin:0 0 12px}
.experience-card p{color:var(--muted);line-height:1.5;font-weight:650}
.order-showcase{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px}
.panel{background:var(--white);border:1px solid var(--line);border-radius:30px;padding:24px;box-shadow:0 16px 44px rgba(0,0,0,.06)}
.panel.dark{background:var(--black);color:var(--white);border-color:var(--black)}
.panel h3{font-size:34px;letter-spacing:-.075em;line-height:.95;margin:0 0 16px}
.panel p{color:var(--muted);line-height:1.55;font-weight:650}
.panel.dark p{color:#d7d0c9}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.full{grid-column:1/-1}
.full-button{width:100%;margin-top:16px}
.split-layout{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.app-rail{position:sticky;top:0;height:100vh;background:var(--black);color:white;padding:20px 14px;display:flex;flex-direction:column}
.app-brand{display:flex;align-items:center;gap:10px;padding:0 6px 18px;font-weight:900}
.app-brand img{width:38px;height:38px;border-radius:12px;object-fit:contain;background:white;padding:4px}
.app-nav{display:flex;flex-direction:column;gap:4px}
.app-nav button{border:0;background:transparent;color:#c8c8c8;border-radius:14px;text-align:left;padding:12px 13px;font-weight:800}
.app-nav button.active,.app-nav button:hover{background:white;color:black}
.rail-status{margin-top:auto;background:#151515;border:1px solid #252525;border-radius:18px;padding:13px;display:flex;gap:10px;align-items:center}
.rail-status i{width:10px;height:10px;border-radius:50%;background:var(--cedar);box-shadow:0 0 0 5px rgba(168,111,60,.18)}
.workspace{padding:28px;max-width:1460px;width:100%;margin:0 auto}
.app-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px}
.app-top h1{font-size:52px;letter-spacing:-.08em;line-height:.95;margin:0}
.app-top p{margin:0;color:var(--cedar);text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:900}
.action-row{display:flex;gap:10px;flex-wrap:wrap}
.page{display:none;animation:fadeUp .25s var(--ease)}
.page.active{display:block}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.metric{background:white;border:1px solid var(--line);border-radius:24px;padding:20px;box-shadow:0 12px 34px rgba(0,0,0,.05)}
.metric span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.1em;font-weight:900}
.metric b{display:block;font-size:46px;letter-spacing:-.08em;line-height:1;margin:10px 0 4px}
.metric small{color:var(--muted);font-weight:700}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.card-list{display:grid;gap:10px}
.item{background:var(--bone);border:1px solid var(--line);border-radius:18px;padding:15px;display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.item h4{margin:0 0 6px;font-size:17px;letter-spacing:-.04em}
.item p{margin:0 0 4px;color:var(--muted);font-size:14px;font-weight:650;line-height:1.4}
.item-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.mini{border:1px solid var(--line);background:white;border-radius:12px;padding:8px 10px;font-size:12px;font-weight:850}
.status{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:900;background:white;border:1px solid var(--line)}
.status.Pending{background:var(--cedar);color:white;border-color:var(--cedar)}
.status.New,.status.Ready,.status.Packed,.status.PickedUp{background:var(--black);color:white;border-color:var(--black)}
.status.Complete{background:var(--success);color:white;border-color:var(--success)}
.status.Cancelled{background:var(--danger);color:white;border-color:var(--danger)}
.segmented{display:flex;background:white;border:1px solid var(--line);border-radius:16px;padding:4px}
.seg{border:0;background:transparent;border-radius:12px;padding:9px 13px;font-weight:850}
.seg.active{background:var(--black);color:white}
.alerts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}
.alert{border:0;border-radius:22px;padding:18px;display:flex;gap:14px;align-items:center;text-align:left;background:var(--cedar);color:white}
.alert.black{background:var(--black)}
.alert span{width:46px;height:46px;border-radius:15px;background:rgba(255,255,255,.16);display:grid;place-items:center;font-size:22px;font-weight:900}
.portal-shell{min-height:100vh;background:var(--bone)}
.portal-wrap{max-width:1180px;margin:0 auto;padding:28px 16px}
.portal-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px}
.portal-header .logo-lock{background:white;border:1px solid var(--line);border-radius:22px;padding:10px 14px}
.portal-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:18px}
.portal-hero{background:var(--black);color:white;border-radius:36px;padding:32px;min-height:620px;position:relative;overflow:hidden}
.portal-hero:after{content:"";position:absolute;right:-120px;bottom:-150px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,var(--cedar),transparent 66%);opacity:.75}
.portal-hero h1{font-size:64px;line-height:.88;letter-spacing:-.1em;margin:12px 0 18px;position:relative;z-index:1}
.portal-hero p{color:#d7d0c9;font-weight:650;line-height:1.55;position:relative;z-index:1}
.portal-tabs{display:flex;gap:8px;margin-bottom:16px}
.portal-tabs button{border:0;border-radius:999px;padding:10px 14px;font-weight:900;background:white}
.portal-tabs button.active{background:var(--black);color:white}
.portal-view{display:none}.portal-view.active{display:block}
.ai-messages{min-height:320px;max-height:420px;overflow:auto;display:flex;flex-direction:column;gap:9px}
.message{max-width:86%;border-radius:18px;padding:13px 14px;line-height:1.45;font-weight:650;white-space:pre-wrap}
.message.assistant{align-self:flex-start;background:var(--bone);border:1px solid var(--line)}
.message.user{align-self:flex-end;background:var(--black);color:white}
.input-row{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:12px}
.empty{text-align:center;border:1px dashed var(--line);border-radius:18px;padding:22px;color:var(--muted);background:var(--bone)}
.empty b{display:block;color:var(--black);margin-bottom:5px}
.label-sheet{display:grid;grid-template-columns:repeat(2,minmax(300px,1fr));gap:12px}
.label{background:white;border:2px solid black;border-radius:12px;padding:12px;min-height:174px;break-inside:avoid;page-break-inside:avoid}
.label-head{display:flex;gap:10px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:8px;margin-bottom:7px}
.label-head img{width:42px;height:42px;object-fit:contain}.label-head strong{display:block;font-size:19px;letter-spacing:-.04em}.label-head span{color:var(--cedar);font-size:10px;letter-spacing:.12em;font-weight:900}
.label-row{display:grid;grid-template-columns:92px 1fr;gap:8px;border-bottom:1px solid var(--line);padding:4px 0;font-size:13px}.label-msg{font-size:12px;font-style:italic;font-weight:800;margin-top:7px}
table{width:100%;border-collapse:separate;border-spacing:0 8px}th{text-align:left;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.09em;padding:8px 12px}td{background:var(--bone);padding:13px 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:14px}td:first-child{border-left:1px solid var(--line);border-radius:14px 0 0 14px}td:last-child{border-right:1px solid var(--line);border-radius:0 14px 14px 0}
.error{background:#fff0ed;color:var(--danger);border:1px solid #f0c6be;border-radius:18px;padding:14px 16px;font-weight:750;margin-bottom:18px}
.toast{position:fixed;right:24px;bottom:24px;background:var(--black);color:white;border-radius:16px;padding:14px 16px;box-shadow:var(--shadow);font-weight:800;z-index:20}
.code{background:black;color:white;border-radius:18px;padding:16px;white-space:pre-wrap}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(18px)}}
@keyframes drift{0%,100%{transform:translate(0,0)}50%{transform:translate(-20px,18px)}}
@keyframes sweep{from{transform:translateX(-120%)}to{transform:translateX(240%)}}
@media(max-width:1020px){.hero-site,.order-showcase,.split-layout,.portal-grid,.two-col{grid-template-columns:1fr}.app-rail{position:relative;height:auto}.app-nav{display:grid;grid-template-columns:repeat(2,1fr)}.metric-grid,.card-grid,.alerts{grid-template-columns:1fr 1fr}.product-scene{height:480px}.hero-copy h1{font-size:58px}}
@media(max-width:680px){.nav-glass,.portal-header,.app-top{flex-direction:column;align-items:flex-start}.nav-links{flex-wrap:wrap}.metric-grid,.card-grid,.alerts,.form-grid,.input-row,.label-sheet{grid-template-columns:1fr}.hero-copy h1,.portal-hero h1{font-size:44px}.section-head h2{font-size:38px}.workspace{padding:18px}.item{flex-direction:column}.item-actions{justify-content:flex-start}}
@media print{.no-print,.app-rail,.app-top,.page:not(#labels){display:none!important}.split-layout{display:block}.workspace{padding:0}.panel{box-shadow:none;border:0}.label-sheet{grid-template-columns:repeat(2,1fr)}}