:root{--bg: #f6efe1;--panel-bg: #fff;--ink: #2b2b2b;--accent: #cfa15a;--accent-strong: #a87a35;--border: #2b2b2b;--muted: #8a8a8a;font-family:Noto Sans Hebrew,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}.app-shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.sidebar{background:#efe2c5;border-left:2px solid var(--border);padding:16px;overflow-y:auto}.sidebar h1{font-size:18px;margin:0 0 8px}.sidebar h2{font-size:14px;margin:18px 0 6px;color:var(--accent-strong)}.sidebar .item{padding:8px 10px;cursor:pointer;border-radius:6px}.sidebar .item:hover{background:#0000000f}.sidebar .item.active{background:var(--accent);color:#fff;font-weight:700}.sidebar .badge{font-size:11px;color:var(--muted)}.main{padding:18px;overflow-y:auto}.toolbar{display:flex;gap:8px;align-items:center;margin-bottom:12px;flex-wrap:wrap}.toolbar button,.toolbar input,.toolbar select{background:#fff;border:2px solid var(--border);padding:6px 10px;border-radius:6px;font:inherit}.toolbar button{cursor:pointer}.toolbar button:hover{background:var(--accent);color:#fff}.toolbar .spacer{flex:1}.toolbar .status{color:var(--muted);font-size:12px}.toolbar .status.ok{color:green}.toolbar .status.bad{color:#dc143c}.page-board{background:var(--panel-bg);border:2px solid var(--border);border-radius:8px;padding:24px;min-height:calc(100vh - 120px);overflow:auto}.page-meta{display:flex;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-bottom:12px}.page-grid{display:flex;flex-direction:column;gap:14px}.page-row{display:flex;gap:10px;align-items:stretch;height:300px;justify-content:center;max-width:100%;overflow:hidden}.page-row.rtl{flex-direction:row-reverse}.row-text{font-size:13px;color:var(--ink);padding:6px 8px;border-top:1px dashed var(--muted);margin-top:6px}.row-title-band{margin:4px 0}.row-title-input{width:100%;font:inherit;font-weight:700;font-size:14px;padding:4px 8px;border:1px dashed transparent;border-radius:4px;background:transparent;color:var(--accent-strong)}.row-title-input:hover,.row-title-input:focus{border-color:var(--accent-strong);background:#ffffff80}.row-text-band{margin:4px 0 8px}.row-text-input{width:100%;font:inherit;font-size:12px;min-height:38px;resize:vertical;padding:6px 8px;border:1px dashed var(--muted);border-radius:4px;background:#fff6}.row-text-input:focus{background:#fff;border-color:var(--accent-strong)}.bubble-list{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}.bubble-row{display:flex;gap:8px;padding:8px;border:2px solid var(--border);border-radius:6px;background:#fdf5e0;align-items:stretch}.bubble-row .bubble-text{flex:1;min-width:180px;min-height:60px;border:1px solid var(--border);border-radius:4px;padding:4px 6px;font:inherit}.bubble-row .bubble-fields{display:grid;grid-template-columns:auto 70px auto 70px auto 100px;gap:4px 6px;align-items:center;align-self:start;font-size:11px}.bubble-row .bubble-fields label{color:var(--muted)}.bubble-row .bubble-fields input,.bubble-row .bubble-fields select{padding:2px 4px;font-size:12px}.bubble-row .bubble-fields select:last-of-type{grid-column:span 1}.bubble-row .bubble-fields>select:nth-of-type(3){grid-column:span 5}.bubble-row .bubble-remove{background:transparent;border:none;font-size:22px;color:var(--muted);cursor:pointer;align-self:flex-start;padding:0 4px}.bubble-row .bubble-remove:hover{color:#dc143c}.bubble-row .bubble-fields .bubble-flip{background:#f3f3f3;border:1px solid #cbcbcb;border-radius:4px;padding:1px 6px;font-size:13px;cursor:pointer;line-height:1.4;min-width:28px;text-align:center}.bubble-row .bubble-fields .bubble-flip.on{background:var(--accent);color:#fff;border-color:var(--accent-strong)}.bubble-add{background:var(--accent);color:#fff;border:2px solid var(--accent-strong);border-radius:6px;padding:4px 12px;cursor:pointer;font:inherit;font-size:13px}.bubble-add:hover{background:var(--accent-strong)}.defaults-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 12px;margin-bottom:8px}.defaults-field{display:flex;flex-direction:column;gap:2px;font-size:12px}.defaults-field>span{color:var(--muted);font-size:11px}.defaults-field input{font:inherit;padding:4px 6px;border:1px solid var(--border);border-radius:4px}.defaults-field input[type=color]{padding:0;width:60px;height:28px}.template-picker{margin:6px 0 12px}.template-picker>label{font-size:12px;color:var(--muted);display:block;margin-bottom:4px}.template-picker-row{display:flex;gap:10px;align-items:center}.template-picker-row select{flex:1;padding:6px 8px;border:1px solid var(--border);border-radius:4px;font:inherit}.template-preview{width:90px;height:60px;object-fit:contain;border:1px solid var(--border);border-radius:4px;background:#fff;padding:4px}.template-thumb-btn{flex:1;display:flex;align-items:center;gap:10px;background:#fff;border:2px dashed var(--border);border-radius:6px;padding:6px 10px;min-height:56px;cursor:pointer;font:inherit}.template-thumb-btn:hover{background:#fdf5e0;border-style:solid}.template-thumb-btn img{width:60px;height:44px;object-fit:contain;background:#fff;border:1px solid var(--border);border-radius:3px;padding:2px}.template-thumb-empty{color:var(--muted);font-style:italic}.svg-picker-toolbar{display:flex;gap:10px;margin-bottom:10px;align-items:center}.svg-picker-toolbar input{flex:1;padding:6px 8px;border:1px solid var(--border);border-radius:4px;font:inherit}.svg-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;max-height:60vh;overflow-y:auto;padding:4px}.svg-picker-tile{position:relative;cursor:pointer;background:#fff;border:2px solid var(--border);border-radius:6px;padding:6px;display:flex;flex-direction:column;align-items:center;gap:4px}.svg-picker-tile:hover{background:#fdf5e0}.svg-picker-tile.selected{border-color:var(--accent-strong);background:#fff3c4}.svg-picker-tile img{width:100%;height:90px;object-fit:contain;background:#fff;border:1px solid var(--border);border-radius:4px;padding:4px}.svg-picker-name{font-size:11px;text-align:center;word-break:break-all}.svg-picker-check{position:absolute;top:-8px;right:-8px;background:var(--accent-strong);color:#fff;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-weight:800;box-shadow:0 2px 6px #0000004d}.panel-job-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px;background:#0000008c;color:#fff;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:auto}.panel-job-overlay.done{background:#0064008c;animation:fadeOut 1.2s ease-out forwards}.panel-job-overlay.error{background:#780000a6}.panel-job-percent{font-size:28px;font-weight:800;text-shadow:0 1px 4px rgba(0,0,0,.6)}.panel-job-bar{width:80%;height:8px;background:#fff3;border-radius:4px;overflow:hidden}.panel-job-bar-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-strong));transition:width .4s ease}.panel-job-msg{font-size:11px;text-align:center;max-width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.95}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.panel-cell{position:relative;background:#eee;border:2px solid var(--border);border-radius:8px;overflow:hidden;cursor:pointer;height:100%}.panel-cell.selected{outline:3px solid var(--accent);outline-offset:3px}.panel-cell img{width:100%;height:100%;object-fit:cover;display:block}.panel-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(45deg,#d6cbb3 0,#d6cbb3 10px,#c9bb9c 10px,#c9bb9c 20px);color:#5a4a2a;font-size:13px;padding:8px;text-align:center}.panel-cell .caption-overlay{position:absolute;background:#efd88fbf;border:2px solid var(--border);border-radius:4px;padding:4px 8px;max-width:70%;font-size:13px;pointer-events:none;text-align:center}.panel-cell .caption-overlay.top-left{top:8px;left:8px}.panel-cell .caption-overlay.top-right{top:8px;right:8px}.panel-cell .caption-overlay.top-center{top:8px;left:50%;transform:translate(-50%)}.panel-cell .caption-overlay.bottom-left{bottom:8px;left:8px}.panel-cell .caption-overlay.bottom-right{bottom:8px;right:8px}.panel-cell .caption-overlay.bottom-center{bottom:8px;left:50%;transform:translate(-50%)}.panel-cell .speech-bubble{position:absolute;background:#fff9;border:2px solid var(--border);border-radius:50%;padding:6px 12px;font-size:12px;max-width:60%;text-align:center;pointer-events:none}.panel-cell .speech-bubble.thought{border-radius:60% 40% 55% 45%/55% 65% 35% 45%;border-style:dashed}.panel-cell .speech-bubble.tail-bl:after,.panel-cell .speech-bubble.tail-br:after,.panel-cell .speech-bubble.tail-tl:after,.panel-cell .speech-bubble.tail-tr:after{content:"";position:absolute;width:0;height:0;border:10px solid transparent}.panel-cell .speech-bubble.tail-bl:after{bottom:-16px;left:12px;border-top-color:#fff9;border-right-color:#fff9}.panel-cell .speech-bubble.tail-br:after{bottom:-16px;right:12px;border-top-color:#fff9;border-left-color:#fff9}.panel-cell .speech-bubble.tail-tl:after{top:-16px;left:12px;border-bottom-color:#fff9;border-right-color:#fff9}.panel-cell .speech-bubble.tail-tr:after{top:-16px;right:12px;border-bottom-color:#fff9;border-left-color:#fff9}.panel-cell .speech-bubble.thought:after{content:"•••";position:absolute;font-size:10px;color:var(--ink);padding:2px 4px;background:#ffffff80;border:1px solid var(--border);border-radius:50%;border-style:dashed}.panel-cell .speech-bubble.thought.tail-bl:after{bottom:-14px;left:8px}.panel-cell .speech-bubble.thought.tail-br:after{bottom:-14px;right:8px}.panel-cell .speech-bubble.thought.tail-tl:after{top:-14px;left:8px}.panel-cell .speech-bubble.thought.tail-tr:after{top:-14px;right:8px}.editor{border:2px solid var(--border);border-radius:8px;background:#fff;padding:12px;margin-top:14px}.editor h3{margin:0 0 10px}.editor .field{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}.editor .field label{font-size:12px;color:var(--muted)}.editor .field input,.editor .field textarea,.editor .field select{font:inherit;padding:6px;border:1px solid var(--border);border-radius:4px}.editor .field textarea{min-height:56px;resize:vertical}.editor .actions{display:flex;gap:8px}.editor .actions button{background:var(--accent);color:#fff;border:2px solid var(--accent-strong);border-radius:6px;padding:6px 12px;cursor:pointer;font:inherit}.editor .actions button.ghost{background:transparent;color:var(--ink);border-color:var(--border)}.page-text-band{margin-top:16px;padding:10px;border-top:2px solid var(--border);background:#fdf5e0;border-radius:0 0 6px 6px}.page-text-band textarea{width:100%;border:1px solid var(--border);padding:6px;font:inherit;min-height:60px}.connect-screen{max-width:520px;margin:80px auto;padding:24px;border:2px solid var(--border);border-radius:10px;background:#fff}.connect-screen h1{margin-top:0}.connect-screen .field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.connect-screen input{font:inherit;padding:8px;border:1px solid var(--border);border-radius:4px}.connect-screen button{background:var(--accent);color:#fff;border:2px solid var(--accent-strong);border-radius:6px;padding:8px 14px;cursor:pointer;font:inherit}.toast{position:fixed;bottom:16px;right:16px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:6px;font-size:13px;opacity:.92}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:100;padding:24px}.modal-backdrop.draggable{background:transparent;pointer-events:none}.modal-backdrop.draggable .modal{pointer-events:auto}.draggable-handle{cursor:grab;-webkit-user-select:none;user-select:none}.draggable-handle:active{cursor:grabbing}.drag-grip{display:inline-block;color:var(--muted);font-weight:800;padding:0 6px;letter-spacing:-2px}.editor.modal{background:#fff;border:2px solid var(--border);border-radius:10px;width:min(640px,100%);max-height:calc(100vh - 48px);overflow-y:auto;margin-top:0;padding:16px 20px;box-shadow:0 16px 48px #00000059}.modal-head{display:flex;align-items:center;gap:12px;margin-bottom:8px}.modal-head h3{margin:0;flex:1}.modal-head .x{background:transparent;border:none;font-size:26px;line-height:1;cursor:pointer;color:var(--muted);padding:0 6px}.modal-head .x:hover{color:var(--ink)}.editor .row-fields{flex-direction:row!important;gap:12px!important;display:flex!important;margin-bottom:8px}.editor .row-fields>.field{flex:1;margin-bottom:0}.editor .actions{flex-wrap:wrap;margin-top:4px}.editor .actions .primary{background:var(--accent-strong)}.editor .badge{color:var(--muted);font-size:11px;font-weight:400;margin-right:6px}.editor .badge-warn{color:#b34800;font-size:11px;font-weight:600;margin-right:6px}.sidebar .top-action{display:block;width:100%;padding:8px 10px;margin-bottom:10px;background:var(--accent-strong);color:#fff;border:2px solid var(--ink);border-radius:6px;cursor:pointer;font:inherit;font-weight:700}.sidebar .top-action:hover{background:var(--ink)}.wizard .field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.wizard .field label{font-size:12px;color:var(--muted)}.wizard .field input,.wizard .field textarea,.wizard .field select{font:inherit;padding:6px 8px;border:1px solid var(--border);border-radius:4px}.wizard .field textarea{min-height:160px;resize:vertical}.wizard .grid-preview{background:#f7eed5;border:1px dashed var(--border);padding:8px;border-radius:4px}.wizard .grid-preview .row{display:flex;gap:6px;margin-bottom:6px;flex-direction:row-reverse}.wizard .grid-preview .cell{flex:1;aspect-ratio:3 / 4;background:#cfa15a55;border:1px solid var(--accent-strong);border-radius:4px;min-height:40px}.wizard .summary{font-size:12px;color:var(--muted);margin-bottom:8px}.wizard .stepper{display:flex;gap:8px;align-items:center;margin-bottom:12px}.wizard .stepper .dot{width:18px;height:18px;border-radius:50%;background:#ddd;display:inline-block}.wizard .stepper .dot.active{background:var(--accent)}.wizard .stepper .dot.done{background:var(--accent-strong);color:#fff}.progress-wrap{position:relative;height:22px;border:2px solid var(--border);border-radius:6px;background:#f7eed5;margin:6px 0 10px;overflow:hidden}.progress-bar{position:absolute;inset:0 auto 0 0;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-strong));transition:width .4s ease}.progress-label{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--ink);text-shadow:0 0 4px rgba(255,255,255,.6)}.char-chip-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}.char-chip{display:flex;align-items:center;gap:8px;background:#fdf5e0;border:2px solid var(--border);border-radius:8px;padding:6px 10px 6px 6px;position:relative}.char-chip img{width:44px;height:44px;object-fit:cover;border-radius:4px;border:1px solid var(--border);flex:0 0 auto}.char-chip .char-noimg{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#ddd;border-radius:4px;color:#888;font-size:18px}.char-chip .char-meta{display:flex;flex-direction:column;gap:2px;min-width:140px}.char-chip .char-meta strong{font-size:13px}.char-chip .char-meta input{font:inherit;font-size:11px;padding:2px 4px;border:1px solid #bbb;border-radius:3px}.char-chip .x{background:transparent;border:none;font-size:18px;color:var(--muted);cursor:pointer;padding:0 4px;line-height:1}.char-chip .x:hover{color:#dc143c}.panel-text-toggle{position:absolute;top:6px;left:6px;z-index:5;width:30px;height:22px;border-radius:4px;font-size:10px;font-weight:800;line-height:1;border:2px solid var(--border);cursor:pointer;background:#ffffffe6;color:var(--ink);display:flex;align-items:center;justify-content:center;padding:0}.panel-text-toggle.on{background:var(--accent-strong);color:#fff}.panel-text-toggle:hover{background:var(--accent);color:#fff}
