:root {
  --ink:#172631; --muted:#6d7c85; --line:#dbe4e7; --panel:#fff; --bg:#eef3f4;
  --navy:#132d3b; --teal:#0d8b84; --teal-dark:#08726d; --teal-soft:#e8f7f5;
  --orange:#f47b3a; --danger:#bd453a;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
* { box-sizing:border-box; }
html,body { min-height:100%; }
body { margin:0; color:var(--ink); background:var(--bg); }
button,input,select { font:inherit; }
button { color:inherit; }
.topbar { height:68px; display:flex; align-items:center; justify-content:space-between; padding:0 28px; border-bottom:1px solid var(--line); background:#fff; }
.brand { display:flex; align-items:center; gap:11px; color:inherit; text-decoration:none; }
.brand-mark { position:relative; width:40px; height:40px; display:grid; grid-template-columns:repeat(3,1fr); gap:3px; padding:8px; overflow:hidden; border-radius:10px; background:var(--navy); }
.brand-mark::after { content:""; position:absolute; left:6px; right:6px; top:18px; height:3px; border-radius:2px; background:var(--orange); }
.brand-mark i { border:2px solid #fff; border-radius:2px; opacity:.95; }
.brand-name { display:flex; align-items:baseline; line-height:1; white-space:nowrap; }
.brand-name strong,.brand-name b { font-size:22px; letter-spacing:-.7px; }.brand-name strong { font-weight:800; }.brand-name b { color:var(--teal); }
.topbar-actions { display:flex; align-items:center; gap:18px; }
.top-status { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:11px; }
.top-status b { font-weight:600; }
.top-status span { width:8px; height:8px; border-radius:50%; background:#28a875; box-shadow:0 0 0 4px #e3f6ee; }
.language-picker { position:relative; z-index:40; color:var(--muted); }
.language-trigger { width:166px; height:38px; display:grid; grid-template-columns:26px minmax(0,1fr) 10px; align-items:center; gap:8px; padding:0 10px; border:1px solid #cbd7db; border-radius:9px; background:#fff; color:var(--ink); font-size:11px; font-weight:750; text-align:left; cursor:pointer; }
.language-trigger:hover,.language-trigger[aria-expanded="true"] { border-color:var(--teal); box-shadow:0 0 0 2px rgba(13,139,132,.1); }
.language-trigger img,.language-menu img { width:24px; height:16px; display:block; border:1px solid rgba(23,38,49,.14); border-radius:2px; object-fit:cover; }
.language-trigger i { width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg) translateY(-2px); }
.language-menu { position:absolute; top:calc(100% + 5px); right:0; width:192px; max-height:min(430px,calc(100vh - 86px)); overflow-y:auto; padding:5px; border:1px solid #bdcbd0; border-radius:9px; background:#fff; box-shadow:0 14px 35px rgba(17,41,53,.2); }
.language-menu[hidden] { display:none; }.language-menu button { width:100%; min-height:34px; display:grid; grid-template-columns:28px minmax(0,1fr); align-items:center; gap:8px; padding:6px 8px; border:0; border-radius:6px; background:transparent; color:var(--ink); font-size:11px; text-align:left; cursor:pointer; }
.language-menu button:hover,.language-menu button:focus { outline:none; background:#edf7f6; }.language-menu button[aria-selected="true"] { background:var(--teal); color:#fff; font-weight:800; }
.language-native-select { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.app-shell { min-height:calc(100vh - 100px); display:grid; grid-template-columns:430px minmax(0,1fr); }
.sidebar { padding:18px; overflow-y:auto; border-right:1px solid var(--line); background:#f7f9fa; }
.panel { margin-bottom:12px; padding:16px; border:1px solid var(--line); border-radius:13px; background:var(--panel); box-shadow:0 2px 10px rgba(21,45,58,.035); }
.project-file-panel { padding:12px; border-color:#b9deda; background:linear-gradient(135deg,#f8fdfc,#f1f8f8); }
.project-file-heading h2 { margin:0; font-size:13px; }.project-file-heading p { margin:2px 0 9px; color:var(--muted); font-size:9px; }
.import-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; }.save-project-button { grid-column:1/-1; background:var(--teal-soft)!important; border-color:#b9deda!important; color:var(--teal-dark)!important; }
.section-heading { display:flex; align-items:center; gap:10px; margin-bottom:13px; }
.section-heading>span { flex:0 0 26px; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:var(--navy); color:#fff; font-size:12px; font-weight:800; }
.section-heading h2 { margin:0; font-size:14px; }.section-heading p { margin:2px 0 0; color:var(--muted); font-size:10px; }
.field-grid { display:grid; gap:9px; }.field-grid.two { grid-template-columns:1fr 1fr; }.field.full { margin-bottom:9px; }
.field { min-width:0; display:block; color:#53636c; font-size:10px; font-weight:700; }
.field input,.field select { width:100%; height:36px; margin-top:5px; padding:7px 9px; border:1px solid #cbd7db; border-radius:7px; outline:none; background:#fff; color:var(--ink); }
.field input:focus,.row-input:focus,.sheet-row select:focus { border-color:var(--teal); box-shadow:0 0 0 2px rgba(13,139,132,.11); }
.check-field { display:flex; align-items:flex-start; gap:9px; margin-top:12px; padding:10px; border:1px solid #dbe5e7; border-radius:8px; background:#f7fafb; cursor:pointer; }
.check-field input { width:15px; height:15px; margin:1px 0 0; accent-color:var(--teal); }.check-field strong,.check-field small { display:block; }.check-field strong { font-size:10px; }.check-field small { margin-top:2px; color:var(--muted); font-size:8px; line-height:1.35; }
.stock-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:7px; color:#465862; font-size:10px; }.stock-heading small { color:var(--muted); font-size:8px; font-weight:600; }
.sheet-columns,.sheet-row { display:grid; grid-template-columns:minmax(0,1fr) 61px 61px 38px 42px 22px; gap:5px; }
.part-columns,.part-row { display:grid; grid-template-columns:minmax(0,1fr) 72px 72px 43px 25px; gap:5px; }
.sheet-columns,.part-columns { padding:0 3px 3px; color:var(--muted); font-size:7px; font-weight:750; text-transform:uppercase; letter-spacing:.025em; }
.sheet-list,.parts-list { display:grid; gap:6px; }.sheet-row,.part-row { align-items:center; }
.row-input,.sheet-row select { width:100%; height:32px; min-width:0; padding:5px 6px; border:1px solid #d0dade; border-radius:6px; outline:none; background:#fff; color:var(--ink); font-size:9px; }
.number-input { text-align:right; }
.priority-label { height:32px; display:flex; align-items:center; justify-content:center; border:1px solid #d0dade; border-radius:6px; background:#fff; cursor:pointer; }.priority-label:has(input:checked) { border-color:var(--teal); background:var(--teal-soft); }.priority-label input { width:14px; height:14px; margin:0; accent-color:var(--teal); }
.remove-row { width:25px; height:30px; padding:0; border:0; border-radius:5px; background:transparent; color:#99a6ac; font-size:17px; cursor:pointer; }.remove-row:hover:not(:disabled) { color:var(--danger); background:#fff0ee; }.remove-row:disabled { opacity:.25; cursor:default; }
.ghost-button,.add-row-button { min-height:34px; display:flex; align-items:center; justify-content:center; gap:6px; border:1px solid #cbd7db; border-radius:7px; background:#fff; color:#42545e; font-size:10px; font-weight:750; cursor:pointer; }
.ghost-button:hover,.add-row-button:hover { border-color:var(--teal); color:var(--teal-dark); background:var(--teal-soft); }.ghost-button span { color:var(--teal); font-size:15px; }.ghost-button b,.add-row-button b { font:inherit; }.import-button { position:relative; }
.add-row-button { width:100%; margin-top:8px; border-style:dashed; }.add-row-button span { color:var(--teal); font-size:16px; }
.machine-fields { margin-top:12px; }.field-help { margin:10px 0 0; padding:8px 9px; border-radius:7px; background:#f5f8f9; color:var(--muted); font-size:9px; line-height:1.45; }.field-help strong { color:#52626b; }
.primary-button { width:100%; height:50px; display:flex; align-items:center; justify-content:space-between; padding:0 18px; border:0; border-radius:10px; background:var(--teal); color:#fff; font-weight:800; cursor:pointer; box-shadow:0 6px 15px rgba(13,139,132,.2); }.primary-button:hover { background:var(--teal-dark); }.primary-button:disabled { opacity:.55; cursor:wait; }
.message { min-height:19px; margin:8px 4px 0; color:var(--muted); font-size:10px; line-height:1.4; }.message.error { color:var(--danger); }.message.success { color:#167458; }
.progress-panel { margin-top:10px; padding:12px; border:1px solid #b9deda; border-radius:10px; background:#fff; box-shadow:0 5px 14px rgba(13,139,132,.08); }.progress-heading { display:flex; justify-content:space-between; gap:10px; color:#3f545d; font-size:10px; }.progress-heading span { color:var(--teal-dark); font-weight:800; }.progress-track { height:7px; margin:8px 0 6px; overflow:hidden; border-radius:9px; background:#e5edef; }.progress-track span { width:0; height:100%; display:block; border-radius:inherit; background:linear-gradient(90deg,var(--teal),#31aaa2); transition:width .18s ease; }.progress-panel small { color:var(--muted); font-size:8px; }
.workspace { min-width:0; padding:0 26px 28px; background:var(--bg); }.workspace-toolbar { min-height:76px; display:flex; align-items:center; gap:16px; }.workspace-toolbar h1 { margin:0; font-size:18px; }.workspace-toolbar p { margin:3px 0 0; color:var(--muted); font-size:11px; }
.toolbar-actions { margin-left:auto; display:flex; gap:8px; }.toolbar-actions button { height:36px; padding:0 14px; border-radius:7px; font-size:10px; font-weight:750; cursor:pointer; }.secondary-button { border:1px solid #cbd7db; background:#fff; }.export-button { border:1px solid var(--navy); background:var(--navy); color:#fff; }.toolbar-actions button:disabled { opacity:.4; cursor:default; }
.result-area { min-height:0; }
.metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:13px; }.metrics article { min-width:0; min-height:69px; display:flex; align-items:center; gap:11px; padding:12px; border:1px solid var(--line); border-radius:10px; background:#fff; }.metric-icon { flex:0 0 37px; width:37px; height:37px; display:grid; place-items:center; border-radius:8px; font-weight:850; }.metric-icon.sheets { color:var(--teal); background:var(--teal-soft); }.metric-icon.usage { color:var(--orange); background:#fff0e8; }.metric-icon.pieces { color:#5574a0; background:#edf3fb; }.metric-icon.waste { color:#916b32; background:#f8f2e7; }.metrics small { display:block; overflow:hidden; color:var(--muted); font-size:9px; white-space:nowrap; text-overflow:ellipsis; }.metrics strong { display:block; margin-top:2px; font-size:17px; }
.result-card { margin-bottom:13px; padding:17px; border:1px solid var(--line); border-radius:11px; background:#fff; box-shadow:0 2px 10px rgba(21,45,58,.03); }.card-heading { display:flex; align-items:center; gap:12px; margin-bottom:15px; }.card-heading h2 { margin:0; font-size:14px; }.card-heading p { margin:3px 0 0; color:var(--muted); font-size:10px; }.material-badge { margin-left:auto; padding:6px 9px; border-radius:6px; background:#f1f5f6; color:#53646d; font-size:9px; font-weight:750; }
.sheet-layouts { display:grid; grid-template-columns:repeat(auto-fit,minmax(360px,1fr)); gap:16px; }.layout-item { min-width:0; }.layout-heading { display:flex; justify-content:space-between; gap:10px; margin-bottom:7px; font-size:10px; }.layout-heading strong { font-size:11px; }.layout-heading span { color:var(--muted); font-size:8px; text-align:right; }.sheet-svg { width:100%; height:auto; display:block; border:1px solid #9bafb5; background:#f8fafb; }.sheet-svg .piece { stroke:#fff; stroke-width:1; vector-effect:non-scaling-stroke; }.sheet-svg .piece-label { fill:#fff; font-weight:800; text-anchor:middle; dominant-baseline:middle; paint-order:stroke; stroke:rgba(0,0,0,.25); stroke-width:2px; vector-effect:non-scaling-stroke; }.sheet-svg .cut-line { stroke:#1c333f; stroke-dasharray:5 3; opacity:.82; vector-effect:non-scaling-stroke; }.sheet-svg .cut-number { fill:#fff; stroke:#1c333f; stroke-width:1; vector-effect:non-scaling-stroke; }.sheet-svg .cut-number-text { fill:#1c333f; text-anchor:middle; dominant-baseline:middle; font-weight:850; }.sheet-svg .trim-area { fill:#dce7e9; opacity:.7; }.layout-legend { display:flex; flex-wrap:wrap; gap:8px 12px; margin-top:7px; color:var(--muted); font-size:8px; }.layout-legend i { width:9px; height:9px; display:inline-block; margin-right:4px; border-radius:2px; vertical-align:-1px; }
.result-table-wrap { overflow-x:auto; }.result-table { width:100%; min-width:760px; border-collapse:collapse; }.result-table th { padding:8px 9px; border-bottom:1px solid var(--line); background:#f7f9fa; color:#63727a; font-size:8px; text-align:left; text-transform:uppercase; letter-spacing:.035em; }.result-table td { padding:9px; border-bottom:1px solid #edf1f2; color:#40515a; font-size:9px; vertical-align:top; }.result-table tr:last-child td { border-bottom:0; }.direction-chip { display:inline-block; padding:3px 6px; border-radius:4px; background:#eff4f5; font-weight:750; white-space:nowrap; }.piece-code { color:var(--teal-dark); font-weight:850; }
footer { height:32px; display:flex; align-items:center; justify-content:space-between; padding:0 28px; border-top:1px solid var(--line); background:#fff; color:#87949a; font-size:9px; } footer a { color:inherit; }
@media (max-width:1100px) { .app-shell { grid-template-columns:380px minmax(0,1fr); }.sidebar { padding:13px; }.workspace { padding:0 15px 20px; }.metrics { grid-template-columns:1fr 1fr; }.top-status { display:none; }.sheet-columns,.sheet-row { grid-template-columns:minmax(0,1fr) 57px 57px 36px 38px 21px; } }
@media (max-width:780px) { .topbar { height:62px; padding:0 15px; }.language-trigger { width:144px; }.language-menu { width:184px; }.app-shell { display:block; }.sidebar { overflow:visible; border-right:0; }.workspace { padding-top:4px; }.sheet-layouts { grid-template-columns:1fr; } footer { padding:0 15px; } }
@media (max-width:430px) { .language-trigger { width:50px; grid-template-columns:26px 8px; }.language-trigger span { display:none; }.language-menu { right:0; } }
@media (max-width:430px) { .sidebar { padding:9px; }.panel { padding:12px; }.sheet-columns,.sheet-row { grid-template-columns:minmax(65px,1fr) 51px 51px 34px 34px 19px; gap:3px; }.part-columns,.part-row { grid-template-columns:minmax(70px,1fr) 60px 60px 38px 20px; gap:3px; }.metrics { gap:7px; }.metrics article { padding:8px; }.metric-icon { display:none; }.field-grid.two { grid-template-columns:1fr; }.sheet-layouts { grid-template-columns:minmax(0,1fr); }.brand-name strong,.brand-name b { font-size:19px; } }
[dir="rtl"] .language-menu { right:auto; left:0; }[dir="rtl"] .language-trigger,[dir="rtl"] .language-menu button,[dir="rtl"] .result-table th { text-align:right; }[dir="rtl"] .toolbar-actions,[dir="rtl"] .material-badge { margin-left:0; margin-right:auto; }
@media print { .topbar,.sidebar,.toolbar-actions,footer { display:none!important; }.app-shell { display:block; }.workspace { padding:0; }.result-card,.metrics article,.layout-item { break-inside:avoid; box-shadow:none; }.sheet-layouts { grid-template-columns:1fr 1fr; } }
