/* Compact data, contextual typography and template palette controls. */
.dataset{height:116px!important;min-height:116px;flex-shrink:0}
.dataset .table-scroll{max-height:72px}
.dataset tbody tr{height:34px}
.card-stage{position:relative}
#stage-shell{padding-top:90px;padding-bottom:75px}
.text-toolbar{position:absolute;z-index:5;display:flex;align-items:center;gap:3px;padding:6px;background:#242a2c;border:1px solid #637276;border-radius:8px;box-shadow:0 6px 22px #0007;width:max-content;max-width:430px;min-height:43px}
.text-toolbar>select{width:126px;height:29px;padding:4px;font-size:11px}
.text-toolbar>input{width:55px;padding:4px;height:29px}
.text-toolbar .tool{width:29px;min-width:29px;height:29px;padding:5px;display:grid;place-items:center}
.text-toolbar .tool.active{color:var(--aqua);background:#16f4d020}
.toolbar-colors>summary{list-style:none;cursor:pointer;display:grid;place-items:center;width:29px;height:29px}
.toolbar-colors>summary::-webkit-details-marker{display:none}
.toolbar-color-menu{position:absolute;top:calc(100% + 5px);right:0;width:250px;background:#292f31;border:1px solid #617174;padding:12px;border-radius:6px;box-shadow:0 5px 20px #0007}
.color-picker{position:relative;min-width:0}
.color-picker>.field{padding-right:35px}
.color-picker>input[type=color]{position:absolute;right:0;top:21px;width:29px;height:29px;padding:2px;cursor:pointer}
.color-picker .swatches{display:flex;gap:5px;flex-wrap:wrap;margin:6px 0 12px;padding:0}
.swatches button{width:21px;height:21px;min-width:21px;border:1px solid #ffffff65;border-radius:3px}
.palette-open{margin:10px;width:calc(100% - 20px)}
.palette-generator{display:flex;gap:12px;margin:0 0 15px}
.palette-generator select{width:180px}
.palette-strip{display:flex;border-radius:7px;overflow:hidden;margin-bottom:20px;height:115px}
.palette-strip button{flex:1;min-width:0;border:0;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:space-around}
.palette-strip span{font-size:22px}
.palette-strip b{font:11px Consolas,monospace}
.palette-table{width:100%;border-collapse:collapse}
.palette-table th,.palette-table td{padding:7px 5px;text-align:left;border-bottom:1px solid #485354}
.palette-table input{min-width:0}
.palette-table th:first-child{width:24%}
.palette-table td:nth-child(2){width:50px}
.palette-table input[type=color]{width:36px;height:32px;padding:2px}
.sheet-backdrop{padding:0;background:var(--carbon);z-index:100}
.sheet-modal{height:100dvh;width:100vw;max-width:none;max-height:none;border:0;border-radius:0;display:flex;flex-direction:column;overflow:hidden;box-shadow:none}
.sheet-modal>header{padding:12px 20px;flex-shrink:0;gap:15px}
.sheet-modal header h2{margin:0 0 4px}
.sheet-modal header small{font-size:11px;color:#b8c6c6}
.sheet-modal header>div:last-child{display:flex;gap:10px}
.sheet-tools{display:flex;align-items:center;gap:6px;flex-shrink:0;padding:8px 16px;border-bottom:1px solid var(--line);overflow-x:auto}
.sheet-tools button{padding:7px 10px;background:#ffffff09;border:1px solid #495456}
.sheet-tools select{width:160px;flex-shrink:0}
.sheet-tools label{display:flex;align-items:center;gap:5px}
.sheet-tools input{width:64px}
.sheet-tools i{border-left:1px solid #667375;height:24px;margin:0 7px}
#sheet-message{font-size:11px;flex-shrink:0;margin:0;padding:6px 18px;color:var(--aqua);min-height:28px}
#spreadsheet-root{flex:1;min-height:0;width:100%;background:white;color:#222;color-scheme:light;isolation:isolate}
.sheet-modal>footer{justify-content:space-between;font-size:10px;padding:8px 16px;flex-shrink:0}
.sheet-modal>footer a{color:var(--aqua);margin-left:15px}
@media(max-width:760px){.text-toolbar{flex-wrap:wrap;width:290px;max-width:calc(100vw - 30px)}.text-toolbar>select{width:115px}.sheet-modal>header{padding:10px}.sheet-modal header small{display:none}.sheet-tools{padding:7px}.sheet-modal>footer>span{max-width:75%}.palette-table th,.palette-table td{padding:6px 2px}.palette-table input{font-size:11px;padding:5px}.palette-strip b{font-size:9px}.dataset .data-header{height:40px;flex-wrap:nowrap}.dataset .data-header .tag{display:none}}

@media(max-width:760px){.modal.sheet-modal{width:100vw;max-width:none;height:100dvh;max-height:none}.sheet-backdrop{padding:0}}
/* Fades unless the pointer or keyboard is using it. */
.text-toolbar{gap:2px;padding:3px;min-height:30px;border-radius:5px;max-width:440px;opacity:.38;transition:opacity .16s,box-shadow .16s;background:#242a2cd9;box-shadow:0 2px 8px #0003}
.text-toolbar:hover,.text-toolbar:focus-within,.text-toolbar:has(details[open]){opacity:1;box-shadow:0 4px 15px #0006}
.text-toolbar>select{width:92px;height:24px;padding:2px;font-size:10px}
.text-toolbar>select[data-field=text_role]{width:58px}
.text-toolbar>input{width:43px;height:24px;padding:2px;font-size:10px}
.text-toolbar .tool,.toolbar-colors>summary{width:24px;min-width:24px;height:24px;padding:3px}
.library .tabs{flex-wrap:wrap}
.library .tabs button{font-size:10px;padding:10px 5px;flex:1}
.settings-panel{padding:0 12px 20px}
.settings-panel .panel-heading{padding:15px 0 8px}
.settings-panel .panel-note{padding:4px 0;line-height:1.5}
.font-control{display:flex;align-items:end;gap:3px;margin-bottom:10px}
.font-control .field{flex:1;min-width:0;margin:0}
.font-control .mini{flex-shrink:0;margin-bottom:2px}
.theme-color{display:grid;grid-template-columns:1fr 25px 63px;align-items:center;gap:5px;font-size:10px;margin:6px 0}
.theme-color input{width:25px;height:24px;padding:1px}
.theme-color code{font-size:10px;color:#a9bcbd}
.output-size{font-size:12px;color:var(--aqua)}
.output-size small{display:block;color:#a4b4b4;font-size:10px}
.settings-panel a{color:var(--aqua)}
.row-actions{position:sticky;left:0;background:#293538;z-index:2;white-space:nowrap!important;min-width:140px}
.row-actions .mini{display:inline-grid;place-items:center;width:25px;height:25px;font-size:15px;padding:0}
.row-actions .hidden-row{margin-left:4px;color:var(--coral)}
.resource-results{max-height:42vh;overflow:auto;margin-top:10px;min-height:60px}
.font-result{display:flex;align-items:center;justify-content:space-between;padding:10px;border-bottom:1px solid var(--line)}
.font-result small{display:block;color:#adbbbb;font-size:11px;margin-top:3px}
.icon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:6px}
.icon-grid .icon-choice{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:10px 4px;min-height:68px;background:#ffffff08;color:var(--blush)}
.icon-grid img,.icon-grid svg{width:28px;height:28px;object-fit:contain}
.icon-grid small{font-size:9px;overflow:hidden;text-overflow:ellipsis;max-width:78px;white-space:nowrap}
.linked-icons>div{display:flex;align-items:center;gap:8px;padding:5px;border-bottom:1px solid var(--line)}
.linked-icons span{flex:1;font-size:10px;overflow:hidden;text-overflow:ellipsis}
@media(hover:none){.text-toolbar{opacity:.9}}
@media(max-width:760px){.text-toolbar{width:max-content;max-width:310px;flex-wrap:wrap}.text-toolbar>select{width:83px}.row-actions{min-width:130px}}
/* Reusable base templates and the draft-only project wizard. */
.template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin:12px 0}
.template-card{display:flex;flex-direction:column;align-items:stretch;text-align:left;gap:5px;padding:8px;background:#1c282b;border:1px solid var(--line);border-radius:7px;min-width:0;color:var(--blush)}
.template-card:hover,.template-card.chosen{border-color:var(--aqua);background:#25403e}
.template-card.chosen{box-shadow:0 0 0 1px var(--aqua)}
.template-thumb{height:150px;display:grid;place-items:center;background:#121b1e;border-radius:4px;overflow:hidden}
.template-thumb img{display:block;width:100%;height:150px;object-fit:contain}
.template-card strong{font-size:11px;line-height:1.4}
.template-card small{color:#a6b7b8;font-size:10px;line-height:1.4}
.template-empty{font-size:55px;color:#b5c9c6}
.template-library summary{font-size:10px;cursor:pointer;padding:6px 0;color:#abc1be}
.template-library .template-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;max-height:440px;overflow:auto}
.template-library .template-thumb{height:104px}
.template-library .template-thumb img{height:104px}
.template-library .template-card{padding:5px}
.modal:has(.wizard){width:min(940px,94vw)}
.wizard-steps{display:flex;gap:12px;border-bottom:1px solid var(--line);margin-bottom:16px;padding-bottom:10px;flex-wrap:wrap;color:#9aafad;font-size:12px}
.wizard-steps .current{color:var(--aqua);font-weight:700}
.wizard .template-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.file-drop{display:flex;flex-direction:column;gap:10px;padding:18px;border:1px dashed #6b8a85;border-radius:6px;margin:12px 0;color:var(--aqua)}
.file-drop input{max-width:100%;color:var(--blush)}
.file-drop small{color:#a5b7b4}
.wizard-table{overflow:auto;max-height:280px;margin:12px 0;border:1px solid var(--line)}
.wizard-table table{width:100%;border-collapse:collapse;font-size:11px;text-align:left}
.wizard-table td,.wizard-table th{padding:7px;border-bottom:1px solid var(--line);min-width:90px;max-width:240px;overflow:hidden;text-overflow:ellipsis}
.wizard-table select{width:100%;min-width:160px;font-size:12px}
.wizard-table th{position:sticky;top:0;background:#263336}
.wizard-review{display:flex;align-items:center;gap:18px}
.review-thumb{height:145px;width:104px;flex-shrink:0}
.review-thumb img{width:100%;height:100%;object-fit:contain}
.import-success{color:var(--aqua)}
@media(max-width:760px){.wizard .template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wizard-review{gap:10px}.wizard-steps{font-size:10px}}

.template-card strong,.template-card small{white-space:normal;overflow-wrap:anywhere}
/* Shared compact tables for assets, project settings and layer order. */
.workspace{grid-template-columns:380px minmax(300px,1fr) 258px}
.table-scroll{overflow-x:auto;max-width:100%;flex-shrink:0}
.ui-table{width:100%;table-layout:fixed;font-size:10px;white-space:normal}
.ui-table th,.ui-table td{padding:6px 4px;vertical-align:middle;max-width:none;overflow:hidden;text-overflow:ellipsis}
.ui-table thead th{font-size:9px;color:#9daead;font-weight:500;background:#202a2c}
.ui-table input,.ui-table select{font-size:10px;padding:5px 3px;min-height:29px}
.ui-table tbody th{font-weight:500}
.ui-table .table-actions{white-space:nowrap;overflow:visible}
.icon-button{display:inline-flex;align-items:center;justify-content:center;width:24px;height:26px;padding:4px;vertical-align:middle;flex-shrink:0}
.icon-button svg,.drag-handle svg{width:15px;height:15px;pointer-events:none}
.icon-button[aria-pressed=true]{color:var(--aqua)}
.layer-table th:first-child{width:32px}.layer-table th:last-child{width:108px}
.layer-table .layer-name{width:100%;padding:5px 2px;font-size:11px;white-space:normal}
.layer-table .layer-name span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.layer-table .layer-name small{display:block;font-size:9px;color:#8eaaa2;margin-top:3px}
.layer-table tr.selected{background:#16f4d010}.layer-table tr.selected td:first-child{box-shadow:inset 2px 0 var(--aqua)}
.drag-handle{cursor:grab;touch-action:none;display:grid;place-items:center;padding:4px;width:24px;height:30px;color:#9aadaa}
.layer-table tr.dragging{opacity:.45}.layer-table tr.drop-before td{box-shadow:inset 0 2px var(--aqua)}.layer-table tr.drop-after td{box-shadow:inset 0 -2px var(--aqua)}
.asset-table th:first-child{width:43px}.asset-table th:last-child{width:56px}.asset-table th:nth-child(2){width:84px}
.asset-thumb{display:grid;place-items:center;width:36px;height:36px;padding:1px;background:#111b1e}
.asset-thumb img{width:34px;height:34px;object-fit:contain}
.asset-table .asset-title{overflow-wrap:anywhere;font-size:10px}
.placeholder-link{display:block;padding:4px 0;white-space:normal;text-align:left;color:var(--aqua);font-size:10px;overflow-wrap:anywhere;max-width:100%}
.asset-preview{display:block;width:100%;max-height:180px;object-fit:contain;margin-bottom:12px}
.typography-table th:first-child{width:60px}.typography-table th:nth-child(3){width:54px}.typography-table th:last-child{width:48px}
.colors-table th:first-child{width:45px}.colors-table th:nth-child(2){width:65px}.colors-table th:nth-child(3){width:86px}
.colors-table input[type=color]{width:29px;height:29px;padding:1px}
.colors-table input{font-family:monospace;font-size:9px}
.print-advanced{margin:10px 0;padding:8px;border:1px solid var(--line);border-radius:4px;flex-shrink:0}
.print-advanced summary{font-size:11px;cursor:pointer}.print-advanced[open] summary{margin-bottom:12px}
.print-zones{display:grid;grid-template-columns:1fr 1fr;font-size:10px;gap:7px}.print-zones dd{margin:0;color:var(--aqua)}
@media(min-width:1600px){.workspace{grid-template-columns:400px minmax(300px,1fr) 285px}}
@media(min-width:761px) and (max-width:1100px){.workspace{grid-template-columns:340px minmax(220px,1fr) 210px}}
@media(max-width:760px){.workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(640px,auto) auto}.library{max-height:48dvh;border-right:0;border-bottom:1px solid var(--line)}.workarea,.inspector{grid-column:1}.library .panel-heading{padding:11px}.layer-table .layer-name{padding:5px}.table-scroll{width:100%}.library .table-scroll{flex-shrink:0}.property-scroll{grid-template-columns:1fr}.ui-table input,.ui-table select{font-size:11px}}

.library>.table-scroll{flex:0 0 auto}
.library>.panel-heading,.library>.panel-note{flex-shrink:0}

.library>.tabs{position:sticky;top:0;z-index:4;background:var(--panel)}
/* Contextual object controls, compact transforms and asset type tabs. */
.object-toolbar .icon-button{width:24px;min-width:24px;height:24px;min-height:24px;padding:3px}
.object-toolbar>input{width:43px}
.object-toolbar>i{height:18px;border-left:1px solid #617573;margin:0 3px}
.object-toolbar .toolbar-color-menu{right:auto;left:0}
.object-toolbar details{position:relative}
.transform-grid{display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:8px 6px;margin-bottom:12px}
.inline-field{display:flex;align-items:center;gap:4px;min-width:0;font-size:9px;color:#aabdb6}
.inline-field span{white-space:nowrap;flex-shrink:0}
.inline-field input{min-width:0;padding:5px 2px;font-size:10px;height:28px}
.asset-tabs{display:flex;gap:4px;padding:8px 12px;border-bottom:1px solid var(--line);flex-shrink:0}
.asset-tabs button{padding:6px 14px;font-size:11px;border:1px solid var(--line)}
.asset-tabs button.active{color:var(--aqua);background:#16f4d012;border-color:#16f4d065}
.icon-assets-table th:last-child{width:80px}
@media(max-width:760px){.object-toolbar{flex-wrap:nowrap;max-width:310px}.object-toolbar .icon-button{min-width:22px;width:22px}.property-scroll>.transform-grid{grid-column:1/-1}}