:root{color:#17202a;font-synthesis:none;--ink:#17202a;--muted:#66727d;--line:#d7dde1;--panel:#fff;--steel:#26323c;--accent:#b07a2a;--accent-dark:#865a1e;--green:#257a57;--blue:#356a8a;--amber:#95651f;background:#eef1f3;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;color:var(--ink);background:linear-gradient(135deg,#f5f7f8 0,#e9edef 100%);margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}.app{max-width:520px;margin:0 auto;padding:18px 12px 36px}.app.wide{max-width:1380px}.preview-switch{color:#53606b;justify-content:space-between;align-items:center;gap:12px;margin:0 auto 12px;padding:6px 8px 6px 14px;font-size:12px;display:flex}.preview-switch>div{gap:4px;display:flex}.preview-switch button{border:1px solid var(--line);color:#5c6872;background:#fff;border-radius:999px;padding:8px 12px}.preview-switch button.active{background:var(--steel);color:#fff;border-color:var(--steel)}.phone-surface{background:#f7f8f9;border:1px solid #d5dbdf;border-radius:24px;overflow:hidden;box-shadow:0 20px 55px #17202a1f}.mobile-header{background:var(--steel);color:#fff;align-items:center;gap:11px;height:68px;padding:0 16px;display:flex}.mark{letter-spacing:.04em;border:1px solid #ffffff57;border-radius:10px;place-items:center;width:36px;height:36px;font-weight:800;display:grid}.mobile-header>div:nth-child(2){flex-direction:column;line-height:1.2;display:flex}.mobile-header strong{font-size:15px}.mobile-header span{color:#bfc8ce;margin-top:3px;font-size:10px}.connection{align-items:center;display:flex;color:#c7d0d5!important;gap:6px!important;margin-left:auto!important;font-size:9px!important}.connection i{border-radius:50%;width:8px;height:8px;display:block}.connection.online i{background:#58b486;box-shadow:0 0 0 4px #58b4861f}.connection.offline{color:#e5c38d!important}.connection.offline i{background:#c98b38;box-shadow:0 0 0 4px #c98b381f}.mobile-main{min-height:620px;padding:18px 16px 92px}.hero-card{border:1px solid var(--line);background:linear-gradient(145deg,#fff,#f1f4f5);border-radius:18px;margin-bottom:14px;padding:20px}.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:#7d8891;font-size:10px;font-weight:800}.hero-card h1,.page-title h1,.control h1{margin:3px 0 6px;font-size:25px;line-height:1.08}.hero-card p{color:var(--muted);margin:0 0 18px;font-size:13px}.primary,.secondary{border:0;border-radius:11px;min-height:46px;padding:0 16px;font-weight:750}.primary{background:var(--steel);color:#fff}.primary:hover{background:#1c252d}.primary.big{width:100%;font-size:14px}.secondary{border:1px solid var(--line);color:#53606a;background:#fff}.sync-card{text-align:left;color:#6f5427;background:#fffaf0;border:1px solid #e3cda8;border-radius:14px;justify-content:space-between;align-items:center;width:100%;margin-bottom:20px;padding:13px 15px;display:flex}.sync-card span{flex-direction:column;display:flex}.sync-card small{color:#8a795c;margin-top:2px}.section-head{justify-content:space-between;align-items:end;gap:12px;margin:20px 0 10px;display:flex}.section-head h2{margin:0;font-size:15px}.link{color:var(--accent-dark);background:0 0;border:0;padding:4px;font-size:12px;font-weight:700}.order-list{gap:9px;display:grid}.order-card{border:1px solid var(--line);background:#fff;border-radius:14px;padding:14px}.order-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.order-top>strong{letter-spacing:.04em;color:#4b5964;font-size:11px}.status{white-space:nowrap;border-radius:999px;align-items:center;padding:5px 8px;font-size:9px;font-weight:800;display:inline-flex}.status.amber{color:#80551a;background:#f7ead5}.status.blue{color:#285f7d;background:#e1edf4}.status.green{color:#236b4d;background:#dfeee7}.status.grey{color:#5e6870;background:#ebedef}.order-card h3{margin:11px 0 4px;font-size:13px}.order-card p{color:#7a858e;margin:0;font-size:11px}.page-title{align-items:center;gap:12px;margin:2px 0 18px;display:flex}.back{border:1px solid var(--line);background:#fff;border-radius:12px;width:42px;height:42px;font-size:20px}.page-title h1{font-size:22px}.request-form{gap:14px;display:grid}.request-form label{color:#4e5b65;gap:6px;font-size:11px;font-weight:750;display:grid}.request-form input,.request-form select,.request-form textarea{color:#1c252d;background:#fff;border:1px solid #cfd6da;border-radius:10px;outline:none;width:100%;min-height:44px;padding:11px 12px;font-size:14px}.request-form textarea{resize:vertical;min-height:82px}.request-form input:focus,.request-form select:focus,.request-form textarea:focus{border-color:#7d8e99;box-shadow:0 0 0 3px #4d5f6c14}.two{grid-template-columns:1fr 1fr;gap:10px;display:grid}.item-editor{border:1px solid var(--line);background:#fff;border-radius:14px;grid-template-columns:1fr 90px;gap:10px;padding:14px;display:grid;position:relative}.item-editor label:first-of-type,.item-editor label:nth-of-type(2){grid-column:1/-1}.item-number{color:#6a757d;background:#edf0f2;border-radius:50%;place-items:center;width:22px;height:22px;font-size:10px;font-weight:800;display:grid;position:absolute;top:11px;right:12px}.upload{border-style:dashed}.submit{margin-top:4px}.success-note{color:#286a4d;background:#e4f0e9;border-radius:10px;margin:0;padding:10px 12px;font-size:12px}.form-note{line-height:1.5;color:#88929a!important;font-size:10px!important}.filter-row{gap:7px;margin-bottom:12px;display:flex}.chip{border:1px solid var(--line);color:#65717b;background:#fff;border-radius:999px;padding:7px 12px;font-size:11px}.chip.active{color:#26323c;background:#e9edf0;border-color:#cbd3d8;font-weight:750}.mini-flow{grid-template-columns:repeat(6,1fr);gap:4px;margin-top:12px;display:grid}.mini-flow i{background:#e1e5e7;border-radius:5px;height:3px}.mini-flow i.done{background:#638b78}.mini-flow i.current{background:#b07a2a}.bottom-nav{border-top:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffffff5;grid-template-columns:repeat(4,1fr);height:68px;margin-top:-68px;display:grid;position:sticky;bottom:0}.bottom-nav button{color:#7a858d;background:0 0;border:0;font-size:10px;font-weight:700}.bottom-nav button.active{color:#25313a}.bottom-nav button:disabled{opacity:.35}.control{background:#f4f6f7;border:1px solid #d1d8dc;border-radius:18px;min-height:720px;overflow:hidden}.control-head{background:var(--steel);color:#fff;justify-content:space-between;align-items:center;padding:22px 26px;display:flex}.control-head .eyebrow{color:#aeb9c0}.control-head h1{margin-top:5px;font-size:28px}.control-actions{gap:8px;display:flex}.control-actions button{color:#fff;background:#ffffff14;border:1px solid #ffffff29;border-radius:9px;padding:10px 12px}.metric-grid{background:#dbe0e3;border-bottom:1px solid #d6dce0;grid-template-columns:repeat(6,1fr);gap:1px;display:grid}.metric-grid article{background:#fff;flex-direction:column;gap:6px;padding:17px 18px;display:flex}.metric-grid span{color:#707b84;text-transform:uppercase;letter-spacing:.06em;font-size:10px}.metric-grid strong{font-size:25px}.work-panel{border:1px solid var(--line);background:#fff;border-radius:14px;margin:22px;overflow:hidden}.work-panel>.section-head{margin:0;padding:18px 20px 12px}.work-panel h2{margin-top:4px;font-size:18px}.searchbox{border:1px solid var(--line);color:#88919a;border-radius:9px;width:230px;padding:10px 12px;font-size:11px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:920px}th,td{text-align:left;border-top:1px solid #e3e7e9;padding:12px 15px;font-size:11px}th{color:#78838b;text-transform:uppercase;letter-spacing:.05em;background:#f8f9fa;font-size:9px}tbody tr:hover{background:#fafbfb}.architecture-note{color:#66553d;background:#fff9ef;border-left:4px solid #9c6c29;align-items:center;gap:12px;margin:0 22px 22px;padding:13px 15px;font-size:11px;display:flex}.architecture-note span{color:#85745d}@media (width<=760px){.app.wide{padding:10px}.preview-switch{flex-direction:column;align-items:flex-start}.control-head{flex-direction:column;align-items:flex-start;gap:15px}.control-actions{width:100%}.control-actions button{flex:1}.metric-grid{grid-template-columns:repeat(2,1fr)}.work-panel{margin:12px}.architecture-note{flex-direction:column;align-items:flex-start;margin:0 12px 12px}.two{grid-template-columns:1fr}}@media (width<=390px){.app{padding:8px 6px 24px}.phone-surface{border-radius:18px}.mobile-main{padding-left:12px;padding-right:12px}.order-top{flex-direction:column;align-items:flex-start}.item-editor{grid-template-columns:1fr}.item-editor label{grid-column:1!important}}
