body{margin:0}canvas{display:block}#content{position:relative}#tile-toolbar{position:absolute;top:58px;left:16px;z-index:3;display:flex;flex-direction:column;gap:6px;padding:8px;background:rgba(20,20,20,0.72);border-radius:8px;height:calc(75vh - 32px);max-height:calc(75vh - 32px);min-width:220px;overflow:hidden}#tile-toolbar.is-collapsed{display:none}#placement-toggle-dock{position:absolute;top:16px;left:16px;z-index:4;display:flex;gap:6px}#placement-toggle-dock .placement-mode-btn{border:1px solid #777;background:#2f2f2f;color:#fff;width:34px;height:34px;padding:0;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}#placement-toggle-dock .placement-mode-btn:disabled{opacity:0.45;cursor:not-allowed}#placement-toggle-dock .placement-mode-btn.active{background:#f4d03f;color:#111;border-color:#f4d03f}#placement-toggle-dock .placement-mode-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex:0 0 18px}#placement-toggle-dock .placement-mode-icon svg{width:18px;height:18px;display:block}#placement-toggle-dock .placement-mode-icon svg *{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}#view-toolbar{position:absolute;right:16px;top:16px;z-index:3;display:flex;flex-direction:column;align-items:flex-end;gap:6px;padding:8px;background:rgba(20,20,20,0.72);border-radius:8px}#view-toolbar .view-mode-row,#view-toolbar #shape-toolbar,#view-toolbar #wall-toolbar,#view-toolbar #design-toolbar{display:flex;gap:6px}#view-toolbar #shape-toolbar{display:none}#view-toolbar #shape-toolbar.is-visible{display:flex}#view-toolbar #shape-toolbar button{padding:4px 7px;font-size:11px;line-height:1.2}#view-toolbar #wall-toolbar button{padding:4px 7px;font-size:11px;line-height:1.2}#tile-toolbar button{border:1px solid #777;background:#2f2f2f;color:#fff;padding:6px;border-radius:6px;cursor:pointer;text-align:left}#tile-toolbar .tile-button{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;row-gap:6px;align-items:start;padding:6px}#tile-toolbar .tile-button[hidden]{display:none !important}#tile-toolbar .tile-button-thumb-wrap{grid-column:1 / span 2;display:block;position:relative;border-radius:5px;overflow:hidden;border:1px solid rgba(255,255,255,0.18);background:rgba(255,255,255,0.04)}#tile-toolbar .tile-button-thumb{display:block;width:100%;aspect-ratio:1 / 1;object-fit:cover}img.tile-button-thumb{max-width:125px !important}#tile-toolbar .tile-button-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:14px;text-align:center}#tile-toolbar .tile-stock-icon{line-height:1;position:absolute;top:6px;right:6px;z-index:2;background-color:#2f2f2f;border-radius:50%;padding:3px}#tile-toolbar .tile-stock-icon .stx-stock-svg{width:16px;height:16px;display:block}#tile-toolbar .tile-stock-icon .stx-stock-svg circle,#tile-toolbar .tile-stock-icon .stx-stock-svg path{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}#tile-toolbar .tile-stock-icon.in{color:#0ca84a}#tile-toolbar .tile-stock-icon.out{color:#db3535}#tile-toolbar .tile-toolbar-tabs{display:flex;gap:6px}#tile-toolbar .tile-toolbar-tabs button{flex:1 1 0;text-align:center}#tile-toolbar .tile-toolbar-list{display:flex;flex-direction:column;gap:8px;flex:1 1 auto;overflow-y:auto;min-width:0;min-height:0}#tile-toolbar .tile-stock-section{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:6px;min-width:0}#tile-toolbar .tile-stock-separator{font-size:12px;line-height:1.2;color:rgba(255,255,255,0.8);margin-top:4px;padding:6px 5px 0 5px;display:flex;align-items:flex-start;justify-content:space-around;gap:8px;border-top:2px solid rgba(255,255,255,0.22);width:100%;min-width:0}#tile-toolbar .tile-stock-separator-text{display:block;flex:1 1 auto;max-width:26ch;white-space:normal;overflow-wrap:anywhere;word-break:break-word}#tile-toolbar .tile-stock-separator-action{flex:0 0 auto;width:35px;height:35px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;border:1px solid #777;background:#2f2f2f;color:#fff;cursor:pointer}#tile-toolbar .tile-stock-separator-action:hover{background:#f4d03f;color:#111;border-color:#f4d03f}#tile-toolbar .tile-stock-separator-action .stx-enquiry-svg{width:18px;height:18px;display:block}#tile-toolbar .tile-stock-separator-action .stx-enquiry-svg path{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}#placement-toolbar{display:flex;flex-direction:column;gap:8px;flex:1 1 auto;min-height:0}#placement-toolbar .placement-tool-panel{display:flex;flex-direction:column;gap:6px;flex:1 1 auto;min-width:0;min-height:0}#edge-product-list{display:flex;flex-direction:column;gap:8px;flex:1 1 auto;overflow-y:auto;min-height:0}#edge-mode-tabs{display:flex;gap:6px}#edge-mode-tabs button{flex:1 1 0;text-align:center}#corner-product-list{display:flex;flex-direction:column;gap:8px;flex:1 1 auto;overflow-y:auto;min-height:0}#edge-product-list .edge-product-btn{border:1px solid #777;background:#2f2f2f;color:#fff;padding:6px;border-radius:6px;cursor:pointer;text-align:left;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:6px 8px;align-items:start}#edge-product-list .edge-product-btn.active{background:#f4d03f;color:#111;border-color:#f4d03f}#view-toolbar button{border:1px solid #777;background:#2f2f2f;color:#fff;padding:6px 10px;border-radius:6px;cursor:pointer}#tile-toolbar button.active{background:#f4d03f;color:#111;border-color:#f4d03f}#view-toolbar button.active{background:#f4d03f;color:#111;border-color:#f4d03f}#bom-toggle{position:absolute;right:16px;bottom:16px;z-index:3;border:1px solid #777;background:#2f2f2f;color:#fff;padding:8px 12px;border-radius:8px;cursor:pointer}#bom-toggle.active{background:#f4d03f;color:#111;border-color:#f4d03f}#bom-panel{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);z-index:3;width:360px;max-width:calc(100% - 32px);max-height:42vh;display:none;flex-direction:column;gap:8px;padding:10px;background:rgba(20,20,20,0.88);border-radius:8px;border:1px solid #555;color:#fff;overflow:hidden}#bom-panel.open{display:flex}#bom-title{font-size:14px;font-weight:700}#bom-total{font-size:12px;color:#d9d9d9}#bom-grand-total{font-size:13px;font-weight:700;color:#f4d03f}#bom-footer{display:flex;align-items:center;justify-content:space-between;gap:8px}#bom-add-to-basket{border:1px solid #f4d03f;background:#f4d03f;color:#111;padding:6px 10px;border-radius:6px;font-weight:700;cursor:pointer}#bom-add-to-basket:disabled{opacity:0.55;cursor:not-allowed}#bom-list{overflow-y:auto;display:flex;flex-direction:column;gap:6px}.bom-item{display:grid;grid-template-columns:1fr auto;gap:8px;padding:6px 8px;border:1px solid #666;border-radius:6px;background:rgba(255,255,255,0.03)}.bom-item .name{font-size:13px}.bom-item .meta{font-size:11px;color:#bcbcbc}.bom-item .qty{font-size:14px;font-weight:700;color:#f4d03f}#bom-shortages{font-size:11px;color:#ff8c8c;display:flex;flex-direction:column;gap:3px}@media (max-width: 768px){#tile-toolbar,#view-toolbar{gap:6px;padding:6px}#tile-toolbar button,#view-toolbar button{padding:5px 8px;font-size:12px}#tile-toolbar{top:44px;left:10px;height:40vh;max-width:calc(100% - 20px);min-width:0;max-height:40vh}#placement-toggle-dock{top:10px;left:10px}#view-toolbar{right:10px;bottom:10px}#bom-toggle{left:10px;bottom:10px;padding:7px 10px;font-size:12px}#bom-panel{left:50%;top:50%;transform:translate(-50%, -50%);max-width:calc(100% - 20px);width:92vw}}
