:root{--bg:#f6f7fb;--panel:#fff;--panel-2:#eef2ff;--text:#172033;--muted:#667085;--line:#d8dee9;--blue:#174ea6;--blue-2:#0b3a7a;--green:#0e7c4a;--red:#b42318;--yellow:#f9d776;--shadow:0 10px 30px #0f172a14}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);margin:0;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.shell{grid-template-columns:280px 1fr;min-height:100vh;display:grid}.sidebar{color:#fff;background:#111827;flex-direction:column;gap:18px;padding:20px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-mark{background:var(--yellow);color:#111827;border-radius:12px;place-items:center;width:42px;height:42px;font-weight:900;display:grid}.brand-title{font-weight:800;line-height:1.1}.brand-sub{color:#cbd5e1;margin-top:3px;font-size:12px}.nav{gap:8px;display:grid}.nav a,.nav button{text-align:left;color:#fff;cursor:pointer;background:#ffffff14;border:0;border-radius:12px;padding:11px 12px}.nav a:hover,.nav button:hover{background:#ffffff29}.main{min-width:0;padding:22px}.topbar{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;display:flex}.kicker{color:var(--blue);text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:800}h1{margin:4px 0 0;font-size:clamp(24px,3vw,38px);line-height:1.05}.subtitle{color:var(--muted);max-width:850px;margin:8px 0 0;line-height:1.45}.grid{gap:16px;display:grid}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;min-width:0;padding:18px}.card h2{margin:0 0 12px;font-size:18px}.card h3{margin:0 0 8px;font-size:15px}.stat{font-size:30px;font-weight:900}.small{color:var(--muted);font-size:13px;line-height:1.4}.badge{background:var(--panel-2);color:var(--blue-2);border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:700;display:inline-flex}.badge.green{color:var(--green);background:#dcfce7}.badge.red{color:var(--red);background:#fee2e2}.btn{background:var(--blue);color:#fff;cursor:pointer;border:0;border-radius:12px;align-items:center;gap:8px;padding:10px 14px;font-weight:800;display:inline-flex}.btn.secondary{color:#111827;background:#e5e7eb}.btn.ghost{color:var(--blue);border:1px solid var(--line);background:0 0}.btn:disabled{opacity:.55;cursor:not-allowed}.field{gap:6px;margin-bottom:12px;display:grid}.field label{color:#344054;text-transform:uppercase;letter-spacing:.04em;font-size:12px;font-weight:800}.field input,.field select,.field textarea{border:1px solid var(--line);width:100%;color:var(--text);background:#fff;border-radius:12px;padding:10px 12px}.field textarea{resize:vertical;min-height:88px}.table-wrap{border:1px solid var(--line);border-radius:14px;overflow:auto}table{border-collapse:collapse;width:100%;min-width:760px}th,td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:11px 12px}th{text-transform:uppercase;letter-spacing:.04em;color:#475467;background:#f8fafc;font-size:12px}tr:last-child td{border-bottom:0}.mobile-only{display:none}.progress-bar{background:#e5e7eb;border-radius:999px;width:100%;height:12px;overflow:hidden}.progress-fill{background:var(--green);border-radius:inherit;height:100%}.canvas-shell{height:500px;color:var(--muted);text-align:center;background:#fafafa;border:1px dashed #98a2b3;border-radius:18px;place-items:center;padding:20px;display:grid}.note-list{color:#344054;gap:8px;padding-left:18px;line-height:1.45;display:grid}.warning{border-left:4px solid var(--yellow);color:#6b4f00;background:#fffbeb;border-radius:12px;padding:12px 14px}@media (max-width:960px){.shell{grid-template-columns:1fr}.sidebar{z-index:20;padding:12px;position:sticky;top:0}.nav{padding-bottom:4px;display:flex;overflow-x:auto}.nav a,.nav button{white-space:nowrap}.main{padding:14px}.topbar{flex-direction:column}.grid.two,.grid.three,.grid.four{grid-template-columns:1fr}.desktop-only{display:none}.mobile-only{display:block}.canvas-shell{height:340px}}.builder-topline{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.builder-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.btn.danger{background:var(--red);color:#fff}.takeoff-layout{grid-template-columns:minmax(220px,280px) minmax(420px,1fr) minmax(320px,430px);align-items:stretch;gap:16px;display:grid}.folder-list-card,.details-card,.plan-card{min-height:0}.folder-list{gap:8px;max-height:420px;padding-right:4px;display:grid;overflow:auto}.folder-pill{border:1px solid var(--line);color:var(--text);text-align:left;cursor:pointer;background:#fff;border-radius:14px;gap:4px;padding:10px 11px;display:grid}.folder-pill strong{font-size:13px}.folder-pill span{color:var(--muted);font-size:12px;line-height:1.3}.folder-pill.active{border-color:var(--blue);box-shadow:0 0 0 3px #174ea624}.mini-metrics{gap:8px;margin-top:12px;display:grid}.mini-metrics div{border:1px solid var(--line);background:#f8fafc;border-radius:12px;padding:10px}.mini-metrics span{color:var(--muted);text-transform:uppercase;margin-bottom:3px;font-size:11px;font-weight:800;display:block}.mini-metrics b{font-size:20px}.viewer-toolbar{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:10px;display:flex}.viewer-toolbar select,.viewer-toolbar input{border:1px solid var(--line);border-radius:12px;width:auto;min-width:110px;padding:9px 10px}.viewer-toolbar .short-input{width:76px;min-width:76px}.plan-viewer{border:1px solid var(--line);overscroll-behavior:contain;background:#818b9a;border-radius:18px;height:min(64vh,740px);min-height:520px;position:relative;overflow:auto}.canvas-wrap{transform-origin:0 0;background:#fff;margin:28px;display:inline-block;position:relative;box-shadow:0 14px 36px #0f172a38}.canvas-wrap canvas{display:block}.overlay-canvas{z-index:2;touch-action:none;cursor:crosshair;position:absolute;inset:0}.empty-plan{text-align:center;color:#334155;background:#ffffffc7;border:2px dashed #98a2b3;border-radius:18px;place-items:center;gap:6px;padding:22px;display:grid;position:absolute;inset:20px}.empty-plan strong{font-size:18px;display:block}.empty-plan span{color:var(--muted);max-width:520px;display:block}.viewer-status{color:var(--muted);flex-wrap:wrap;gap:8px;margin-top:10px;font-size:12px;display:flex}.viewer-status span{border:1px solid var(--line);background:#f8fafc;border-radius:999px;padding:6px 10px}.details-grid{max-height:690px;padding-right:4px;overflow:auto}.field-photo-box{border:1px solid var(--line);background:#f8fafc;border-radius:16px;gap:8px;margin-top:10px;padding:12px;display:grid}.field-photo-box h3{margin:0}.field-photo-box input{border:1px solid var(--line);border-radius:12px;width:100%;padding:10px 12px}@media (max-width:1320px){.takeoff-layout{grid-template-columns:minmax(220px,260px) minmax(420px,1fr)}.details-card{grid-column:1/-1}}@media (max-width:960px){.takeoff-layout{grid-template-columns:1fr}.builder-topline{flex-direction:column}.builder-actions{justify-content:flex-start}.plan-viewer{height:60vh;min-height:420px}.viewer-toolbar{flex-wrap:nowrap;padding-bottom:4px;overflow-x:auto}.viewer-toolbar .btn,.viewer-toolbar select,.viewer-toolbar input{white-space:nowrap}}[id]{scroll-margin-top:18px}.subcard{border:1px solid var(--line);background:#f8fafc;border-radius:16px;padding:14px}.subcard h3{margin:0 0 8px}.section-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.metric-card{box-shadow:none;background:#f8fafc}.metric-card .stat{font-size:22px}.card input:disabled{color:#344054;background:#f1f5f9}.plan-viewer.middle-panning,.plan-viewer.middle-panning .overlay-canvas{cursor:grabbing}.overlay-canvas{touch-action:none}.nav-button{color:#dbeafe;text-align:left;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:12px;align-items:center;gap:10px;padding:11px 12px;font-weight:800;display:flex}.nav-button:hover{background:#ffffff1f}.attachment-list{gap:8px;margin-top:10px;display:grid}.attachment-pill{border:1px solid var(--line);background:#fff;border-radius:12px;justify-content:space-between;align-items:flex-start;gap:10px;padding:10px;display:flex}.attachment-pill strong{font-size:13px;display:block}.attachment-pill span{color:var(--muted);margin-top:3px;font-size:12px;line-height:1.3;display:block}@media (max-width:720px){.attachment-pill{flex-direction:column}}.folder-preview-panel{border:1px solid var(--line);background:#f8fafc;border-radius:16px;gap:10px;margin-top:14px;padding:12px;display:grid}.folder-preview-panel h3{margin:6px 0 0}.folder-preview-panel summary{cursor:pointer;color:#111827;padding:8px 0;font-weight:900}.folder-preview-image{object-fit:contain;border:1px solid var(--line);background:#fff;border-radius:12px;width:100%;max-height:260px}.empty-mini-preview{text-align:center;color:var(--muted);background:#fff;border:1px dashed #98a2b3;border-radius:12px;padding:20px}.mini-detail-list{gap:6px;max-height:260px;padding-right:4px;display:grid;overflow:auto}.mini-detail-list div{border:1px solid var(--line);background:#fff;border-radius:10px;gap:3px;padding:8px;display:grid}.mini-detail-list span{color:var(--muted);text-transform:uppercase;font-size:11px;font-weight:800}.mini-detail-list b{word-break:break-word;font-size:12px;line-height:1.35}.attachment-list.compact{max-height:260px;padding-right:4px;overflow:auto}.folder-drop-zone{border-style:dashed}.folder-drop-zone:hover{border-color:var(--blue);background:#eef6ff}.marked-page-strip{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:10px;display:grid}.marked-page-card{border:1px solid var(--line);background:#fff;border-radius:14px;gap:6px;padding:10px;display:grid}.marked-page-card strong{font-size:13px}.marked-page-card span{color:var(--muted);font-size:12px}.marked-page-card img{object-fit:contain;border:1px solid var(--line);background:#fff;border-radius:10px;width:100%;max-height:240px}.preview-banner{color:#fff;background:#facc1521;border:1px solid #ffffff38;border-radius:14px;gap:5px;padding:10px;display:grid}.preview-banner strong{font-size:13px}.preview-banner span{color:#fde68a;font-size:12px}.preview-banner button{color:#111827;cursor:pointer;background:#facc15;border:0;border-radius:10px;padding:8px 10px;font-weight:900}.permission-grid{gap:10px;display:grid}.permission-toggle{border:1px solid var(--line);background:#fff;border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;display:flex}.permission-toggle input{width:auto}.restricted-card{border-left:5px solid var(--red)}.role-preview-card{border-left:5px solid var(--blue)}.edit-folder-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}@media (max-width:720px){.edit-folder-grid{grid-template-columns:1fr}}:root[data-theme=dark]{--bg:#0f172a;--panel:#111827;--panel-2:#1e293b;--text:#e5e7eb;--muted:#a7b0c0;--line:#334155;--blue:#60a5fa;--blue-2:#93c5fd;--green:#34d399;--red:#f87171;--yellow:#facc15;--shadow:0 10px 30px #00000040}:root[data-theme=dark] .sidebar{background:#020617}:root[data-theme=dark] .card,:root[data-theme=dark] .subcard,:root[data-theme=dark] .folder-pill,:root[data-theme=dark] .attachment-pill,:root[data-theme=dark] .marked-page-card,:root[data-theme=dark] .mini-detail-list div,:root[data-theme=dark] .folder-preview-panel{background:#111827}:root[data-theme=dark] .field input,:root[data-theme=dark] .field select,:root[data-theme=dark] .field textarea{color:var(--text);border-color:var(--line);background:#0f172a}:root[data-theme=dark] th{color:#cbd5e1;background:#1e293b}:root[data-theme=dark] .small,:root[data-theme=dark] .subtitle,:root[data-theme=dark] .folder-pill span,:root[data-theme=dark] .attachment-pill span{color:var(--muted)}:root[data-theme=dark] .btn.secondary{color:#e5e7eb;background:#334155}:root[data-theme=dark] .btn.ghost{color:#93c5fd;border-color:#334155}:root[data-theme=dark] .warning{color:#fef3c7;background:#422006}:root[data-theme=dark] .metric-card,:root[data-theme=dark] .mini-metrics div,:root[data-theme=dark] .viewer-status span{background:#1e293b}:root[data-theme=dark] .empty-plan,:root[data-theme=dark] .empty-mini-preview{color:var(--text);background:#111827}.owner-rescue-banner{color:#fff;background:#facc1529;border:1px solid #facc1573;border-radius:14px;gap:7px;padding:10px;display:grid}.owner-rescue-banner strong{font-size:13px}.owner-rescue-banner span{color:#fde68a;font-size:12px;line-height:1.35}.owner-rescue-banner .btn{color:#111827;background:#facc15;justify-content:center}.owner-nav-button{color:#fde68a!important;background:#facc1538!important;border-color:#facc1559!important}.owner-rescue-card{border-left:5px solid var(--yellow)}.field-device-banner{color:#dbeafe;background:#60a5fa29;border:1px solid #93c5fd59;border-radius:14px;padding:10px;font-size:12px;font-weight:700;line-height:1.35}.field-mobile-actions{border-left:5px solid var(--blue)}.signature-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:10px;display:grid}.signature-card{border:1px solid var(--line);background:#fff;border-radius:14px;align-content:start;gap:8px;padding:12px;display:grid}.signature-card strong{font-size:13px}.signature-card span{color:var(--muted);min-height:36px;font-size:12px;line-height:1.35}:root[data-theme=dark] .signature-card{background:#111827}@media (max-width:960px){.shell.field-device-shell .sidebar{z-index:30;gap:10px;padding-bottom:76px;position:sticky;top:0}.shell.field-device-shell .brand-sub{display:none}.shell.field-device-shell .brand-mark{border-radius:10px;width:34px;height:34px}.shell.field-device-shell .nav{z-index:50;background:#111827;border-top:1px solid #ffffff26;gap:8px;padding:8px;display:flex;position:fixed;bottom:0;left:0;right:0;overflow-x:auto;box-shadow:0 -10px 25px #00000040}.shell.field-device-shell .nav a,.shell.field-device-shell .nav button{border-radius:999px;min-width:max-content;padding:10px 12px;font-size:13px}.shell.field-device-shell .main{padding:12px 12px 88px}.shell.field-device-shell .topbar h1{font-size:24px}.shell.field-device-shell .card{border-radius:16px;padding:14px}.shell.field-device-shell .folder-list.tall{max-height:260px}.loop-page-layout{grid-template-columns:1fr!important}.signature-grid,.field-mobile-actions .grid.two{grid-template-columns:1fr}.field-mobile-actions .btn{justify-content:center;width:100%}.marked-page-card img{max-height:360px}table{min-width:680px}}