:root{--app-bg: #f5f5f3;--panel-bg: #ffffff;--panel-muted: #f0f0ed;--text-primary: #181816;--text-secondary: #5f5f59;--text-tertiary: #8a8a82;--border: #d8d8d2;--border-strong: #b9b9b0;--accent: #1f6f5b;--accent-soft: #e5f2ee;--warning: #b7791f;--warning-soft: #fff4db;--critical: #b42318;--critical-soft: #fee4e2;--success: #16784f;--success-soft: #e7f5ee;font-family:Inter,system-ui,sans-serif;color:var(--text-primary);background:var(--app-bg)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:var(--app-bg)}button,input,select,textarea{font:inherit}button,select,.import-button{border:1px solid var(--border);background:#fff;color:var(--text-primary);border-radius:8px;padding:9px 11px;cursor:pointer}button:hover,.import-button:hover{border-color:var(--border-strong)}.primary-button{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700}.ghost-button{background:var(--accent-soft);color:var(--accent);border-color:transparent;font-weight:700}.app-shell{min-height:100vh;padding:18px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1640px;margin:0 auto 16px}.app-header h1{margin:0;font-size:24px;letter-spacing:0}.app-header p{margin:4px 0 0;color:var(--text-secondary);font-size:14px;max-width:720px}.workspace{display:grid;grid-template-columns:minmax(300px,380px) minmax(460px,1fr) minmax(260px,330px);gap:16px;max-width:1640px;margin:0 auto;align-items:start}.left-rail,.right-rail{display:grid;gap:16px}.panel,.preview-shell{background:var(--panel-bg);border:1px solid var(--border);border-radius:12px;padding:16px;box-shadow:0 12px 28px #1414120a}.panel-heading,.preview-toolbar{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.eyebrow{margin:0 0 5px;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:800}h2{margin:0;font-size:16px;letter-spacing:0}h3{margin:14px 0 8px;font-size:13px}textarea{width:100%;height:380px;resize:vertical;border:1px solid var(--border);border-radius:8px;padding:12px;font-family:"Source Sans 3",ui-monospace,monospace;font-size:13px;line-height:1.45;background:#fffefb}.metadata-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.metadata-grid .field:first-child{grid-column:1 / -1}.logo-upload-row{grid-column:1 / -1;display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end}.logo-upload{display:grid;gap:6px}.logo-upload span{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:800}.logo-upload input{display:none}.logo-upload b{display:block;border:1px dashed var(--border-strong);border-radius:8px;padding:9px 10px;background:#fff;cursor:pointer;font-size:13px}.logo-choice-row{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:8px}.logo-choice-row button{font-size:12px;font-weight:700}.logo-choice-row button.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}.field input,.item-slide input,.item-slide select,.item-slide textarea{width:100%;min-width:0;border:1px solid var(--border);border-radius:8px;padding:9px 10px;background:#fff;color:var(--text-primary)}.category-tab-strip{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px;align-items:start;margin-top:12px}.category-tabs{display:flex;gap:0;overflow-x:auto;padding:0;scrollbar-width:none;scroll-behavior:smooth}.category-tabs::-webkit-scrollbar{display:none}.category-tabs button{white-space:nowrap;flex:0 0 auto;padding:8px 10px;font-size:12px}.category-tab-wrap{display:flex;align-items:stretch;flex:0 0 auto}.drop-zone{width:8px;flex:0 0 8px;border-radius:999px;margin:4px 2px}.drop-zone.active{background:var(--accent)}.drop-zone.end{margin-right:6px}.category-tabs button.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:800}.category-tabs button[draggable=true]{cursor:grab}.category-tabs button.dragging{opacity:.55;cursor:grabbing}.category-tabs .add-tab{border-style:dashed;font-weight:800}.tab-scroll-button{width:36px;height:36px;padding:0;display:grid;place-items:center;font-size:22px;line-height:1;font-weight:700;background:#fff}.category-input{border:1px solid var(--border);border-radius:10px;padding:12px;background:#fffefb;margin-top:8px}.category-input-header{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end;margin-bottom:10px}.item-carousel-toolbar{display:grid;grid-template-columns:minmax(0,auto) 1fr auto;align-items:center;gap:8px;margin-bottom:10px}.item-carousel-toolbar button{padding:8px 10px}.carousel-next-actions{display:flex;gap:6px;justify-content:end}.item-carousel-toolbar span{text-align:center;color:var(--text-secondary);font-size:12px;font-weight:800}button:disabled{cursor:not-allowed;color:var(--text-tertiary);background:var(--panel-muted)}.item-slide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px;border-radius:8px;background:var(--panel-muted)}.item-slide label{display:grid;gap:5px;min-width:0}.item-slide .wide{grid-column:1 / -1}.item-slide span{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:800}.item-slide textarea{height:86px;resize:vertical;font-family:inherit;background:#fff}.item-slide-actions{grid-column:1 / -1;display:flex;gap:8px;flex-wrap:wrap}.item-slide-actions button{padding:8px 10px}.empty-item-state{display:grid;gap:8px;place-items:start;padding:18px;border-radius:8px;background:var(--panel-muted)}.empty-item-state p{margin:0;color:var(--text-secondary);font-size:13px}.remove-item{justify-self:start;padding:7px 9px;font-size:12px}.add-category{width:100%;margin-top:10px;font-weight:700}.sample-row,.check-grid,.color-grid{display:grid;gap:8px}.sample-row{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:10px}.sample-row button.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:800}.controls-panel{display:grid;gap:12px}.style-group{border:1px solid var(--border);border-radius:10px;background:#fffefb;overflow:hidden}.style-group summary{cursor:pointer;list-style:none;padding:11px 12px;color:var(--text-primary);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;display:flex;justify-content:space-between;align-items:center}.style-group summary::-webkit-details-marker{display:none}.style-group summary:after{content:"+";color:var(--text-tertiary);font-size:16px;line-height:1}.style-group[open] summary{border-bottom:1px solid var(--border);background:var(--panel-muted)}.style-group[open] summary:after{content:"-"}.style-group-body{display:grid;gap:12px;padding:12px}.field{display:grid;gap:6px;font-size:13px}.field span,.slider-control strong,.color-grid span{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:800}.field select{width:100%;background:#fff}.segmented{display:flex;flex-wrap:wrap;gap:4px;padding:4px;background:var(--panel-muted);border-radius:10px}.segmented button{flex:1 1 auto;padding:7px 9px;border-color:transparent;background:transparent;text-transform:capitalize;font-size:12px}.segmented button.active{background:#fff;border-color:var(--border);box-shadow:0 2px 8px #0000000f;font-weight:800}.slider-control{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center}.slider-control span{display:grid;gap:2px}.slider-control em{font-style:normal;color:var(--text-tertiary);font-size:12px}.slider-control input{grid-column:1 / -1;accent-color:var(--accent);width:100%}.slider-control b{color:var(--text-tertiary);font-size:12px}.color-grid{grid-template-columns:repeat(3,1fr)}.color-grid label{display:grid;gap:5px}.color-grid input{width:100%;height:34px;border:1px solid var(--border);border-radius:8px;padding:2px;background:#fff}.check-grid label{font-size:13px;color:var(--text-secondary);display:flex;gap:8px;align-items:center}.preview-column{min-width:0}.preview-shell{position:sticky;top:14px}.preview-toolbar h2{max-width:360px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.overlay-tabs{min-width:360px}.preview-stage{min-height:600px;max-height:calc(100vh - 150px);overflow:auto;border-radius:10px;background:#deded8;padding:22px;display:grid;gap:22px;align-content:start;justify-items:center}.page-frame{width:min(100%,780px);background:#fff;box-shadow:0 18px 42px #14141233}.menu-svg{display:block;width:100%;height:auto}.warning-list{display:grid;gap:8px}.warning{display:grid;gap:4px;border:1px solid var(--border);border-radius:8px;padding:10px;font-size:13px;color:var(--text-secondary)}.warning strong{text-transform:uppercase;font-size:10px;letter-spacing:.08em}.warning.critical{background:var(--critical-soft);border-color:#f4aaa4}.warning.critical strong{color:var(--critical)}.warning.warning{background:var(--warning-soft);border-color:#ead09a}.warning.warning strong{color:var(--warning)}.warning.info{background:var(--success-soft);border-color:#acd9c4}.warning.info strong{color:var(--success)}.empty-state,.small-note,.buried-list p{color:var(--text-secondary);font-size:13px;line-height:1.45}.export-panel{display:grid;gap:9px}.import-button{text-align:center}.import-button input{display:none}.modal-backdrop{position:fixed;inset:0;z-index:10;display:grid;place-items:center;padding:18px;background:#14141261}.intro-modal{width:min(540px,100%);background:#fff;border-radius:14px;padding:24px;box-shadow:0 24px 70px #00000038}.intro-modal h2{font-size:26px;margin-bottom:10px}.intro-modal p{color:var(--text-secondary);line-height:1.55}.modal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.mobile-tabs{display:none}@media(max-width:1099px){.workspace{grid-template-columns:1fr}.left-rail,.right-rail{display:contents}.preview-shell{position:static}.preview-stage{max-height:none}}@media(max-width:767px){.app-shell{padding:12px}.app-header{align-items:flex-start}.app-header .primary-button{display:none}.mobile-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;max-width:1640px;margin:0 auto 12px;padding:4px;background:var(--panel-muted);border-radius:10px;position:sticky;top:0;z-index:3}.mobile-tabs button{border-color:transparent;background:transparent;text-transform:capitalize;padding:9px 4px;font-size:12px}.mobile-tabs button.active{background:#fff;border-color:var(--border);font-weight:800}.mobile-hidden{display:none}.mobile-visible{display:block}.preview-toolbar{display:grid}.overlay-tabs{min-width:0;width:100%}.preview-stage{padding:12px;min-height:420px}.page-frame{width:720px;max-width:none}.preview-stage{justify-content:start}textarea{height:52vh}}@media(min-width:768px){.mobile-hidden,.mobile-visible{display:block}}
