.hmp-app {
--hmp-bg: #0b1018;
--hmp-sidebar: #0f1622;
--hmp-panel: #141d2b;
--hmp-panel-2: #182334;
--hmp-text: #edf3fb;
--hmp-muted: #91a0b5;
--hmp-line: #28364a;
--hmp-accent: #68d5b5;
--hmp-accent-strong: #28b991;
--hmp-warning: #f2c66d;
--hmp-danger: #ff7979;
--hmp-radius: 13px;
--hmp-shadow: 0 22px 60px rgba(0, 0, 0, .34);
position: relative;
width: 100%;
max-width: 100%;
color: var(--hmp-text);
background: var(--hmp-bg);
border: 1px solid var(--hmp-line);
border-radius: var(--hmp-radius);
box-shadow: var(--hmp-shadow);
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
font-size: 14px;
line-height: 1.5;
isolation: isolate;
}
.hmp-app *, .hmp-app *::before, .hmp-app *::after { box-sizing: border-box; }
.hmp-app button, .hmp-app input, .hmp-app textarea { font: inherit; }
.hmp-app button { cursor: pointer; }
.hmp-app [hidden] { display: none !important; }
.hmp-app a { color: #83ddc3; text-decoration: underline; text-underline-offset: 2px; }
.hmp-app a:hover { color: #b2f4df; }
.hmp-app__chrome { min-width: 0; overflow: visible; border-radius: inherit; }
.hmp-toolbar {
position: relative;
z-index: 8;
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
min-height: 82px;
padding: 14px 16px 14px 20px;
background: linear-gradient(135deg, #111a28, #0f1724);
border-bottom: 1px solid var(--hmp-line);
border-radius: var(--hmp-radius) var(--hmp-radius) 0 0;
}
.hmp-title h2, .hmp-dialog h3 { margin: 0 !important; color: var(--hmp-text) !important; font-weight: 700; letter-spacing: -.02em; }
.hmp-title h2 { font-size: clamp(20px, 2.2vw, 28px) !important; line-height: 1.1 !important; }
.hmp-kicker { display: block; margin-bottom: 4px; color: var(--hmp-accent); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.hmp-toolbar__actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.hmp-live-state { display: inline-flex; align-items: center; gap: 7px; margin-right: 4px; color: #b9c7d9; font-size: 12px; white-space: nowrap; }
.hmp-live-state i { width: 8px; height: 8px; background: var(--hmp-accent); border-radius: 50%; box-shadow: 0 0 0 4px rgba(104, 213, 181, .11); }
.hmp-live-state.is-offline i { background: var(--hmp-danger); box-shadow: 0 0 0 4px rgba(255, 121, 121, .11); }
.hmp-icon-button, .hmp-filter summary {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 7px;
min-height: 38px;
padding: 7px 11px;
color: #dce7f5;
background: #172234;
border: 1px solid #2c3b50;
border-radius: 9px;
font-weight: 650;
line-height: 1;
list-style: none;
text-decoration: none;
transition: border-color .15s, background .15s, transform .15s;
}
.hmp-icon-button:hover, .hmp-filter summary:hover { background: #1d2a3e; border-color: #496078; }
.hmp-icon-button:active { transform: translateY(1px); }
.hmp-icon-button svg, .hmp-filter svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.hmp-filter { position: relative; margin: 0; }
.hmp-filter summary { cursor: pointer; }
.hmp-filter summary::-webkit-details-marker { display: none; }
.hmp-filter summary b { min-width: 30px; padding: 3px 6px; color: #b9f1df; background: rgba(104, 213, 181, .12); border-radius: 99px; font-size: 10px; text-align: center; }
.hmp-filter__popover { position: absolute; top: calc(100% + 8px); right: 0; width: min(370px, calc(100vw - 30px)); padding: 14px; background: #121b29; border: 1px solid #33445a; border-radius: 12px; box-shadow: var(--hmp-shadow); }
.hmp-filter__section + .hmp-filter__section { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--hmp-line); }
.hmp-filter__head { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding-bottom: 10px; border-bottom: 1px solid var(--hmp-line); }
.hmp-filter__head div { display: flex; gap: 6px; align-items: center; color: #58677c; }
.hmp-filter__head button { padding: 0; color: #9bdcca; background: transparent; border: 0; font-size: 12px; }
.hmp-filter__items { display: grid; gap: 4px; max-height: 25vh; padding-top: 9px; overflow: auto; }
.hmp-filter__items label { display: flex; align-items: center; gap: 10px; margin: 0; padding: 8px 7px; border-radius: 7px; cursor: pointer; }
.hmp-filter__items label:hover { background: #192638; }
.hmp-filter__items input { width: 17px; height: 17px; margin: 0; accent-color: var(--hmp-accent-strong); }
.hmp-table-scroll { min-height: 260px; max-height: min(72vh, 880px); overflow: auto; scrollbar-color: #35475e #0c121c; }
.hmp-loading, .hmp-error, .hmp-empty-state { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 260px; padding: 30px; color: var(--hmp-muted); text-align: center; }
.hmp-loading span { width: 18px; height: 18px; border: 2px solid #314259; border-top-color: var(--hmp-accent); border-radius: 50%; animation: hmp-spin .8s linear infinite; }
.hmp-error { color: #ffaaaa; }
@keyframes hmp-spin { to { transform: rotate(360deg); } }
.hmp-planner-table { width: 100%; min-width: max-content; margin: 0 !important; border: 0 !important; border-collapse: separate !important; border-spacing: 0 !important; color: var(--hmp-text); background: var(--hmp-bg); table-layout: fixed; }
.hmp-planner-table th, .hmp-planner-table td { width: 290px; min-width: 290px; padding: 0 !important; vertical-align: top !important; background: #101824; border: 0 !important; border-right: 1px solid var(--hmp-line) !important; border-bottom: 1px solid var(--hmp-line) !important; text-align: left; }
.hmp-planner-table thead th { position: sticky; top: 0; z-index: 4; height: 48px; padding: 13px 14px !important; color: #aab8ca; background: #121c2b; font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.hmp-planner-table .hmp-scene-column { position: sticky; left: 0; z-index: 3; width: 180px; min-width: 180px; max-width: 180px; padding: 15px 14px !important; color: #edf3fb; background: #0e1622; font-size: 13px; font-weight: 750; }
.hmp-planner-table thead .hmp-scene-column { z-index: 6; color: var(--hmp-accent); background: #101a28; }
.hmp-planner-table tbody tr:hover td { background: #121c2a; }
.hmp-planner-table tbody tr:hover .hmp-scene-column { background: #111c2a; }
.hmp-planner-table tbody tr.hmp-is-row-hover td { background: #121c2a; }
.hmp-planner-table tbody tr.hmp-is-row-hover .hmp-scene-column { background: #111c2a; }
.hmp-planner-table .hmp-is-column-hover { background: #121c2a !important; }
.hmp-planner-table thead .hmp-is-column-hover { background: #172438 !important; }
.hmp-planner-table tbody tr.hmp-is-row-hover td.hmp-is-column-hover { background: #162235 !important; }
.hmp-planner-table .hmp-is-hidden { display: none !important; }
.hmp-table-print-header { display: none !important; }
.hmp-scene-name { display: block; overflow-wrap: anywhere; }
.hmp-drop-hint { display: block; margin-top: 7px; color: #66788f; font-size: 9px; font-weight: 600; line-height: 1.3; text-transform: none; }
.hmp-planner-table .hmp-is-drop-target { background: #173026 !important; box-shadow: inset 0 0 0 2px var(--hmp-accent); }
.hmp-scene-attachments-row td { width: auto !important; min-width: 0 !important; padding: 10px 13px !important; background: #0d151f !important; }
.hmp-cell { position: relative; display: flex; flex-direction: column; min-height: 150px; height: 100%; padding: 12px 13px 11px; }
.hmp-cell__controls { position: absolute; z-index: 2; top: 8px; right: 8px; left: 8px; display: flex; align-items: flex-start; justify-content: flex-end; gap: 5px; pointer-events: none; }
.hmp-cell__badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; min-width: 0; pointer-events: auto; }
.hmp-cell-badge { display: inline-block; max-width: 130px; padding: 3px 6px; overflow: hidden; color: #e8d39e; background: rgba(242, 198, 109, .09); border: 1px solid rgba(242, 198, 109, .2); border-radius: 5px; font-size: 9px; font-weight: 750; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; text-transform: uppercase; }
.hmp-cell-badge--lock { color: #ffc0c0; background: rgba(255, 121, 121, .08); border-color: rgba(255, 121, 121, .2); }
.hmp-edit-button { display: inline-grid; flex: 0 0 auto; place-items: center; width: 27px; height: 27px; margin: -3px -3px 0 0; padding: 0; color: #9fb1c7; background: #101824; border: 1px solid transparent; border-radius: 7px; opacity: .82; pointer-events: auto; }
.hmp-edit-button:hover { color: var(--hmp-accent); background: rgba(104, 213, 181, .08); border-color: rgba(104, 213, 181, .2); opacity: 1; }
.hmp-edit-button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.hmp-cell__body { min-height: 77px; color: #d8e2ef; overflow-wrap: anywhere; }
.hmp-cell__attachments { margin-top: auto; padding-top: 11px; }
.hmp-placeholder { color: #66758a; font-style: italic; }
.hmp-prose-line + .hmp-prose-line { margin-top: 3px; }
.hmp-cell__meta { min-height: 17px; margin-top: 10px; color: #65748a; font-size: 9px; line-height: 1.3; }
.hmp-attachments { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap: 9px; width: 100%; }
.hmp-attachments--cell { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.hmp-attachments--cell .hmp-attachment:only-child { grid-column: 1 / -1; }
.hmp-attachment { position: relative; min-width: 0; overflow: hidden; background: #0a111a; border: 1px solid #2a3b50; border-radius: 9px; }
.hmp-attachment__preview { display: flex; width: 100%; min-width: 0; min-height: 44px; margin: 0; padding: 0; align-items: center; justify-content: center; color: #cbd8e8; background: transparent; border: 0; border-radius: inherit; text-align: left; }
.hmp-attachment__preview:hover { color: var(--hmp-accent); background: #111e2c; }
.hmp-attachment--image img { display: block; width: 100%; height: 150px; object-fit: cover; }
.hmp-attachments--scene .hmp-attachment--image img { height: min(42vh, 440px); object-fit: contain; }
.hmp-attachment--pdf .hmp-attachment__preview { justify-content: flex-start; gap: 8px; padding: 9px 34px 9px 10px; }
.hmp-attachment--pdf svg { flex: 0 0 auto; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; }
.hmp-attachment--pdf span { min-width: 0; overflow: hidden; font-size: 11px; font-weight: 700; overflow-wrap: anywhere; }
.hmp-attachment__delete { position: absolute; z-index: 3; top: 5px; right: 5px; display: grid; place-items: center; width: 24px; height: 24px; margin: 0; padding: 0 0 2px; color: #fff; background: rgba(153, 45, 57, .94); border: 1px solid rgba(255, 255, 255, .5); border-radius: 50%; box-shadow: 0 2px 9px rgba(0, 0, 0, .5); font-size: 18px; font-weight: 800; line-height: 1; }
.hmp-attachment__delete:hover { background: #d94f5e; transform: scale(1.06); }
.hmp-checklist { display: grid; gap: 6px; margin: 2px 0 10px !important; padding: 0 !important; list-style: none !important; }
.hmp-checklist:last-child { margin-bottom: 0 !important; }
.hmp-checklist li { display: flex; align-items: flex-start; gap: 8px; margin: 0 !important; padding: 0 !important; }
.hmp-checklist input { flex: 0 0 auto; width: 16px; height: 16px; margin: 2px 0 0; accent-color: var(--hmp-accent-strong); }
.hmp-checklist input:disabled { opacity: .55; }
.hmp-checklist li.is-checked span { color: #718096; text-decoration: line-through; text-decoration-color: #526277; }
.hmp-bullet-list { display: grid; gap: 3px; margin: 2px 0 10px !important; padding: 0 !important; list-style: none !important; }
.hmp-bullet-list:last-child { margin-bottom: 0 !important; }
.hmp-bullet-list li { display: grid; grid-template-columns: .7em minmax(0, 1fr); gap: 2px; margin: 0 !important; padding: 0 !important; }
.hmp-bullet-list li::before { content: "•"; }
.hmp-mention { display: inline-block; width: max-content; min-width: max-content; max-width: none; margin: 0; padding: 0 2px; color: #071a14; background: var(--hmp-accent); border: 0; border-radius: 3px; font: inherit; font-weight: 800; line-height: inherit; overflow-wrap: normal !important; text-decoration: none; white-space: nowrap !important; word-break: keep-all !important; }
.hmp-mention:hover { color: #06130f; background: #9cebd4; }
.hmp-mark { color: inherit; }
.hmp-mark--1 { color: var(--hmp-mark-1-color, #f2c66d); font-weight: var(--hmp-mark-1-weight, 700); font-style: var(--hmp-mark-1-style, normal); text-decoration: var(--hmp-mark-1-decoration, none); }
.hmp-mark--2 { color: var(--hmp-mark-2-color, #77bdfb); font-weight: var(--hmp-mark-2-weight, 700); font-style: var(--hmp-mark-2-style, normal); text-decoration: var(--hmp-mark-2-decoration, none); }
.hmp-mark--3 { color: var(--hmp-mark-3-color, #ff7979); font-weight: var(--hmp-mark-3-weight, 700); font-style: var(--hmp-mark-3-style, normal); text-decoration: var(--hmp-mark-3-decoration, underline); }
.hmp-app__footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; min-height: 38px; padding: 8px 14px; color: #718096; background: #0d141f; border-radius: 0 0 var(--hmp-radius) var(--hmp-radius); font-size: 10px; }
.hmp-app code { padding: 2px 5px; color: #a4ead5; background: #182638; border: 1px solid #263a50; border-radius: 4px; }
.hmp-overlay { position: fixed; z-index: 2147483646; inset: 0; display: grid; place-items: center; padding: 16px; background: rgba(3, 7, 12, .8); backdrop-filter: blur(6px); }
.hmp-dialog { width: min(94vw, 540px); max-height: calc(100vh - 32px); padding: 20px; overflow: auto; color: var(--hmp-text); background: #121b29; border: 1px solid #34465d; border-radius: 15px; box-shadow: 0 30px 90px rgba(0, 0, 0, .6); }
.hmp-editor-dialog { width: min(94vw, 840px); }
.hmp-dialog > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 15px; }
.hmp-dialog h3 { font-size: 22px !important; line-height: 1.25 !important; }
.hmp-dialog p { color: #aab7c8; }
.hmp-close { width: 34px; height: 34px; padding: 0; color: #95a5b9; background: transparent; border: 1px solid #33445a; border-radius: 8px; font-size: 23px; line-height: 1; }
.hmp-close:hover { color: white; background: #1d2a3d; }
.hmp-editor-dialog textarea { display: block; width: 100%; min-height: min(54vh, 480px); padding: 14px; resize: vertical; color: #e8f0fa; caret-color: var(--hmp-accent); background: #090f17; border: 1px solid #34475f; border-radius: 10px; outline: 0; line-height: 1.55; }
.hmp-editor-dialog textarea:focus { border-color: var(--hmp-accent-strong); box-shadow: 0 0 0 3px rgba(40, 185, 145, .12); }
.hmp-editor-help { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 40px; color: #7e8ea3; font-size: 11px; }
.hmp-draft-notice { margin-bottom: 12px; padding: 9px 11px; color: #ebd9a7; background: rgba(242, 198, 109, .09); border: 1px solid rgba(242, 198, 109, .22); border-radius: 8px; font-size: 12px; }
.hmp-dialog footer { display: flex; justify-content: flex-end; gap: 9px; margin-top: 14px; }
.hmp-primary-button, .hmp-secondary-button, .hmp-danger-button { min-height: 40px; padding: 8px 14px; border-radius: 9px; font-weight: 750; }
.hmp-primary-button { color: #06130f; background: var(--hmp-accent); border: 1px solid var(--hmp-accent); }
.hmp-primary-button:hover { background: #85e7cb; }
.hmp-primary-button:disabled { cursor: wait; opacity: .6; }
.hmp-primary-button svg { width: 16px; height: 16px; margin-right: 5px; fill: none; stroke: currentColor; stroke-width: 1.8; vertical-align: -3px; }
.hmp-secondary-button { color: #dbe6f3; background: #1a2637; border: 1px solid #35475e; }
.hmp-danger-button { color: #fff; background: #9c3d48; border: 1px solid #bb5360; }
.hmp-name-dialog label { display: grid; gap: 6px; margin-top: 18px; }
.hmp-name-dialog label span { color: #c7d3e2; font-size: 12px; font-weight: 700; }
.hmp-name-dialog input { width: 100%; min-height: 44px; padding: 8px 11px; color: #fff; background: #0b121c; border: 1px solid #34475f; border-radius: 9px; outline: 0; }
.hmp-name-dialog input:focus { border-color: var(--hmp-accent); }
.hmp-name-error { margin: 14px 0 0 !important; padding: 10px 11px; color: #ffd1d1 !important; background: rgba(255, 121, 121, .1); border: 1px solid rgba(255, 121, 121, .28); border-radius: 8px; font-weight: 650; }
.hmp-todo-dialog { width: min(94vw, 760px); }
.hmp-todo-options { display: flex; align-items: center; min-height: 32px; margin: -5px 0 8px; padding-bottom: 8px; border-bottom: 1px solid var(--hmp-line); }
.hmp-todo-options label { display: inline-flex; align-items: center; gap: 7px; margin: 0; color: #b8c6d8; cursor: pointer; font-size: 11px; font-weight: 700; }
.hmp-todo-options input { width: 15px; height: 15px; margin: 0; accent-color: var(--hmp-accent-strong); }
.hmp-todo-list { display: grid; gap: 7px; max-height: min(58vh, 620px); padding-right: 3px; overflow: auto; scrollbar-color: #40536c #0c121c; }
.hmp-todo-group { margin: 0; padding: 9px 10px; background: #0c141f; border: 1px solid #2a3a4e; border-radius: 8px; }
.hmp-todo-group > strong { display: block; margin-bottom: 6px; color: #edf3fb; font-size: 12px; line-height: 1.3; }
.hmp-todo-group__items { display: grid; gap: 4px; }
.hmp-todo-item__content { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 7px; margin: 0; color: #cbd7e6; line-height: 1.35; }
.hmp-todo-item__content--text { display: block; }
.hmp-todo-item__content input { flex: 0 0 auto; width: 15px; height: 15px; margin: 2px 0 0; accent-color: var(--hmp-accent-strong); }
.hmp-todo-item__content--checklist { cursor: pointer; }
.hmp-todo-item__content--checklist.is-checked > span:last-child { color: #718096; text-decoration: line-through; }
.hmp-todo-marker { color: var(--hmp-accent); font-weight: 800; }
.hmp-todo-empty { margin: 0; padding: 24px; text-align: center; background: #0c141f; border: 1px dashed #34465d; border-radius: 9px; }
.hmp-overlay[data-hmp-name-dialog] { z-index: 2147483647; }
.hmp-attachment-overlay { padding: 5px; }
.hmp-attachment-dialog { display: flex; flex-direction: column; width: calc(100vw - 10px); height: calc(100vh - 10px); max-height: none; padding: 10px; overflow: hidden; border-radius: 8px; }
.hmp-attachment-dialog > header { flex: 0 0 auto; min-height: 42px; margin: 0 0 8px; }
.hmp-attachment-dialog > header h3 { align-self: center; min-width: 0; overflow: hidden; font-size: 15px !important; text-overflow: ellipsis; white-space: nowrap; }
.hmp-attachment-preview { display: grid; flex: 1 1 auto; min-height: 0; place-items: center; overflow: hidden; background: #080d14; border-radius: 6px; }
.hmp-attachment-preview img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
.hmp-attachment-preview iframe { width: 100%; height: 100%; background: #fff; border: 0; }
.hmp-print-header, .hmp-todo-print-sheet { display: none; }
.hmp-toast { position: fixed; z-index: 2147483647; right: 18px; bottom: 18px; max-width: min(420px, calc(100vw - 36px)); padding: 11px 14px; color: #092019; background: var(--hmp-accent); border-radius: 9px; box-shadow: var(--hmp-shadow); font-weight: 700; }
.hmp-toast.is-error { color: white; background: #a7434e; }
html.hmp-no-scroll { overflow: hidden !important; }
.hmp-app.hmp-has-overlay { z-index: 2147483000; }
.hmp-app.is-expanded { position: fixed; z-index: 2147483000; inset: 5px; width: auto; height: auto; max-width: none; border-radius: 9px; }
.hmp-app.is-expanded .hmp-app__chrome { display: flex; flex-direction: column; height: 100%; }
.hmp-app.is-expanded .hmp-table-scroll { flex: 1 1 auto; max-height: none; }
.hmp-app.is-expanded .hmp-toolbar { border-radius: 8px 8px 0 0; }
.hmp-app.is-expanded .hmp-app__footer { border-radius: 0 0 8px 8px; }
@media (max-width: 760px) {
.hmp-toolbar { align-items: flex-start; flex-direction: column; gap: 12px; padding: 15px; }
.hmp-toolbar__actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
.hmp-live-state { margin-right: auto; }
.hmp-icon-button span { display: none; }
.hmp-icon-button { width: 38px; padding: 7px; }
.hmp-planner-table th, .hmp-planner-table td { width: 250px; min-width: 250px; }
.hmp-planner-table .hmp-scene-column { width: 135px; min-width: 135px; max-width: 135px; }
.hmp-app__footer { align-items: flex-start; flex-direction: column; gap: 2px; }
.hmp-editor-dialog { padding: 14px; }
.hmp-editor-dialog textarea { min-height: 48vh; }
.hmp-editor-help { align-items: flex-start; flex-direction: column; gap: 4px; padding: 7px 0; }
}
@media print {
body.hmp-printing * { visibility: hidden !important; }
body.hmp-printing .hmp-print-target, body.hmp-printing .hmp-print-target * { visibility: visible !important; }
body.hmp-printing .hmp-print-target { position: absolute !important; inset: 0 auto auto 0 !important; width: 100% !important; height: auto !important; max-width: none !important; color: #000 !important; background: #fff !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
body.hmp-printing .hmp-print-target, body.hmp-printing .hmp-print-target * { color: #000 !important; background-color: #fff !important; background-image: none !important; box-shadow: none !important; text-shadow: none !important; }
.hmp-print-target img, .hmp-print-target picture, .hmp-print-target video, .hmp-print-target canvas { display: none !important; }
.hmp-print-target .hmp-print-header { display: none !important; }
.hmp-print-target .hmp-toolbar, .hmp-print-target .hmp-app__footer, .hmp-print-target .hmp-cell__controls, .hmp-print-target .hmp-cell__meta, .hmp-print-target .hmp-overlay, .hmp-print-target .hmp-toast { display: none !important; }
.hmp-print-target .hmp-app__chrome { display: block !important; height: auto !important; overflow: visible !important; border-radius: 0 !important; }
.hmp-print-target .hmp-table-scroll { display: block !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; }
.hmp-print-target .hmp-planner-table { width: 100% !important; min-width: 0 !important; color: #000 !important; background: #fff !important; border-collapse: collapse !important; table-layout: fixed !important; }
.hmp-print-target .hmp-planner-table thead { display: table-header-group !important; }
.hmp-print-target .hmp-planner-table tfoot { display: table-footer-group !important; }
.hmp-print-target .hmp-planner-table th, .hmp-print-target .hmp-planner-table td { position: static !important; width: auto !important; min-width: 0 !important; height: auto !important; padding: 2mm !important; color: #000 !important; background: #fff !important; border: .2mm solid #000 !important; font-size: 8.5pt !important; }
.hmp-print-target .hmp-planner-table thead th { font-weight: 800 !important; letter-spacing: .03em; }
.hmp-print-target.hmp-print-mode-table .hmp-table-print-header { display: table-row !important; }
.hmp-print-target .hmp-table-print-header th { padding: 0 0 2mm !important; border: 0 !important; border-bottom: .2mm solid #000 !important; font-size: 9pt !important; letter-spacing: 0 !important; line-height: 1.2 !important; text-transform: none !important; }
.hmp-print-target .hmp-table-print-header div { display: flex !important; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1mm 5mm; }
.hmp-print-target .hmp-table-print-header strong { flex: 1 1 80mm; min-width: 0; font-size: 10pt !important; overflow-wrap: anywhere; }
.hmp-print-target .hmp-table-print-header span { flex: 0 0 auto; margin-left: auto; white-space: nowrap; }
.hmp-print-target .hmp-planner-table .hmp-scene-column { width: 15% !important; max-width: none !important; }
.hmp-print-target .hmp-cell { min-height: 0 !important; padding: 0 !important; }
.hmp-print-target .hmp-cell__body { min-height: 0 !important; color: #000 !important; overflow: visible !important; }
.hmp-print-target .hmp-checklist, .hmp-print-target .hmp-bullet-list { margin-bottom: 2mm !important; }
.hmp-print-target .hmp-checklist input { accent-color: #000 !important; filter: grayscale(1); }
.hmp-print-target .hmp-checklist li.is-checked span { color: #000 !important; }
.hmp-print-target .hmp-mention { padding: 0 !important; color: #000 !important; background: #fff !important; border: 0 !important; font-weight: 800; }
.hmp-print-target a { color: #000 !important; text-decoration: underline !important; }
.hmp-print-target .hmp-placeholder { color: #000 !important; }
.hmp-print-target .hmp-drop-hint, .hmp-print-target .hmp-attachment__delete, .hmp-print-target .hmp-attachment--image { display: none !important; }
.hmp-print-target .hmp-attachments { display: block !important; padding-top: 1mm; }
.hmp-print-target .hmp-attachment { border: 0 !important; border-radius: 0 !important; }
.hmp-print-target .hmp-attachment--pdf .hmp-attachment__preview { justify-content: flex-start; min-height: 0; padding: 0 !important; color: #000 !important; }
.hmp-print-target .hmp-attachment--pdf svg { display: none !important; }
.hmp-print-target.hmp-print-mode-table .hmp-todo-print-sheet { display: none !important; }
.hmp-print-target.hmp-print-mode-todos .hmp-app__chrome { display: none !important; }
.hmp-print-target.hmp-print-mode-todos .hmp-todo-print-sheet { display: block !important; }
.hmp-print-target .hmp-todo-print-table { width: 100% !important; margin: 0 !important; color: #000 !important; background: #fff !important; border: 0 !important; border-collapse: collapse !important; table-layout: fixed !important; }
.hmp-print-target .hmp-todo-print-table thead { display: table-header-group !important; }
.hmp-print-target .hmp-todo-print-table th, .hmp-print-target .hmp-todo-print-table td { padding: 0 !important; color: #000 !important; background: #fff !important; border: 0 !important; vertical-align: top !important; text-align: left !important; }
.hmp-print-target .hmp-todo-print-header th { padding: 0 0 2mm !important; border-bottom: .2mm solid #000 !important; font-size: 9pt !important; line-height: 1.2 !important; }
.hmp-print-target .hmp-todo-print-header div { display: flex !important; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1mm 5mm; }
.hmp-print-target .hmp-todo-print-header strong { flex: 1 1 80mm; min-width: 0; color: #000 !important; font-size: 10pt !important; overflow-wrap: anywhere; }
.hmp-print-target .hmp-todo-print-header span { flex: 0 0 auto; margin-left: auto; color: #000 !important; white-space: nowrap; }
.hmp-print-target .hmp-todo-print-title h2 { margin: 3mm 0 4mm !important; color: #000 !important; font-size: 15pt !important; line-height: 1.2 !important; }
.hmp-print-target .hmp-todo-list { display: block !important; max-height: none !important; overflow: visible !important; }
.hmp-print-target .hmp-todo-group { margin: 0 0 2.5mm !important; padding: 0 0 2.5mm !important; color: #000 !important; background: #fff !important; border: 0 !important; border-bottom: .2mm solid #000 !important; border-radius: 0 !important; break-inside: avoid; page-break-inside: avoid; }
.hmp-print-target .hmp-todo-group > strong, .hmp-print-target .hmp-todo-item__content, .hmp-print-target .hmp-todo-marker { color: #000 !important; }
.hmp-print-target .hmp-todo-item__content--checklist.is-checked > span:last-child { color: #000 !important; }
.hmp-print-target .hmp-todo-empty { padding: 0 !important; color: #000 !important; background: #fff !important; border: 0 !important; text-align: left; }
.hmp-print-target.hmp-print-mode-table.hmp-print-split-cells tr, .hmp-print-target.hmp-print-mode-table.hmp-print-split-cells td, .hmp-print-target.hmp-print-mode-table.hmp-print-split-cells .hmp-cell { break-inside: auto !important; page-break-inside: auto !important; }
.hmp-print-target.hmp-print-mode-table:not(.hmp-print-split-cells) tr, .hmp-print-target.hmp-print-mode-table:not(.hmp-print-split-cells) td, .hmp-print-target.hmp-print-mode-table:not(.hmp-print-split-cells) .hmp-cell { break-inside: avoid !important; page-break-inside: avoid !important; }
@page { margin: 14mm 8mm 10mm; size: landscape; }
}.hmc-app, .hmc-modal, .hmc-tabs, .hmc-toast {
--hc-bg:#f0f0f1; --hc-panel:#fff; --hc-inset:#f6f7f8; --hc-text:#1d2327; --hc-muted:#59626a; --hc-line:#c8cdd3; --hc-accent:#2271b1; --hc-on-accent:#fff; --hc-link:#155b92; --hc-danger:#b32d2e; --hc-good:#e9f4ee; --hc-warning:#fff6df; --hc-backdrop:rgba(25,30,35,.35);
color:var(--hc-text); font:14px/1.5 Arial,Helvetica,sans-serif; color-scheme:light; box-sizing:border-box;
}
.hmc-app[data-theme="dark"], .hmc-modal[data-theme="dark"], .hmc-tabs[data-theme="dark"], .hmc-toast[data-theme="dark"] {
--hc-bg:#0f1722; --hc-panel:#151f2d; --hc-inset:#1b2938; --hc-text:#edf3fb; --hc-muted:#b0bfce; --hc-line:#384b60; --hc-accent:#68d5b5; --hc-on-accent:#08251b; --hc-link:#8edbc5; --hc-danger:#ff9da8; --hc-good:#193b32; --hc-warning:#423923; --hc-backdrop:rgba(2,6,11,.76); color-scheme:dark;
}
.hmc-app *, .hmc-modal *, .hmc-print-root * { box-sizing:border-box; }
.hmc-app [hidden], .hmc-modal [hidden] { display:none !important; }
.hmc-app { width:100%; min-width:0; max-width:none; background:var(--hc-bg); border-radius:10px; }
.hmc-app button, .hmc-modal button, .hmc-tabs button { appearance:none; min-height:34px; margin:0; padding:6px 11px; background:var(--hc-inset); color:var(--hc-text); border:1px solid var(--hc-line); border-radius:6px; font:inherit; line-height:1.4; cursor:pointer; box-shadow:none; text-transform:none; letter-spacing:normal; }
.hmc-app button:hover, .hmc-modal button:hover, .hmc-tabs button:hover { border-color:var(--hc-accent); }
.hmc-app button:focus-visible, .hmc-modal button:focus-visible, .hmc-tabs button:focus-visible, .hmc-app [tabindex]:focus-visible { outline:2px solid var(--hc-accent); outline-offset:2px; }
.hmc-app button:disabled, .hmc-modal button:disabled { opacity:.55; cursor:wait; }
.hmc-app .hmc-primary, .hmc-modal .hmc-primary { background:var(--hc-accent); border-color:var(--hc-accent); color:var(--hc-on-accent); font-weight:700; }
.hmc-modal .hmc-danger { color:var(--hc-danger); }
.hmc-app input, .hmc-app select, .hmc-app textarea, .hmc-modal input, .hmc-modal select, .hmc-modal textarea { max-width:100%; min-width:0; margin:0; padding:8px 10px; border:1px solid var(--hc-line); border-radius:6px; font:inherit; color:var(--hc-text); background:var(--hc-inset); box-shadow:none; }
.hmc-app input::placeholder, .hmc-modal input::placeholder { color:var(--hc-muted); }
.hmc-app input[type="checkbox"], .hmc-modal input[type="checkbox"] { width:17px; height:17px; padding:0; accent-color:var(--hc-accent); }
.hmc-app a, .hmc-modal a { color:var(--hc-link); text-decoration:underline; }
.hmc-app h2, .hmc-app h3, .hmc-modal h2 { margin:0; padding:0; font-family:inherit; font-weight:700; color:var(--hc-text); line-height:1.25; text-transform:none; }
.hmc-app h2 { font-size:24px; }.hmc-app h3 { font-size:17px; }
.hmc-app p, .hmc-modal p { color:var(--hc-text); margin:10px 0; }
.hmc-app small, .hmc-modal small { display:block; color:var(--hc-muted); font-size:12px; }
.hmc-tabs { display:flex; align-items:flex-start; flex-wrap:wrap; gap:5px; width:100%; margin:0; padding:10px; background:var(--hc-panel); border-bottom:1px solid var(--hc-line); }
.hmc-tabs button[aria-selected="true"] { color:var(--hc-on-accent); border-color:var(--hc-accent); background:var(--hc-accent); font-weight:700; }
.hmc-tabs .hmc-expand { margin-left:auto; }
.hmc-view { padding:18px; min-width:0; }.hmc-view-header { display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; gap:14px; margin-bottom:18px; }
.hmc-view-actions { display:flex; gap:7px; flex-wrap:wrap; }
.hmc-filters { display:flex; align-items:flex-start; gap:10px; flex-wrap:wrap; margin:12px 0; }.hmc-filters > label { display:flex; align-items:flex-start; gap:5px; }
.hmc-field { display:flex !important; flex-direction:column; align-items:stretch !important; gap:5px; margin:0; color:var(--hc-text); font-size:13px; }.hmc-field > span { font-weight:700; }.hmc-field > input, .hmc-field > textarea, .hmc-field > select { width:100%; }
.hmc-project-filter { position:relative; min-width:190px; margin-top:24px; }.hmc-project-filter summary { padding:6px 10px; border:1px solid var(--hc-line); background:var(--hc-panel); border-radius:6px; cursor:pointer; }
.hmc-filter-popover { position:absolute; z-index:40; left:0; top:100%; width:max-content; min-width:230px; max-width:min(400px,85vw); max-height:340px; overflow:auto; padding:12px; border:1px solid var(--hc-line); border-radius:8px; background:var(--hc-panel); box-shadow:0 12px 25px rgba(0,0,0,.15); }
.hmc-filter-popover label { display:flex; align-items:flex-start; gap:8px; margin-top:9px; }
.hmc-filters > button { align-self:flex-end; }.hmc-filters > input[type="search"] { min-width:min(240px,100%); }
.hmc-block { min-width:0; margin-top:16px; padding:14px; border:1px solid var(--hc-line); border-radius:9px; background:var(--hc-panel); }
.hmc-role-list { display:flex; align-items:flex-start; gap:7px; flex-wrap:wrap; margin:13px 0; }
.hmc-event-list { display:grid; gap:8px; margin-top:14px; }.hmc-event-row { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; flex-wrap:wrap; padding:12px; background:var(--hc-inset); border:1px solid var(--hc-line); border-radius:7px; }.hmc-event-row > div { flex:1; min-width:180px; }
.hmc-people-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(175px,1fr)); gap:12px; width:100%; align-items:stretch; }
.hmc-person-card { position:relative; min-width:0; padding:0; overflow:hidden; border:1px solid var(--hc-line); border-radius:9px; background:var(--hc-panel); cursor:pointer; }.hmc-person-card:hover { border-color:var(--hc-accent); }
.hmc-person-card.is-archived { opacity:.65; }
.hmc-photo { position:relative; display:grid; place-items:center; width:100%; height:190px; overflow:hidden; background:var(--hc-inset); color:var(--hc-muted); isolation:isolate; }
.hmc-photo img.hmc-photo-blur { position:absolute; inset:-15%; width:130%; height:130%; max-width:none; object-fit:cover; filter:blur(18px); opacity:.36; z-index:-1; }
.hmc-photo img.hmc-photo-main { display:block; position:relative; width:100%; height:100%; min-height:0; max-height:100%; margin:0; padding:0; object-fit:contain; object-position:center; border:0; box-shadow:none; }
.hmc-photo.is-small { width:42px; height:48px; flex:0 0 42px; border-radius:5px; font-size:9px; }
.hmc-person-meta { display:flex; flex-direction:column; align-items:center; gap:4px; padding:12px 8px; text-align:center; overflow-wrap:anywhere; }
.hmc-person-meta strong { font-size:15px; color:var(--hc-text); }.hmc-person-meta a { font-size:12px; }.hmc-person-meta small { margin-top:4px; font-size:11px; }
.hmc-person-card.is-dragging::after, .hmc-person-card.is-uploading::after { content:"Foto hier ablegen"; position:absolute; inset:0; display:grid; place-items:center; color:var(--hc-on-accent); background:var(--hc-accent); z-index:4; font-weight:700; pointer-events:none; }.hmc-person-card.is-uploading::after { content:"Foto wird gespeichert …"; }
.hmc-hint { color:var(--hc-muted) !important; font-size:12px; }.hmc-warning { padding:10px; background:var(--hc-warning); border-radius:6px; }.hmc-badge { color:var(--hc-link); font-size:12px; }
.hmc-matrix-layout { display:grid; grid-template-columns:minmax(180px,230px) minmax(0,1fr); gap:16px; align-items:start; }.hmc-matrix-layout:not(:has(.hmc-casting-pool)) { grid-template-columns:minmax(0,1fr); }
.hmc-casting-pool { position:sticky; top:15px; padding:12px; border:1px solid var(--hc-line); border-radius:9px; background:var(--hc-panel); }.hmc-casting-pool h3 { margin-bottom:12px; }.hmc-casting-pool input { width:100%; margin:10px 0; }
.hmc-casting-pool-list { display:grid; gap:7px; max-height:60vh; overflow-y:auto; margin-top:12px; }.hmc-drag-person { display:flex; align-items:flex-start; gap:9px; padding:7px; border:1px solid var(--hc-line); border-radius:6px; background:var(--hc-inset); cursor:grab; }.hmc-drag-person strong { display:block; font-size:13px; }.hmc-drag-person small { font-size:11px; }.hmc-availability-available { color:var(--hc-link) !important; }.hmc-availability-unavailable { color:var(--hc-danger) !important; }
.hmc-matrix-tables { min-width:0; }.hmc-matrix-scroll { width:100%; min-width:0; max-width:100%; max-height:70vh; overflow:auto; margin-top:12px; }
.hmc-matrix { table-layout:auto; width:max-content; min-width:100%; border-collapse:separate; border-spacing:0; margin:0; color:var(--hc-text); font-size:13px; }
.hmc-matrix th, .hmc-matrix td { min-width:180px; max-width:280px; padding:9px; border:0; border-right:1px solid var(--hc-line); border-bottom:1px solid var(--hc-line); vertical-align:top; text-align:left; overflow-wrap:anywhere; background:var(--hc-panel); }
.hmc-matrix thead th { position:sticky; top:0; z-index:3; background:var(--hc-inset); border-top:1px solid var(--hc-line); }.hmc-matrix th:first-child { position:sticky; left:0; z-index:2; min-width:155px; max-width:220px; border-left:1px solid var(--hc-line); background:var(--hc-inset); }.hmc-matrix thead th:first-child { z-index:5; }.hmc-matrix thead th span { display:block; margin-top:5px; }.hmc-matrix th.is-selected { box-shadow:inset 0 -3px 0 var(--hc-accent); }
.hmc-app .hmc-assignment { display:block; width:100%; margin:5px 0; padding:5px 7px; min-height:28px; text-align:left; font-size:12px; }.hmc-app .hmc-assignment.is-reserve { border-style:dashed; font-style:italic; }.hmc-cell-count { color:var(--hc-muted); font-size:11px; }.hmc-app .hmc-cell-add { display:block; padding:2px 8px; min-height:25px; margin-top:7px; }
.hmc-matrix .is-understaffed { background:var(--hc-warning); }.hmc-matrix .is-complete { background:var(--hc-good); }.hmc-matrix .is-overstaffed { box-shadow:inset 0 0 0 2px var(--hc-line); }.hmc-cast-cell.is-dragging { outline:3px solid var(--hc-accent); outline-offset:-3px; }
.hmc-modal { position:fixed; inset:0; z-index:2147483600; display:flex; justify-content:center; align-items:flex-start; padding:25px 12px 85px; background:var(--hc-backdrop); backdrop-filter:blur(4px); overflow:auto; }
.hmc-dialog { width:min(660px,100%); max-height:calc(100dvh - 115px); overflow:auto; border-radius:12px; border:1px solid var(--hc-line); background:var(--hc-panel); box-shadow:0 25px 70px rgba(0,0,0,.3); }
.hmc-dialog > header { position:sticky; top:0; z-index:2; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:15px 18px; background:var(--hc-panel); border-bottom:1px solid var(--hc-line); }.hmc-dialog h2 { font-size:21px; }.hmc-modal .hmc-close { min-width:34px; padding:3px; font-size:22px; }
.hmc-dialog-content { padding:16px 18px; }.hmc-dialog footer { position:sticky; bottom:0; display:flex; justify-content:flex-end; align-items:flex-start; flex-wrap:wrap; gap:8px; padding:13px 18px; border-top:1px solid var(--hc-line); background:var(--hc-panel); }
.hmc-modal .hmc-save { position:fixed; z-index:5; bottom:18px; right:18px; box-shadow:0 8px 30px rgba(0,0,0,.3); min-height:44px; }.hmc-status { flex:1 0 100%; margin:0 !important; font-size:12px; color:var(--hc-muted) !important; }.hmc-status:empty { display:none; }.hmc-status.is-error { color:var(--hc-danger) !important; }
.hmc-dialog--form { display:flex; flex-direction:column; overflow:visible; transform:none !important; filter:none !important; contain:none !important; }
.hmc-dialog--form > header, .hmc-dialog--form > footer { flex:0 0 auto; }
.hmc-dialog--form > .hmc-dialog-content { flex:1 1 auto; min-height:0; overflow:auto; overscroll-behavior:contain; }
.hmc-dialog--form > footer { border-radius:0 0 12px 12px; }
.hmc-save-slot { display:inline-flex; flex:0 0 auto; align-items:center; justify-content:center; min-height:44px; max-width:100%; padding:6px 11px; border:1px solid transparent; font:inherit; font-weight:700; line-height:1.4; visibility:hidden; }
.hmc-modal .hmc-save--dialog { position:fixed !important; right:auto !important; bottom:auto !important; margin:0 !important; max-width:none; box-shadow:none; }
.hmc-form { display:grid; gap:14px; margin-top:15px; }.hmc-form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }.hmc-person-preview { max-width:100%; margin:0; border:1px dashed var(--hc-line); border-radius:8px; overflow:hidden; }.hmc-person-preview .hmc-photo { height:220px; }.hmc-person-preview small { padding:8px; }.hmc-person-preview.is-dragging, .hmc-form.is-dragging { outline:2px solid var(--hc-accent); }
.hmc-toast { position:fixed; z-index:2147483640; bottom:18px; left:18px; max-width:min(420px,calc(100vw - 36px)); padding:12px 16px; background:var(--hc-good); border:1px solid var(--hc-line); border-radius:8px; box-shadow:0 8px 30px rgba(0,0,0,.2); }.hmc-toast.is-error { background:var(--hc-panel); color:var(--hc-danger); }
.hmc-access { display:grid; gap:15px; padding:24px; max-width:650px; }.hmc-history p { padding-bottom:10px; border-bottom:1px solid var(--hc-line); overflow-wrap:anywhere; }
.hmp-app.hmc-wide:not(.is-expanded) { width:calc(100vw - 32px); max-width:none; margin-inline-start:calc(50% - 50vw + 16px); }
.hmp-app.is-expanded .hmc-app { max-height:calc(100dvh - 70px); overflow:auto; }
.hmc-print-root { position:absolute; left:-100000px; top:0; width:277mm; background:white; color:black; font:10pt/1.35 Arial,Helvetica,sans-serif; }
.hmc-print-root * { font-family:Arial,Helvetica,sans-serif !important; line-height:1.35 !important; letter-spacing:normal !important; text-transform:none !important; text-shadow:none !important; box-shadow:none !important; background-image:none !important; color:#000 !important; }
.hmc-print-page { width:277mm; height:188mm; margin:0; padding:0; overflow:hidden; page-break-after:always; break-after:page; }.hmc-print-page:last-child { page-break-after:auto; break-after:auto; }
.hmc-print-header { display:flex; align-items:flex-start; justify-content:space-between; gap:10mm; min-height:9mm; padding:0 0 2mm; margin-bottom:2mm; border-bottom:.2mm solid black; font-size:9pt; }.hmc-print-header > strong { max-width:52%; overflow-wrap:anywhere; }.hmc-print-header > span { text-align:right; white-space:nowrap; }
.hmc-print-content table { table-layout:fixed; border-collapse:separate; border-spacing:0; width:100%; margin:0; border-top:.2mm solid black; border-left:.2mm solid black; }.hmc-print-content th, .hmc-print-content td { padding:2mm; vertical-align:top; text-align:left; border-right:.2mm solid black; border-bottom:.2mm solid black; overflow-wrap:anywhere; font-size:9pt; }.hmc-print-content td > div { margin-bottom:1mm; }
.hmc-print-photos { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4mm; padding:2mm 0; }.hmc-print-photos figure { min-height:47mm; margin:0; text-align:center; }.hmc-print-photos img, .hmc-print-placeholder { width:100%; height:37mm; object-fit:contain; }.hmc-print-photos figcaption { font-size:10pt; margin-top:1mm; overflow-wrap:anywhere; }
@media(max-width:900px) { .hmc-matrix-layout { grid-template-columns:minmax(0,1fr); }.hmc-casting-pool { position:static; }.hmc-casting-pool-list { display:flex; max-height:160px; overflow:auto; }.hmc-drag-person { min-width:160px; }.hmc-people-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }.hmc-photo { height:175px; } }
@media(max-width:520px) { .hmc-view { padding:10px; }.hmc-tabs { gap:4px; padding:7px; }.hmc-tabs button { font-size:12px; padding:6px 8px; }.hmc-view-header h2 { font-size:21px; }.hmc-people-grid { gap:8px; }.hmc-dialog-content { padding:12px; }.hmc-modal { padding-top:10px; }.hmc-form-row { grid-template-columns:1fr; }.hmc-modal .hmc-save { max-width:calc(100vw - 36px); }.hmc-event-row { display:grid; grid-template-columns:minmax(0,1fr); }.hmc-filters .hmc-field { flex:1; }.hmc-project-filter { margin-top:0; } }
@media print {
.hmc-tabs, .hmc-modal, .hmc-toast, .hmc-app { display:none !important; }
body.hmc-printing, body.hmc-printing * { background-image:none !important; box-shadow:none !important; text-shadow:none !important; font-family:Arial,Helvetica,sans-serif !important; color:#000 !important; }
body.hmc-printing { margin:0 !important; padding:0 !important; background:#fff !important; }
body.hmc-printing > :not(.hmc-print-root) { display:none !important; }
body.hmc-printing .hmc-print-root { position:static !important; display:block !important; margin:0 !important; padding:0 !important; }
.hmc-print-root, .hmc-print-root * { background:transparent !important; color:#000 !important; font-family:Arial,Helvetica,sans-serif !important; }
.hmc-print-root table, .hmc-print-root th, .hmc-print-root td { border-color:#000 !important; }
}.wpkichat-widget {
--wpkichat-accent: #2563eb;
--wpkichat-text: #1f2937;
--wpkichat-muted: #6b7280;
--wpkichat-line: #d8dee8;
--wpkichat-panel: #ffffff;
--wpkichat-soft: #f3f4f6;
--wpkichat-user: #dcf8c6;
--wpkichat-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
--wpkichat-radius: 8px;
position: fixed;
right: 22px;
bottom: 22px;
z-index: 99999;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
color: var(--wpkichat-text);
}
.wpkichat-widget *,
.wpkichat-widget *::before,
.wpkichat-widget *::after {
box-sizing: border-box;
}
.wpkichat-toggle {
display: flex;
position: relative;
z-index: 1;
align-items: center;
justify-content: center;
width: 62px;
height: 62px;
color: #fff;
background: var(--wpkichat-accent);
border: 0;
border-radius: 50%;
box-shadow: var(--wpkichat-shadow);
cursor: pointer;
}
.wpkichat-toggle:hover,
.wpkichat-toggle:focus {
filter: brightness(0.96);
outline: 3px solid rgba(37, 99, 235, 0.18);
outline-offset: 3px;
}
.wpkichat-toggle-icon {
display: block;
font-size: 30px;
font-weight: 800;
line-height: 1;
}
.wpkichat-panel {
position: absolute;
right: 0;
bottom: 0;
z-index: 2;
display: none;
width: min(370px, calc(100vw - 28px));
height: min(590px, calc(100vh - 120px));
overflow: hidden;
background: var(--wpkichat-panel);
border: 1px solid var(--wpkichat-line);
border-radius: var(--wpkichat-radius);
box-shadow: var(--wpkichat-shadow);
}
.wpkichat-widget.is-open .wpkichat-panel {
display: grid;
grid-template-rows: auto minmax(0, 1fr) auto auto;
}
.wpkichat-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
min-height: 52px;
padding: 12px 14px;
color: #fff;
background: var(--wpkichat-accent);
}
.wpkichat-header-identity {
display: flex;
align-items: center;
gap: 9px;
min-width: 0;
}
.wpkichat-avatar {
display: block;
flex: 0 0 auto;
width: 32px;
height: 32px;
object-fit: cover;
background: rgba(255, 255, 255, 0.18);
border: 1px solid rgba(255, 255, 255, 0.34);
border-radius: 50%;
}
.wpkichat-header-title {
min-width: 0;
overflow: hidden;
font-size: 15px;
font-weight: 700;
line-height: 1.25;
text-overflow: ellipsis;
white-space: nowrap;
}
.wpkichat-close {
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
width: 30px;
height: 30px;
color: #fff;
font-size: 18px;
line-height: 1;
background: rgba(255, 255, 255, 0.16);
border: 0;
border-radius: 50%;
cursor: pointer;
}
.wpkichat-close:hover,
.wpkichat-close:focus {
background: rgba(255, 255, 255, 0.24);
outline: none;
}
.wpkichat-messages {
display: flex;
flex-direction: column;
gap: 10px;
min-height: 0;
padding: 14px;
overflow-x: hidden;
overflow-y: auto;
background: #f7f7f8;
}
.wpkichat-message {
display: flex;
width: 100%;
}
.wpkichat-message-user {
justify-content: flex-end;
}
.wpkichat-message-assistant,
.wpkichat-message-status {
justify-content: flex-start;
}
.wpkichat-bubble {
max-width: 82%;
padding: 10px 12px;
color: var(--wpkichat-text);
font-size: 14px;
line-height: 1.42;
overflow-wrap: anywhere;
white-space: pre-wrap;
border: 1px solid var(--wpkichat-line);
border-radius: 16px;
}
.wpkichat-bubble b {
font-weight: 750;
}
.wpkichat-bubble a.wpkichat-link {
color: inherit;
font-weight: 650;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 2px;
overflow-wrap: anywhere;
}
.wpkichat-bubble a.wpkichat-link:hover,
.wpkichat-bubble a.wpkichat-link:focus-visible {
text-decoration-thickness: 2px;
}
.wpkichat-message-user .wpkichat-bubble {
background: var(--wpkichat-user);
border-bottom-right-radius: 5px;
}
.wpkichat-message-assistant .wpkichat-bubble,
.wpkichat-message-status .wpkichat-bubble {
background: #fff;
border-bottom-left-radius: 5px;
}
.wpkichat-message-image .wpkichat-bubble {
max-width: min(82%, 280px);
padding: 6px;
overflow: hidden;
}
.wpkichat-bubble-image img {
display: block;
width: 100%;
height: auto;
max-height: 320px;
object-fit: contain;
border-radius: 10px;
}
.wpkichat-message-error .wpkichat-bubble {
color: #8a1f1f;
background: #fff0f0;
border-color: #f1bcbc;
}
.wpkichat-bubble-typewriter::after {
content: "";
display: inline-block;
width: 1px;
height: 1em;
margin-left: 2px;
vertical-align: -0.12em;
background: currentColor;
animation: wpkichatCursor 0.85s infinite;
}
.wpkichat-consent {
display: grid;
gap: 10px;
}
.wpkichat-consent-text {
margin: 0;
line-height: 1.45;
}
.wpkichat-consent-note {
min-height: 1em;
color: #991b1b;
font-size: 12px;
line-height: 1.35;
}
.wpkichat-consent-actions {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
}
.wpkichat-consent-accept,
.wpkichat-consent-decline {
width: 100%;
min-height: 32px;
padding: 6px 10px;
font-size: 13px;
line-height: 1.1;
border-radius: 7px;
cursor: pointer;
}
.wpkichat-consent-accept {
color: #fff;
background: var(--wpkichat-accent);
border: 1px solid var(--wpkichat-accent);
}
.wpkichat-consent-decline {
color: var(--wpkichat-text);
background: #fff;
border: 1px solid var(--wpkichat-line);
}
.wpkichat-decline {
display: grid;
gap: 10px;
}
.wpkichat-decline-text {
white-space: pre-wrap;
}
.wpkichat-message-faq .wpkichat-bubble {
width: 100%;
max-width: 100%;
}
.wpkichat-faq-list {
display: grid;
gap: 8px;
}
.wpkichat-faq-item {
padding: 9px 10px;
background: var(--wpkichat-soft);
border: 1px solid var(--wpkichat-line);
border-radius: 7px;
}
.wpkichat-faq-question {
color: var(--wpkichat-text);
font-weight: 700;
}
.wpkichat-faq-badge,
.wpkichat-faq-page-badge {
display: inline-flex;
align-items: center;
width: max-content;
min-height: 20px;
margin-left: 7px;
padding: 2px 6px;
color: #fff;
font-size: 11px;
font-weight: 700;
line-height: 1;
vertical-align: 0.1em;
background: var(--wpkichat-accent);
border-radius: 4px;
}
.wpkichat-faq-item-internal {
border-left: 3px solid var(--wpkichat-accent);
}
.wpkichat-faq-answer,
.wpkichat-faq-empty {
margin-top: 5px;
color: var(--wpkichat-text);
white-space: pre-wrap;
}
.wpkichat-contact-form {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 8px;
}
.wpkichat-contact-input {
min-width: 0;
min-height: 36px;
padding: 8px 10px;
color: var(--wpkichat-text);
font: inherit;
background: var(--wpkichat-soft);
border: 1px solid var(--wpkichat-line);
border-radius: 7px;
}
.wpkichat-contact-input:focus {
background: #fff;
border-color: var(--wpkichat-accent);
box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.14);
outline: none;
}
.wpkichat-contact-send {
min-height: 36px;
padding: 0 11px;
color: #fff;
font: inherit;
font-weight: 700;
background: var(--wpkichat-accent);
border: 1px solid var(--wpkichat-accent);
border-radius: 7px;
cursor: pointer;
}
.wpkichat-contact-send:disabled {
cursor: wait;
opacity: 0.7;
}
.wpkichat-contact-note {
margin-top: 7px;
color: var(--wpkichat-muted);
font-size: 12px;
line-height: 1.35;
}
.wpkichat-contact-privacy {
grid-column: 1 / -1;
margin: 0;
color: var(--wpkichat-muted);
font-size: 11px;
line-height: 1.4;
}
.wpkichat-typing {
display: inline-flex;
align-items: center;
gap: 4px;
min-width: 42px;
}
.wpkichat-typing-dot {
width: 6px;
height: 6px;
background: var(--wpkichat-muted);
border-radius: 50%;
animation: wpkichatTyping 1s infinite ease-in-out;
}
.wpkichat-typing-dot:nth-child(2) {
animation-delay: 0.12s;
}
.wpkichat-typing-dot:nth-child(3) {
animation-delay: 0.24s;
}
.wpkichat-form {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 8px;
padding: 12px;
background: #fff;
border-top: 1px solid var(--wpkichat-line);
}
.wpkichat-privacy-link {
width: 100%;
padding: 5px 12px 7px;
color: var(--wpkichat-muted);
font: inherit;
font-size: 11px;
text-align: center;
text-decoration: underline;
background: #fff;
border: 0;
cursor: pointer;
}
.wpkichat-privacy-link:hover,
.wpkichat-privacy-link:focus {
color: var(--wpkichat-text);
outline: none;
}
.wpkichat-input {
width: 100%;
max-height: 112px;
min-height: 40px;
padding: 10px 11px;
color: var(--wpkichat-text);
font: inherit;
line-height: 1.35;
resize: none;
background: var(--wpkichat-soft);
border: 1px solid var(--wpkichat-line);
border-radius: 7px;
}
.wpkichat-input:focus {
background: #fff;
border-color: var(--wpkichat-accent);
box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.14);
outline: none;
}
.wpkichat-send {
min-width: 78px;
min-height: 40px;
padding: 0 12px;
color: #fff;
font: inherit;
font-weight: 700;
background: var(--wpkichat-accent);
border: 1px solid var(--wpkichat-accent);
border-radius: 7px;
cursor: pointer;
}
.wpkichat-send:disabled {
cursor: wait;
opacity: 0.7;
}
.wpkichat-faq-page {
--wpkichat-faq-accent: #2563eb;
--wpkichat-faq-text: #1f2937;
--wpkichat-faq-muted: #6b7280;
--wpkichat-faq-line: #d8dee8;
--wpkichat-faq-soft: #f5f6f8;
width: 100%;
color: var(--wpkichat-faq-text);
font-family: inherit;
}
.wpkichat-faq-page *,
.wpkichat-faq-page *::before,
.wpkichat-faq-page *::after {
box-sizing: border-box;
}
.wpkichat-faq-page-toolbar {
display: flex;
justify-content: flex-end;
margin: 0 0 24px;
}
.wpkichat-faq-page-toggle {
min-height: 42px;
padding: 9px 14px;
color: #fff;
font: inherit;
font-size: 14px;
font-weight: 700;
line-height: 1.3;
background: var(--wpkichat-faq-accent);
border: 1px solid var(--wpkichat-faq-accent);
border-radius: 7px;
cursor: pointer;
}
.wpkichat-faq-page-toggle:hover {
filter: brightness(0.96);
}
.wpkichat-faq-page-toggle:focus-visible,
.wpkichat-faq-page-question:focus-visible {
outline: 3px solid rgba(37, 99, 235, 0.24);
outline-offset: 2px;
}
.wpkichat-faq-page-sections {
display: grid;
gap: 32px;
}
.wpkichat-faq-page-section {
margin: 0;
}
.wpkichat-faq-page-heading {
margin: 0 0 12px;
color: var(--wpkichat-faq-text);
font-size: 24px;
font-weight: 750;
line-height: 1.25;
letter-spacing: 0;
}
.wpkichat-faq-page-items {
display: grid;
gap: 8px;
}
.wpkichat-faq-page-item {
margin: 0;
overflow: hidden;
background: #fff;
border: 1px solid var(--wpkichat-faq-line);
border-radius: 7px;
}
.wpkichat-faq-page-item[open] {
border-color: var(--wpkichat-faq-accent);
}
.wpkichat-faq-page-question {
display: grid;
grid-template-columns: minmax(0, 1fr) 22px;
align-items: center;
gap: 14px;
min-height: 54px;
padding: 13px 16px;
color: var(--wpkichat-faq-text);
font-size: 16px;
font-weight: 700;
line-height: 1.4;
list-style: none;
cursor: pointer;
}
.wpkichat-faq-page-question-text {
min-width: 0;
}
.wpkichat-faq-page-item-internal {
border-left: 3px solid var(--wpkichat-faq-accent);
}
.wpkichat-faq-page-badge {
background: var(--wpkichat-faq-accent);
}
.wpkichat-faq-page-question::-webkit-details-marker {
display: none;
}
.wpkichat-faq-page-question:hover {
background: var(--wpkichat-faq-soft);
}
.wpkichat-faq-page-icon {
position: relative;
display: block;
width: 18px;
height: 18px;
}
.wpkichat-faq-page-icon::before,
.wpkichat-faq-page-icon::after {
position: absolute;
top: 8px;
left: 2px;
width: 14px;
height: 2px;
content: "";
background: var(--wpkichat-faq-accent);
border-radius: 2px;
}
.wpkichat-faq-page-icon::after {
transform: rotate(90deg);
transition: transform 160ms ease;
}
.wpkichat-faq-page-item[open] .wpkichat-faq-page-icon::after {
transform: rotate(0deg);
}
.wpkichat-faq-page-answer {
padding: 2px 16px 16px;
color: var(--wpkichat-faq-text);
font-size: 16px;
line-height: 1.65;
overflow-wrap: anywhere;
border-top: 1px solid var(--wpkichat-faq-line);
}
.wpkichat-faq-page-answer p {
margin: 12px 0 0;
}
.wpkichat-faq-page-answer a {
color: var(--wpkichat-faq-accent);
text-decoration: underline;
text-underline-offset: 2px;
}
.wpkichat-faq-page-empty {
margin: 0;
padding: 14px 16px;
color: var(--wpkichat-faq-muted);
background: var(--wpkichat-faq-soft);
border: 1px solid var(--wpkichat-faq-line);
border-radius: 7px;
}
@keyframes wpkichatTyping {
0%,
80%,
100% {
opacity: 0.35;
transform: translateY(0);
}
40% {
opacity: 1;
transform: translateY(-3px);
}
}
@keyframes wpkichatCursor {
0%,
45% {
opacity: 1;
}
46%,
100% {
opacity: 0;
}
}
@media (max-width: 780px) {
.wpkichat-widget {
right: 10px;
bottom: 10px;
}
.wpkichat-panel {
right: -2px;
bottom: 0;
width: calc(100vw - 16px);
height: min(620px, calc(100vh - 20px));
}
}
@media (max-width: 520px) {
.wpkichat-widget {
right: 0;
bottom: 0;
}
.wpkichat-panel {
position: fixed;
right: 0;
bottom: 0;
width: 100vw;
height: 100vh;
height: 100dvh;
border-right: 0;
border-bottom: 0;
border-left: 0;
border-radius: 0;
}
.wpkichat-toggle {
width: 58px;
height: 58px;
margin: 0 12px 12px 0;
}
.wpkichat-bubble {
max-width: 88%;
}
.wpkichat-form {
grid-template-columns: 1fr;
}
.wpkichat-contact-form {
grid-template-columns: 1fr;
}
.wpkichat-send {
width: 100%;
}
.wpkichat-faq-page-toolbar {
margin-bottom: 20px;
}
.wpkichat-faq-page-toggle {
width: 100%;
}
.wpkichat-faq-page-sections {
gap: 26px;
}
.wpkichat-faq-page-heading {
font-size: 20px;
}
.wpkichat-faq-page-question {
padding: 12px 13px;
font-size: 15px;
}
.wpkichat-faq-page-answer {
padding: 2px 13px 14px;
font-size: 15px;
}
}