@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#f6f6f6;--ink:#171717;--muted:#8f8f8f;--accent:#696969;--line:#ededed;--green:#171717;--tg-top:0px}*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:Manrope,system-ui,sans-serif;color:var(--ink);font-size:14px}button,input,select,textarea{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a{color:var(--accent);text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #a6a6a6;outline-offset:3px}.sidebar{position:fixed;width:238px;inset:0 auto 0 0;background:#fff;border-right:1px solid var(--line);padding:34px 22px;display:flex;flex-direction:column}.brand{font-weight:800;color:var(--ink);font-size:21px;display:flex;align-items:center;gap:10px;letter-spacing:-1px}.brand-icon{background:var(--accent);border-radius:11px;color:white;width:37px;height:37px;display:grid;place-items:center;font-size:23px;position:relative}.brand-icon span{font-size:15px;position:absolute;right:3px;top:2px}.brand-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);margin-left:-6px;margin-top:12px}.workspace{color:#a8a8a8;font-size:9px;letter-spacing:1.7px;font-weight:800;margin:46px 9px 18px}nav button{border:0;background:none;color:#858585;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:11px;width:100%;text-align:left;margin-bottom:7px;font-weight:700}nav button.active{color:var(--accent);background:#f1f1f1}nav button svg{width:20px;height:20px}.nav-count{margin-left:auto;font-size:10px;background:white;padding:3px 7px;border-radius:5px}.sidebar-bottom{margin-top:auto;line-height:2;font-size:11px;color:#747474;padding:10px}.sidebar-bottom small{color:#a8a8a8;margin-left:13px;font-size:10px}.live-dot{display:inline-block;background:#9f9f9f;border-radius:50%;width:6px;height:6px;margin-right:7px}.shell{margin-left:238px}header{height:88px;border-bottom:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 42px}.breadcrumb{font-size:12px;color:#909090}.breadcrumb span{margin:0 18px;color:#cecece}.breadcrumb b{color:#555555;font-weight:600}.header-right{display:flex;align-items:center;gap:22px}.connection{font-size:11px;color:#959595}.avatar{border:0;border-radius:12px;width:37px;height:37px;background:#ededed;color:#737373;font-weight:800}#demo-banner{margin:20px 42px 0;padding:11px 16px;background:#ededed;border:1px solid #e3e3e3;border-radius:10px;display:flex;align-items:center;justify-content:space-between;color:#737373;font-size:11px}#demo-banner[hidden]{display:none}#demo-banner button{border:0;background:transparent;color:#666666;font-weight:700;font-size:11px;padding:5px}main{padding:32px 42px;max-width:1450px;margin:auto}.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.eyebrow{text-transform:uppercase;font-size:9px;color:#9f9f9f;letter-spacing:2px;font-weight:800;margin:0 0 8px}h1{font-size:29px;letter-spacing:-1px;margin:0 0 7px}h1 span{font-size:23px;margin-left:5px}h2{font-size:16px;margin:0;letter-spacing:-.35px}h3{font-size:14px;margin:0 0 7px}p{color:#949494;font-size:12px;margin:0;line-height:1.7}.button{border:0;border-radius:9px;padding:12px 17px;font-weight:700;font-size:12px;background:var(--accent);color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:9px}.button svg{width:16px;height:16px}.button.secondary{background:#f3f3f3;color:#6f6f6f}.button.danger{background:#f3f3f3;color:#7c7c7c}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:25px}.stat{background:white;border:1px solid var(--line);border-radius:13px;padding:20px}.stat-label{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#959595;font-weight:600}.stat-icon{width:29px;height:29px;border-radius:9px;display:grid;place-items:center;background:#f5f5f5;color:#a6a6a6}.stat-icon svg{width:15px;height:15px}.stat strong{display:block;font-size:28px;letter-spacing:-1px;margin:9px 0}.stat small{font-size:10px;color:#a2a2a2}.stat:first-child{background:var(--accent);color:white;border-color:var(--accent)}.stat:first-child .stat-label,.stat:first-child small{color:#d4d4d4}.stat:first-child .stat-icon{background:#ffffff22;color:white}.stat strong span{font-size:18px;font-weight:500;margin-left:4px}.grid{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:23px}.panel{background:#fff;border:1px solid var(--line);border-radius:13px;overflow:hidden;margin-bottom:22px}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid #f2f2f2}.panel-head button{border:0;background:none;color:var(--accent);font-size:10px;font-weight:700}.panel-head p{font-size:10px;margin-top:4px}.tabs{display:flex;gap:20px;padding:0 24px;border-bottom:1px solid var(--line);overflow:auto}.tabs button{white-space:nowrap;background:none;border:0;border-bottom:2px solid transparent;color:#a0a0a0;font-size:11px;padding:17px 0}.tabs button.active{border-color:var(--accent);color:var(--accent);font-weight:800}.tabs small{background:#f4f4f4;padding:2px 5px;border-radius:4px;margin-left:5px;color:#999999;font-size:9px}.order{padding:19px 24px;display:flex;align-items:center;gap:13px;border-bottom:1px solid #f2f2f2;cursor:pointer}.order:last-child{border:0}.order:hover{background:#fbfbfb}.product-icon{width:43px;height:43px;flex-shrink:0;background:#f3f3f3;border-radius:10px;display:grid;place-items:center;color:#999999}.product-icon svg{width:24px;height:24px}.order-info{min-width:0;flex:1}.order-info h3{font-size:11px;font-weight:800;margin:0 0 6px}.order-info p{font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.order-amount{text-align:right;font-size:12px;font-weight:800;white-space:nowrap}.order-amount small{display:block;color:#a9a9a9;font-size:9px;font-weight:500;margin-top:6px}.badge{border-radius:5px;padding:5px 8px;font-size:9px;font-weight:700;white-space:nowrap;background:#f3f3f3;color:#959595}.badge.paid,.badge.collected{background:#f4f4f4;color:#868686}.badge.new,.badge.return_requested,.badge.not_collected,.badge.pending{background:#f4f4f4;color:#989898}.order .badge{margin:0 6px}.arrow{color:#cccccc}.tip{border:1px solid #e8e8e8;background:#f1f1f1;border-radius:13px;padding:21px;margin-bottom:20px}.tip .tip-icon{width:33px;height:33px;background:#e7e7e7;color:#787878;display:grid;place-items:center;border-radius:10px;margin-bottom:16px}.tip h3{font-size:12px;color:#676767}.tip p{font-size:10px;color:#909090}.tip a{font-size:10px;font-weight:800;display:inline-block;margin-top:17px;cursor:pointer}.activity{padding:21px}.activity h3{font-size:12px;margin-bottom:23px}.activity-row{display:flex;gap:12px;margin-bottom:20px}.activity-icon{width:28px;height:28px;flex-shrink:0;background:#f6f6f6;color:#9b9b9b;border-radius:8px;display:grid;place-items:center;font-size:12px}.activity-row p{font-size:10px;color:#696969}.activity-row small{color:#b0b0b0;font-size:9px}.flow{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;padding:24px}.flow-step{display:flex;gap:12px}.step-number{font-size:11px;font-weight:800;color:#a5a5a5;background:#f3f3f3;border-radius:8px;width:28px;height:28px;display:grid;place-items:center;flex-shrink:0}.flow h3{font-size:11px}.flow p{font-size:10px}.empty{padding:40px;text-align:center;color:#9a9a9a;font-size:12px}.search{padding:14px 24px;border-bottom:1px solid var(--line)}input,select,textarea{width:100%;background:#f9f9f9;border:1px solid #e6e6e6;color:var(--ink);border-radius:8px;padding:12px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--accent)}label{display:block;font-size:12px;color:#6f6f6f;margin:17px 0 7px}label.check{display:flex;gap:10px;align-items:center}label.check input{width:auto}textarea{min-height:85px;resize:vertical}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}.form-note{font-size:11px;padding:13px;background:#f1f1f1;border-radius:8px;margin-top:14px;color:#888888}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:25px 0}.detail-grid small{display:block;color:#9f9f9f;font-size:10px;margin-bottom:6px}.detail-grid b{font-size:12px;overflow-wrap:anywhere}.detail-actions{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.table-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:20px 24px;border-bottom:1px solid var(--line)}.table-row p{font-size:10px}.table-row b{font-size:12px}.amount-positive{color:var(--green)}.amount-negative{color:#989898}.catalog{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.catalog-card{background:white;border:1px solid var(--line);border-radius:13px;padding:24px}.catalog-card .product-icon{width:100%;height:115px;margin-bottom:20px;background:#f3f3f3}.catalog-card .product-icon svg{width:42px;height:42px}.catalog-card p{font-size:11px}.catalog-card strong{display:block;margin:15px 0;font-size:20px}.catalog-card .button{width:100%}.notice{padding:15px 20px;background:#f4f4f4;color:#7c7c7c;border-radius:10px;margin-bottom:20px;font-size:12px}footer{display:flex;justify-content:space-between;max-width:1450px;margin:0 auto;padding:5px 42px 26px;font-size:9px;font-weight:700;letter-spacing:1px;color:#b2b2b2}footer span{letter-spacing:0;font-weight:500}dialog{border:0;border-radius:17px;padding:27px;width:530px;max-width:calc(100% - 28px);max-height:85vh;color:var(--ink);box-shadow:0 30px 100px #22222230}dialog::backdrop{background:#22222255;backdrop-filter:blur(4px)}.modal-header{display:flex;align-items:center;justify-content:space-between}.icon-button{border:0;background:#f4f4f4;color:#919191;border-radius:8px;font-size:22px;width:32px;height:32px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%) translateY(100px);opacity:0;background:#2b2b2b;color:white;border-radius:10px;padding:14px 22px;font-size:12px;transition:.2s;z-index:100;max-width:90vw}#toast.visible{opacity:1;transform:translateX(-50%)}#mobile-nav{display:none}.file-link{display:block;font-size:11px;padding:9px 0;border-bottom:1px solid var(--line)}.error{color:#6e6e6e;margin-top:15px;font-size:12px}
@media(min-width:1500px){main{padding-top:45px}.stats{gap:23px}.stat{padding:25px}.grid{grid-template-columns:minmax(0,1fr) 325px}.order{padding-top:23px;padding-bottom:23px}}
@media(max-width:1150px){.sidebar{width:195px;padding:30px 15px}.shell{margin-left:195px}header{padding:0 26px}main{padding:26px}.grid{grid-template-columns:minmax(0,1fr) 250px;gap:16px}#demo-banner{margin:18px 26px 0}.order .badge{display:none}.stats{gap:10px}.stat{padding:15px}.stat-label{font-size:10px}.flow{gap:13px;padding:20px}.connection{display:none}}
@media(max-width:850px){.sidebar{display:none}.shell{margin-left:0}header{height:65px;padding:0 22px;padding-top:var(--tg-top)}main{padding:24px 20px}.grid{grid-template-columns:1fr}.right-column{display:grid;grid-template-columns:1fr 1fr;gap:16px}.stats{grid-template-columns:repeat(2,1fr);gap:12px}.stat{padding:18px}.stat strong{font-size:26px}.page-heading{align-items:flex-start;gap:12px}h1{font-size:26px}.page-heading p{font-size:11px}.page-heading .button{padding:12px}.breadcrumb{font-size:11px}#demo-banner{margin:16px 20px 0;gap:9px;align-items:flex-start}#demo-banner span{font-size:9px;line-height:1.8}#demo-banner button{font-size:9px}#demo-banner div{display:flex;align-items:center}footer{padding:0 20px 95px}.order .badge{display:block}.catalog{grid-template-columns:repeat(2,1fr)}#mobile-nav{display:flex;justify-content:space-around;position:fixed;bottom:0;left:0;right:0;background:#fffffff5;backdrop-filter:blur(15px);border-top:1px solid var(--line);padding:10px 4px calc(8px + env(safe-area-inset-bottom));z-index:20}#mobile-nav button{width:auto;flex:1;flex-direction:column;gap:5px;padding:7px 3px;font-size:9px;margin:0;border-radius:9px}#mobile-nav button svg{width:20px;height:20px}#mobile-nav .nav-count{display:none}#toast{bottom:95px}}
@media(max-width:500px){.right-column{grid-template-columns:1fr}.activity{display:none}.flow{grid-template-columns:1fr;gap:22px}.order{padding:16px;gap:10px}.order-info h3{font-size:10px}.order .badge{display:none}.panel-head{padding:20px 17px}.tabs{padding:0 17px;gap:20px}.product-icon{width:38px;height:38px}.order-amount{font-size:11px}.page-heading .button{font-size:0;width:42px;height:42px;padding:0}.page-heading .button svg{width:20px;height:20px}.catalog{gap:12px}.catalog-card{padding:16px}.catalog-card h3{font-size:12px}.catalog-card .product-icon{height:90px}.detail-grid{gap:15px}.breadcrumb span{margin:0 10px}footer span{font-size:8px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

@media(max-width:500px){.order .badge.not_collected,.order .badge.collected{display:block}}

/* ATTICTED SUPPLIER — monochrome identity */
:root{--bg:#f5f5f5;--ink:#171717;--muted:#737373;--accent:#111111;--line:#e7e7e7;--green:#171717}
.brand{display:block;letter-spacing:0}.brand-logo{display:block;width:164px;max-width:100%;height:auto;margin:0 auto}.workspace{margin-top:30px}.mobile-brand{display:none}.live-dot{background:#171717}nav button.active{background:#111;color:#fff}.nav-count{color:#171717}.button:hover{background:#333}.button.secondary{background:#f0f0f0;color:#333}.button.secondary:hover{background:#e3e3e3}.button.danger{background:#ededed;color:#111}.stat:first-child .stat-label,.stat:first-child small{color:#d4d4d4}.badge.paid,.badge.collected{background:#171717;color:#fff}.badge.new,.badge.return_requested,.badge.not_collected,.badge.pending{background:#f2f2f2;color:#525252;border:1px solid #dedede}.notice{background:#efefef;color:#414141;border-left:3px solid #171717}.tip{background:#fafafa;border-color:#dedede}.tip h3,.tip a{color:#222}.tip p{color:#686868}.tip .tip-icon{background:#e9e9e9;color:#222}.form-note{background:#f1f1f1;color:#525252}.amount-positive,.amount-negative{color:#222}button:focus-visible,a:focus-visible{outline-color:#333}.error{color:#171717;font-weight:700}.avatar{background:#ececec;color:#222}#demo-banner{background:#ededed;border-color:#ddd;color:#525252}#demo-banner button{color:#222}#toast{background:#171717}.activity-icon{background:#eee;color:#222}.stat-label,.stat small,.eyebrow,p,.order-info p,.order-amount small,.detail-grid small{color:#737373}
@media(max-width:850px){.mobile-brand{display:flex;align-items:center;flex-shrink:0}.mobile-brand img{display:block;width:145px;height:34px;object-fit:contain}.breadcrumb{display:none}header{gap:15px}}
