#custom-theater-app .ctis-layer {
    position: absolute;
    z-index: 24;
    inset: 0;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    color: var(--ct-ink);
    background: rgba(242, 237, 231, .985);
    overflow: hidden;
}

#custom-theater-app .ctis-topbar {
    flex: 0 0 auto;
    min-height: 58px;
    padding: calc(var(--ct-safe-top) + 7px) max(14px, calc(var(--ct-safe-right) + 8px)) 7px max(14px, calc(var(--ct-safe-left) + 8px));
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 34px;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid rgba(49, 56, 68, .12);
    background: rgba(250, 247, 243, .96);
    text-align: center;
}

#custom-theater-app .ctis-topbar button {
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    color: inherit;
    background: transparent;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}

#custom-theater-app .ctis-topbar div { min-width: 0; display: grid; gap: 1px; }
#custom-theater-app .ctis-topbar span { color: var(--ct-ink-soft); font: 700 8px/1.2 "Courier New", monospace; letter-spacing: .15em; }
#custom-theater-app .ctis-topbar strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }

#custom-theater-app .ctis-scroll {
    flex: 1 1 0;
    height: 0;
    min-height: 0;
    box-sizing: border-box;
    padding: 14px max(15px, calc(var(--ct-safe-right) + 15px)) calc(26px + var(--ct-safe-bottom)) max(15px, calc(var(--ct-safe-left) + 15px));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    scrollbar-width: none;
}
#custom-theater-app .ctis-scroll::-webkit-scrollbar { display: none; }

#custom-theater-app .ctis-current { padding: 3px 2px 15px; display: grid; gap: 4px; }
#custom-theater-app .ctis-current > span { color: #9a6b68; font: 700 8px/1.2 "Courier New", monospace; letter-spacing: .14em; }
#custom-theater-app .ctis-current > strong { font-size: 18px; line-height: 1.3; }
#custom-theater-app .ctis-current > small { color: var(--ct-ink-soft); font-size: 10px; line-height: 1.55; }
#custom-theater-app .ctis-composition { margin: 0 0 13px; padding: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; border: 1px solid rgba(49,56,68,.14); border-radius: 15px; background: rgba(255,255,255,.52); }
#custom-theater-app .ctis-composition legend { padding: 0 5px; color: var(--ct-ink); font-size: 12px; font-weight: 800; }
#custom-theater-app .ctis-composition label { min-width: 0; cursor: pointer; }
#custom-theater-app .ctis-composition input { position: absolute; opacity: 0; pointer-events: none; }
#custom-theater-app .ctis-composition label > span { box-sizing: border-box; min-height: 56px; padding: 9px 10px; display: grid; align-content: center; gap: 3px; border: 1px solid rgba(49,56,68,.13); border-radius: 11px; background: rgba(250,247,243,.9); text-align: center; }
#custom-theater-app .ctis-composition label > span strong { font-size: 12px; }
#custom-theater-app .ctis-composition label > span small { color: var(--ct-ink-soft); font-size: 9px; line-height: 1.35; }
#custom-theater-app .ctis-composition input:checked + span { border-color: rgba(139,81,77,.55); color: #6c3e39; background: rgba(247,230,223,.95); box-shadow: inset 0 0 0 1px rgba(139,81,77,.15); }
#custom-theater-app .ctis-composition input:focus-visible + span { outline: 2px solid rgba(139,81,77,.72); outline-offset: 2px; }
#custom-theater-app .ctis-composition > p { grid-column: 1 / -1; margin: 0; color: var(--ct-ink-soft); font-size: 9px; line-height: 1.55; }
#custom-theater-app .ctis-list { border-top: 1px solid rgba(49, 56, 68, .12); }

#custom-theater-app .ctis-style-row {
    min-height: 72px;
    padding: 8px 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid rgba(49, 56, 68, .1);
}
#custom-theater-app .ctis-style-row.is-active { color: #7d403e; }
#custom-theater-app .ctis-style-row > label { min-width: 0; display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center; gap: 8px; cursor: pointer; }
#custom-theater-app .ctis-style-row input { width: 18px; height: 18px; accent-color: #8f514d; }
#custom-theater-app .ctis-style-row label span { min-width: 0; display: grid; gap: 4px; }
#custom-theater-app .ctis-style-row label strong { font-size: 12px; line-height: 1.3; }
#custom-theater-app .ctis-style-row label small { display: -webkit-box; overflow: hidden; color: var(--ct-ink-soft); font-size: 9px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#custom-theater-app .ctis-origin { color: var(--ct-ink-soft); font-size: 8px; letter-spacing: .08em; }
#custom-theater-app .ctis-row-actions { display: flex; gap: 4px; }
#custom-theater-app .ctis-row-actions button { min-width: 39px; min-height: 34px; padding: 5px 7px; border: 1px solid rgba(49, 56, 68, .14); border-radius: 9px; color: inherit; background: rgba(255, 255, 255, .58); font-size: 9px; cursor: pointer; }

#custom-theater-app .ctis-add {
    width: 100%;
    min-height: 46px;
    margin-top: 14px;
    padding: 9px 11px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px dashed rgba(49, 56, 68, .23);
    border-radius: 12px;
    color: inherit;
    background: rgba(255, 255, 255, .38);
    font-size: 11px;
    cursor: pointer;
}
#custom-theater-app .ctis-add small { color: var(--ct-ink-soft); font-size: 8px; }
#custom-theater-app .ctis-add:disabled { opacity: .5; cursor: default; }
#custom-theater-app .ctis-status { min-height: 34px; margin: 11px 1px 0; color: var(--ct-ink-soft); font-size: 9px; line-height: 1.55; }

#custom-theater-app .ctis-editor {
    position: absolute;
    z-index: 2;
    inset: 0;
    box-sizing: border-box;
    padding: calc(var(--ct-safe-top) + 58px) max(12px, calc(var(--ct-safe-right) + 12px)) calc(var(--ct-safe-bottom) + 14px) max(12px, calc(var(--ct-safe-left) + 12px));
    display: flex;
    align-items: flex-end;
    background: rgba(39, 35, 33, .42);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}
#custom-theater-app .ctis-editor[hidden] { display: none; }
#custom-theater-app .ctis-editor form { box-sizing: border-box; width: 100%; max-height: 100%; padding: 13px; display: grid; gap: 11px; border: 1px solid rgba(49, 56, 68, .14); border-radius: 17px; background: #fbf8f4; overflow-y: auto; }
#custom-theater-app .ctis-editor header { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
#custom-theater-app .ctis-editor header strong { font-size: 13px; }
#custom-theater-app .ctis-editor header button { width: 34px; height: 34px; border: 0; color: inherit; background: transparent; font-size: 22px; cursor: pointer; }
#custom-theater-app .ctis-editor label { display: grid; gap: 5px; color: var(--ct-ink-soft); font-size: 9px; }
#custom-theater-app .ctis-editor input,
#custom-theater-app .ctis-editor textarea { box-sizing: border-box; width: 100%; padding: 10px 11px; border: 1px solid rgba(49, 56, 68, .16); border-radius: 10px; color: var(--ct-ink); background: rgba(255, 255, 255, .72); font: inherit; font-size: 11px; line-height: 1.55; resize: vertical; }
#custom-theater-app .ctis-editor label small { justify-self: end; font-size: 8px; }
#custom-theater-app .ctis-save { min-height: 44px; border: 0; border-radius: 11px; color: #fff; background: #8b514d; font-weight: 700; cursor: pointer; }
#custom-theater-app .ctis-loading { margin: auto; padding: 24px; color: var(--ct-ink-soft); text-align: center; }
#custom-theater-app .ctis-loading.is-error { display: grid; gap: 9px; }
#custom-theater-app .ctis-loading p { margin: 0; font-size: 10px; line-height: 1.55; }
#custom-theater-app .ctis-loading button { min-height: 40px; border: 1px solid rgba(49, 56, 68, .15); border-radius: 10px; background: rgba(255, 255, 255, .65); }

#custom-theater-app .ctis-layer button:focus-visible,
#custom-theater-app .ctis-layer input:focus-visible,
#custom-theater-app .ctis-layer textarea:focus-visible,
#custom-theater-app .ctis-scroll:focus-visible { outline: 2px solid rgba(139, 81, 77, .72); outline-offset: 2px; }

@media (max-height: 560px) {
    #custom-theater-app .ctis-style-row { min-height: 62px; }
    #custom-theater-app .ctis-editor { align-items: flex-start; }
    #custom-theater-app .ctis-editor textarea { min-height: 120px; }
}