:root{color:#211f1a;background:#ece6da;font-family:Inter,Noto Sans JP,Yu Gothic,Hiragino Sans,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;min-height:100dvh;padding:14px 14px 0}.topbar{align-items:stretch;display:flex;gap:18px;justify-content:space-between;margin:0 auto 18px;position:relative;z-index:20}.topbar h1{font-size:30px;letter-spacing:0;line-height:1;margin:0 0 6px}.brand-area{align-content:center;display:grid;gap:7px;min-width:150px}.topbar-actions,.section-heading,.row-actions{align-items:center;display:flex;gap:8px}.topbar-actions{align-items:stretch;flex-wrap:wrap;justify-content:flex-end}.header-menu{position:relative}.header-button,.header-menu summary{align-items:center;background:#fffdfa;border:1px solid #c9beb0;border-radius:6px;color:#211f1a;display:inline-flex;gap:8px;min-height:38px;padding:0 12px;-webkit-user-select:none;user-select:none}.header-button:hover,.header-menu summary:hover{background:#f6efe3}.header-menu summary::-webkit-details-marker{display:none}.header-menu[open] summary{background:#f6efe3;border-color:#a99b8d}.header-menu[open] summary svg{transform:rotate(180deg)}.dropdown-panel{background:#fffdfa;border:1px solid #c9beb0;border-radius:8px;box-shadow:0 12px 24px #251e1424;display:grid;gap:8px;min-width:230px;padding:10px;position:absolute;right:0;top:calc(100% + 8px);z-index:50}.dropdown-panel .button{justify-content:flex-start;white-space:nowrap;width:100%}.modal-backdrop{align-items:center;background:#211f1a6b;display:flex;top:0;right:0;bottom:0;left:0;justify-content:center;padding:22px;position:fixed;z-index:30}.settings-modal{background:#fffdfa;border:1px solid #c9beb0;border-radius:8px;box-shadow:0 22px 48px #251e1438;display:grid;gap:16px;max-width:480px;padding:18px;width:min(100%,480px)}.modal-heading{align-items:center;display:flex;justify-content:space-between}.modal-heading h2{font-size:20px}.page-help-text{line-height:1.7;margin:0}.settings-field{display:grid;gap:7px}.settings-field span{color:#625c52;font-size:13px;font-weight:700}.settings-field input{background:#fffdfa;border:1px solid #c9beb0;border-radius:5px;color:#211f1a;min-height:38px;padding:8px 10px;width:100%}.settings-actions{display:flex;justify-content:flex-start;padding-top:4px}.confirm-text{line-height:1.7;margin:0}.confirm-actions{display:flex;gap:10px;justify-content:flex-end}.download-options{border:1px solid #c9beb0;border-radius:8px;display:grid;gap:10px;margin:0;padding:12px 14px 14px}.download-options legend{color:#625c52;font-size:13px;font-weight:700;padding:0 6px}.download-options label{align-items:center;display:flex;gap:8px}.download-options input{accent-color:#1f3e55;height:16px;width:16px}.download-submit{justify-content:center;width:100%}.download-submit:disabled{cursor:wait;opacity:.82}.download-spinner{animation:spin .8s linear infinite;border:2px solid rgba(255,253,250,.45);border-radius:50%;border-top-color:#fffdfa;height:16px;width:16px}@keyframes spin{to{transform:rotate(360deg)}}.segmented-control{display:inline-flex}.segmented-control button{align-items:center;background:#fffdfa;border:1px solid #c9beb0;color:#211f1a;display:inline-flex;gap:6px;min-height:36px;padding:0 11px}.segmented-control button:first-child{border-radius:6px 0 0 6px}.segmented-control button:last-child{border-left:0;border-radius:0 6px 6px 0}.segmented-control button.active{background:#1f3e55;border-color:#1f3e55;color:#fffdfa}.button,.icon-button,.row-actions button{align-items:center;background:#fffdfa;border:1px solid #c9beb0;border-radius:6px;color:#211f1a;display:inline-flex;gap:7px;min-height:36px;padding:0 12px}.icon-button,.row-actions button{justify-content:center;min-width:36px;padding:0}.button:hover,.icon-button:hover,.row-actions button:hover,.page-strip button:hover{background:#f6efe3}.button.primary{background:#1f3e55;border-color:#1f3e55;color:#fffdfa}.button.danger{background:#b7352d;border-color:#b7352d;color:#fffdfa}.button.danger:hover{background:#972a24;border-color:#972a24}.save-status{color:#5f6c52;font-size:13px;white-space:nowrap}.project-controls,.workspace,.page-list-bar{margin:0 auto 18px}.project-controls{align-items:end;display:grid;gap:16px;grid-template-columns:minmax(220px,1fr)}.project-controls label span{color:#625c52;display:block;font-size:13px;margin-bottom:6px}.project-controls input[type=text],.project-controls input:not([type]){width:100%}.project-controls fieldset{align-items:center;border:1px solid #c9beb0;border-radius:8px;display:flex;gap:12px;margin:0;min-height:58px;padding:10px 14px}.project-controls legend{color:#625c52;font-size:13px;padding:0 6px}.project-controls fieldset label{align-items:center;display:flex;gap:6px;white-space:nowrap}.workspace{display:grid;gap:18px;grid-template-columns:minmax(880px,1fr) minmax(360px,420px)}.editor-pane,.preview-pane{min-width:0}.page-list-bar{align-items:center;display:grid;gap:8px;grid-template-columns:minmax(0,1fr)}.page-list-header,.editor-toolbar,.preview-toolbar{align-items:center;display:flex;justify-content:space-between;min-height:34px}.page-list-header{width:100%}.collapsible-header{cursor:pointer}.page-list-title{align-items:center;display:inline-flex;gap:8px}.collapse-toggle{align-items:center;background:transparent;border:0;color:inherit;display:inline-flex;gap:7px;min-height:30px;padding:0}.collapse-toggle:hover h2{color:#526b60}.collapse-toggle:focus-visible{border-radius:4px;outline:2px solid rgba(109,143,141,.45);outline-offset:2px}.collapse-triangle{border-bottom:5px solid transparent;border-left:7px solid #625c52;border-top:5px solid transparent;display:inline-block;height:0;transform:rotate(90deg);transition:transform .16s ease;width:0}.collapse-toggle[aria-expanded=false] .collapse-triangle{transform:rotate(0)}.help-button{align-items:center;background:#fffdfa;border:1px solid #c9beb0;border-radius:50%;color:#625c52;display:inline-flex;font-size:13px;font-weight:800;height:24px;justify-content:center;line-height:1;padding:0;width:24px}.help-button:hover{background:#f6efe3;color:#211f1a}.page-list-bar.reading-rtl{justify-items:end}.page-list-bar.reading-rtl .page-strip{justify-content:flex-start;width:100%}.page-strip{display:flex;gap:22px;grid-column:1 / -1;justify-self:stretch;min-width:0;overflow-x:auto;padding:2px 0 8px;white-space:nowrap;width:100%}.page-strip.reading-rtl{flex-direction:row-reverse}.page-strip.reading-ltr{flex-direction:row}.page-spread{display:flex;flex:0 0 auto;gap:8px;padding-right:22px;position:relative}.page-spread:after{background:#c9beb0;bottom:8px;content:"";position:absolute;right:0;top:8px;width:1px}.page-spread.reading-rtl:first-child:after{display:none}.page-spread.reading-rtl:first-child{padding-right:0}.page-spread.reading-ltr:last-of-type:after{display:none}.page-spread.reading-ltr:last-of-type{padding-right:0}.page-spread.reading-rtl{flex-direction:row-reverse}.page-spread.reading-ltr{flex-direction:row}.page-thumb{background:#fffdfa;border:1px solid #c9beb0;border-radius:8px;color:#211f1a;display:grid;flex:0 0 auto;gap:8px;padding:10px;text-align:left;width:116px}.page-thumb{direction:ltr}.page-thumb.active{background:#dbe7e6;border-color:#6d8f8d;color:#24352d}.add-page-thumb{align-items:center;border-style:dashed;color:#526b60;justify-content:center;min-height:176px}.add-page-thumb:hover{background:#edf5f2;border-color:#6d8f8d;color:#24352d}.page-thumb.dragging{opacity:.55}.page-thumb.drag-over{border-color:#1f3e55;box-shadow:inset 0 0 0 2px #1f3e55}.thumb-heading{align-items:center;color:#625c52;display:flex;font-size:13px;font-weight:700;justify-content:space-between}.thumb-delete{align-items:center;border-radius:4px;color:#8e3028;display:inline-flex;justify-content:center;min-height:24px;min-width:24px}.thumb-delete:hover{background:#f7e7e2}.mini-page{aspect-ratio:5196 / 7322;border:1px solid #181611;display:flex;flex-direction:column;padding:4px;position:relative}.mini-side-mark,.page-side-mark{pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);z-index:3}.manga-page.side-mark-left .page-side-mark{left:5px}.manga-page.side-mark-right .page-side-mark{right:5px}.hidden-page-number{bottom:16px;color:#625c52;font-size:11px;font-weight:700;line-height:1;pointer-events:none;position:absolute;z-index:3}.manga-page.side-mark-left .hidden-page-number{left:17px;transform:translate(-50%)}.manga-page.side-mark-right .hidden-page-number{right:17px;transform:translate(50%)}.mini-page.side-mark-left .mini-side-mark{left:-2px}.mini-page.side-mark-right .mini-side-mark{right:-2px}.page-side-mark span{background:#181611;left:50%;position:absolute;top:50%;transform-origin:center}.mini-side-mark{color:#181611;font-size:8px;font-weight:700;line-height:1}.page-side-mark span:first-child{transform:rotate(45deg)}.page-side-mark span:last-child{transform:rotate(-45deg)}.mini-row-group{display:flex;flex-direction:column;min-height:0}.mini-row{display:grid;flex:1;gap:3px;grid-template-columns:repeat(6,1fr);min-height:0}.mini-row-gap{flex:0 0 3px}.mini-row span{border:1px solid #181611;container-type:size;position:relative}.mini-row span.frame-hidden{border-color:transparent}.mini-row .bleed-edge-top,.mini-stack .bleed-edge-top{border-top-color:transparent}.mini-row .bleed-edge-right,.mini-stack .bleed-edge-right{border-right-color:transparent}.mini-row .bleed-edge-bottom,.mini-stack .bleed-edge-bottom{border-bottom-color:transparent}.mini-row .bleed-edge-left,.mini-stack .bleed-edge-left{border-left-color:transparent}.mini-stack{border:0!important;display:flex;flex-direction:column;gap:3px;overflow:visible}.mini-stack i{border:1px solid #181611;container-type:size;flex:1 1 0;min-height:0;position:relative}.mini-stack i.frame-hidden{border-color:transparent}.mini-face-size-marker{background:#1f3e5524;border:1px solid #1f3e55;border-radius:50%;height:min(calc(var(--face-marker-size) * 1cqw),calc(var(--face-marker-size) * 1cqh));left:50%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);width:min(calc(var(--face-marker-size) * 1cqw),calc(var(--face-marker-size) * 1cqh));z-index:1}.section-heading{justify-content:space-between;margin-bottom:10px;flex-wrap:wrap}h2{font-size:18px;letter-spacing:0;margin:0}.storyboard-table-wrap{background:#fffdfa;border:1px solid #c9beb0;border-radius:8px;overflow-x:hidden;overflow-y:auto}.project-note-field{display:grid;gap:8px;margin-top:12px}.project-note-header{align-items:center;display:flex;justify-content:space-between;min-height:34px}.project-note-field textarea{background:#fffdfa;border:1px solid #c9beb0;border-radius:6px;color:#211f1a;line-height:1.6;min-height:120px;padding:10px 12px;resize:vertical;width:100%}.project-note-field textarea:focus{border-color:#6d8f8d;outline:2px solid rgba(109,143,141,.25);outline-offset:1px}.editor-toolbar,.preview-toolbar{margin-bottom:8px}.preview-clear-button{min-height:34px}.storyboard-table{border-collapse:collapse;min-width:100%;table-layout:fixed;width:100%}.storyboard-table th:nth-child(2),.storyboard-table th:nth-child(3),.storyboard-table th:nth-child(4),.storyboard-table th:nth-child(5),.storyboard-table th:nth-child(6),.storyboard-table th:nth-child(7){width:96px}.storyboard-table th:nth-child(1){width:52px}.storyboard-table th:nth-child(9){width:96px}.storyboard-table th{background:#e4dacb;color:#403b34;font-size:13px;position:sticky;text-align:left;top:0;z-index:1}.column-heading{align-items:center;display:inline-flex;gap:5px;min-width:0}.column-warning{align-items:center;background:#fff4bf;border:1px solid #a86516;border-radius:50%;color:#8a3d0a;cursor:help;display:inline-flex;flex:0 0 auto;font-size:10px;font-weight:800;height:16px;justify-content:center;line-height:1;width:16px}.column-warning-tooltip{background:#181611;border-radius:5px;color:#fffdfa;font-size:12px;font-weight:700;line-height:1.35;max-width:220px;padding:7px 9px;pointer-events:none;position:fixed;transform:translate(-50%,-100%);white-space:pre;z-index:1000}.column-warning-tooltip:after{border:5px solid transparent;border-top-color:#181611;content:"";left:50%;position:absolute;top:100%;transform:translate(-50%)}.storyboard-table th,.storyboard-table td{border-bottom:1px solid #ded4c4;padding:8px;vertical-align:top}.storyboard-table tr.is-active td{background:#fbf7ed;vertical-align:middle}.storyboard-table tr.selected-row td{background:#dbe7e6;box-shadow:inset 0 0 0 1px #6d8f8d}.panel-index-cell{color:#403b34;font-weight:800;text-align:center}.storyboard-table tbody tr{cursor:grab}.storyboard-table tbody tr:active{cursor:grabbing}.storyboard-table tr.dragging-row td{opacity:.55}.storyboard-table tr.drag-over-row td{box-shadow:inset 0 2px #1f3e55}.storyboard-table .add-panel-row td{background:#fffdfa;padding:10px}.add-panel-row button{align-items:center;background:#f9f6ef;border:1px dashed #b7aa9a;border-radius:6px;color:#526b60;display:flex;justify-content:center;min-height:42px;width:100%}.add-panel-row button:hover{background:#edf5f2;border-color:#6d8f8d;color:#24352d}.icon-button.danger{color:#8e3028}.icon-button.danger:hover{background:#f7e7e2;border-color:#c87969}.storyboard-table input,.storyboard-table select,.storyboard-table textarea,.project-controls input{background:#fffdfa;border:1px solid #c9beb0;border-radius:5px;color:#211f1a;min-height:34px;padding:7px 8px;width:100%}.storyboard-table textarea{min-height:34px;resize:vertical}.storyboard-table input[type=number]{width:74px}.storyboard-table select{min-width:0}.role-dropdown{position:relative}.role-dropdown input{padding-right:30px}.role-dropdown-button{align-items:center;background:transparent;border:0;color:#5c5146;display:inline-flex;height:100%;justify-content:center;min-height:34px;padding:0;position:absolute;right:1px;top:0;width:28px}.role-dropdown-button:hover{color:#211f1a}.role-dropdown-menu{background:#fffdfa;border:1px solid #c9beb0;border-radius:5px;box-shadow:0 8px 18px #2a241b2e;display:grid;gap:3px;left:0;padding:4px;position:absolute;top:calc(100% + 3px);width:100%;z-index:20}.role-dropdown-option{border:1px solid transparent;border-radius:4px;min-height:28px;padding:4px 7px;text-align:left}.role-dropdown-option:hover,.role-dropdown-option[aria-selected=true]{border-color:#6d8f8d}.storyboard-table .excel-tone-green,.storyboard-table option.excel-tone-green{background-color:#c6efce;border-color:#8cc89a;color:#006100}.storyboard-table .excel-tone-yellow,.storyboard-table option.excel-tone-yellow{background-color:#ffeb9c;border-color:#d9b85f;color:#9c5700}.storyboard-table .excel-tone-red,.storyboard-table option.excel-tone-red{background-color:#ffc7ce;border-color:#d58c94;color:#9c0006}.storyboard-table select.excel-tone-green:focus,.storyboard-table input.excel-tone-green:focus{outline:2px solid rgba(0,97,0,.22)}.storyboard-table select.excel-tone-yellow:focus,.storyboard-table input.excel-tone-yellow:focus{outline:2px solid rgba(156,87,0,.24)}.storyboard-table select.excel-tone-red:focus,.storyboard-table input.excel-tone-red:focus{outline:2px solid rgba(156,0,6,.22)}.cell-control{display:grid;gap:3px}.cell-control span,.warning{color:#a33d2d;font-size:12px}.invalid{border-color:#b24b3d!important}.row-actions{gap:4px;justify-content:flex-end;min-width:76px}.preview-pane{min-width:0}.page-stage{align-items:center;display:flex;justify-content:center;overflow:auto}.manga-page{aspect-ratio:5196 / 7322;background:#fffdfa;border:1px solid #181611;box-shadow:0 14px 26px #251e1424;display:flex;flex-direction:column;gap:0;max-height:72vh;padding:40px;position:relative;width:min(100%,520px)}.page-side-mark{height:30px;width:30px}.page-side-mark span{height:2px;margin-left:-13px;width:26px}.export-pages{height:1px;left:-10000px;overflow:hidden;position:absolute;top:0;width:520px}.export-pages .manga-page{height:auto;margin-bottom:24px;max-height:none;width:520px}.layout-row{display:grid;flex:1 1 0;gap:7px;grid-template-columns:repeat(6,1fr);min-height:0;overflow:visible}.layout-row-group{display:contents}.row-resizer{background:transparent;border:0;cursor:row-resize;flex:0 0 20px;min-height:20px;padding:0;position:relative;touch-action:none;width:100%}.row-resizer:before{background:transparent;content:"";height:3px;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%)}.row-resizer:hover:before,.row-resizer:focus-visible:before{background:#c93b31}.row-resizer-static{cursor:default;pointer-events:none}.column-resizer{align-self:stretch;background:transparent;border:0;cursor:col-resize;justify-self:start;margin-left:-10px;padding:0;position:relative;touch-action:none;width:20px;z-index:2}.column-resizer:before{background:transparent;bottom:0;content:"";left:50%;position:absolute;top:0;transform:translate(-50%);width:3px}.column-resizer:hover:before,.column-resizer:focus-visible:before{background:#1f62e8}.panel-frame{background:#fffdfa;border:2px solid #181611;container-type:size;cursor:pointer;display:flex;flex-direction:column;gap:6px;min-height:0;overflow:hidden;padding:9px;position:relative}.panel-frame.selected-panel{background:#edf5f2;border-color:#1f3e55;box-shadow:inset 0 0 0 2px #1f3e55;overflow:visible;z-index:4!important}.panel-frame.selected-panel[class*=bleed-edge-]{box-shadow:none}.panel-frame.bleed-edge-top{border-top-color:transparent}.panel-frame.bleed-edge-right{border-right-color:transparent}.panel-frame.bleed-edge-bottom{border-bottom-color:transparent}.panel-frame.bleed-edge-left{border-left-color:transparent}.panel-frame.frame-hidden{border-color:transparent}.panel-frame.frame-hidden.selected-panel{border-color:transparent;box-shadow:none}.panel-stack{display:flex;flex-direction:column;gap:20px;min-height:0;overflow:visible}.panel-stack .panel-frame{flex:1 1 0}.panel-frame.vertical{justify-content:space-between}.panel-frame.horizontal{justify-content:center}.face-size-marker{background:#1f3e551f;border:2px solid #1f3e55;border-radius:50%;box-shadow:0 1px 2px #1816111f;left:50%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);height:min(calc(var(--face-marker-size) * 1cqw),calc(var(--face-marker-size) * 1cqh));width:min(calc(var(--face-marker-size) * 1cqw),calc(var(--face-marker-size) * 1cqh));z-index:1}.face-size-extrasmall{--face-marker-size: 20}.face-size-small{--face-marker-size: 40}.face-size-medium{--face-marker-size: 60}.face-size-large{--face-marker-size: 80}.face-size-extralarge{--face-marker-size: 120}.panel-fields{align-items:baseline;color:#625c52;display:grid;font-size:clamp(12px,5cqw,14px);gap:2px 6px;grid-template-columns:auto repeat(2,minmax(0,max-content));line-height:1.25}.panel-fields span{font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panel-field-number{color:#211f1a;font-size:clamp(11px,5cqw,15px);font-weight:800}.panel-frame p{font-size:clamp(12px,5cqw,14px);line-height:1.45;margin:auto 0 0;overflow-wrap:anywhere}.bleed-controls{top:0;right:0;bottom:0;left:0;pointer-events:none;position:absolute;z-index:5}.bleed-button{align-items:center;background:#fffdfa;border:1px solid #9a8b7b;border-radius:999px;color:#211f1a;display:inline-flex;height:24px;justify-content:center;padding:0;pointer-events:auto;position:absolute;width:24px}.bleed-button:hover,.bleed-button.active{background:#f2d33b;border-color:#9c7d00}.bleed-button:disabled{background:#f1ebe1;border-color:#d4c8b8;color:#aaa095;cursor:not-allowed}.bleed-top{left:50%;top:4px;transform:translate(-50%)}.bleed-right{right:4px;top:50%;transform:translateY(-50%)}.bleed-bottom{bottom:4px;left:50%;transform:translate(-50%)}.bleed-left{left:4px;top:50%;transform:translateY(-50%)}@media(max-width:1120px){.topbar,.project-controls,.workspace{align-items:stretch;grid-template-columns:1fr}.topbar{flex-direction:column}.topbar-actions{justify-content:flex-start}.header-menu{position:relative}.dropdown-panel{left:0;margin-top:0;max-width:calc(100vw - 28px);position:absolute;right:auto}.manga-page{max-height:none;width:min(100%,440px)}}@media(max-width:1499px){.workspace{grid-template-columns:1fr}.manga-page{max-height:none}}@media(max-width:640px),(max-width:1120px)and (orientation:portrait){.project-controls fieldset{align-items:flex-start;flex-direction:column}.storyboard-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.storyboard-table{min-width:calc(628px + 100vw)}.storyboard-table th:nth-child(8),.storyboard-table td:nth-child(8){width:calc(100vw - 28px)}.button{flex:1 1 auto;justify-content:center}.preview-clear-button{flex:0 0 auto;margin-left:auto}}