/* Captain Safe Studio. This file owns the editor and its dialogs. */
#treasureEditor { position:fixed; inset:0; z-index:60; background:#091627; color:#ecf2f8; font-family:Tahoma,Arial,sans-serif; }
#treasureEditor .hidden, .editor-ux-overlay.hidden, .editor-undo-toast.hidden { display:none !important; }
.studio-shell { height:100%; display:flex; flex-direction:column; padding:18px 22px; gap:18px; }
.editor-topbar { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:68px; flex-shrink:0; }
.editor-heading { display:flex; align-items:center; gap:12px; }
.editor-heading-icon { display:grid; place-items:center; width:48px; height:48px; border:1px solid #b99850; border-radius:16px; color:#f9d98b; background:#332e22; font-size:26px; }
.editor-heading small { color:#93a9bf; font-size:12px; }
.editor-heading h2 { font-family:AAGalaxy,Tahoma,sans-serif; font-size:27px; margin-top:4px; }
.editor-round-health { width:210px; }
.editor-round-health-copy { display:flex; justify-content:space-between; gap:8px; font-size:12px; margin-bottom:10px; }
.editor-round-health-copy span { color:#95a7be; }
.editor-round-health-track { height:5px; border-radius:10px; overflow:hidden; background:#25364b; }
.editor-round-health-track i { display:block; height:100%; background:#50d6b4; transition:width .25s ease; }
.editor-header-actions { display:flex; gap:8px; align-items:center; padding-left:84px; }
.editor-header-action { padding:12px 16px; min-height:44px; border:1px solid #334b65; border-radius:12px; background:#14263c; color:#e2eaf3; font-size:14px; font-weight:700; white-space:nowrap; }
.editor-header-action.is-primary { background:#f3cc74; border-color:#f3cc74; color:#1d2835; }
.editor-header-action:hover { filter:brightness(1.15); }
.editor-save-state { display:flex; align-items:center; gap:7px; max-width:154px; color:#80d4b5; font-size:12px; padding:8px; }
.editor-save-state[data-state="dirty"], .editor-save-state[data-state="saving"] { color:#f6d287; }
.editor-save-state[data-state="error"] { color:#ffaaa4; text-decoration:underline; cursor:pointer; }
.editor-main-layout { flex:1; min-height:0; display:grid; grid-template-columns:176px minmax(390px,1fr) minmax(290px,30%); gap:18px; }
.editor-map-panel { min-height:0; display:flex; flex-direction:column; padding:18px 12px; border:1px solid #26394e; border-radius:18px; background:#102035; }
.editor-map-panel > header { display:flex; align-items:center; justify-content:space-between; gap:4px; }
.editor-map-panel h3 { font-size:14px; font-weight:700; }
#editorBoxCountLabel { font-size:11px; color:#8fa4ba; }
.editor-map-stats { display:flex; gap:12px; padding:18px 0; }
.editor-map-stats div { flex:1; display:grid; gap:5px; font-size:11px; color:#90a6bd; }
.editor-map-stats strong { font-size:22px; color:#7eddbb; }
.editor-map-stats div:last-child strong { color:#e4c587; }
.editor-map-filters { display:flex; gap:3px; padding-bottom:14px; }
.editor-map-filters button { flex:1; font-size:11px; padding:8px 3px; border-radius:7px; color:#91a6bc; }
.editor-map-filters .is-active { background:#254258; color:#bdebf2; }
.editor-map-scroll { flex:1; min-height:0; overflow:auto; padding:3px; }
.editor-box-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; align-content:start; }
.editor-box-button { position:relative; display:grid; place-items:center; min-height:43px; border-radius:10px; border:1px solid #3a4d63; color:#9cb1c7; background:#14263b; font:700 15px Tahoma,sans-serif; transition:background .15s,transform .15s; }
.editor-box-button::after { content:""; position:absolute; width:4px; height:4px; bottom:5px; border-radius:50%; background:#64748b; }
.editor-box-button.is-ready::after { background:#6be0b4; }
.editor-box-button.is-incomplete::after { background:#f3bb65; }
.editor-box-button.is-selected { border-color:#69d4df; color:white; background:#206073; box-shadow:0 0 0 2px #163746; }
.editor-box-button:hover { transform:translateY(-1px); border-color:#7eacc5; }
.editor-grid-empty { grid-column:1/-1; color:#b8c8d5; font-size:13px; line-height:1.8; }
.editor-map-footer { padding-top:15px; border-top:1px solid #2c3e51; margin-top:12px; }
.editor-map-legend { display:flex; flex-wrap:wrap; gap:7px; font-size:10px; color:#a4b5c6; }
.editor-map-legend i { display:inline-block; width:5px; height:5px; border-radius:50%; margin-left:3px; background:#71859a; }
.editor-map-legend .is-ready { background:#6be0b4; }.editor-map-legend .is-incomplete { background:#f3bb65; }
.editor-map-navigation { display:flex; gap:8px; margin-top:14px; }
.editor-map-navigation button { flex:1; padding:8px; border:1px solid #344b62; border-radius:9px; }
.editor-work-panel { min-height:0; overflow:auto; border:1px solid #2c4056; border-radius:18px; padding:22px; background:#112137; }
#editForm { display:flex; flex-direction:column; gap:18px; height:auto; }
.editor-form-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; padding-bottom:16px; border-bottom:1px solid #2e4055; }
.editor-form-title { display:flex; align-items:center; gap:10px; font-size:14px; color:#a6bbcf; }
.editor-form-title h2 { font:700 26px Tahoma,sans-serif; color:#fff; direction:ltr; }
.editor-current-status { padding:5px 8px; border-radius:7px; background:#22354a; font-size:11px; color:#a9bed3; }
.editor-current-status.is-ready { background:#153f3d; color:#9ce5c7; }.editor-current-status.is-incomplete { background:#423824; color:#f8d58b; }
.studio-reset { font-size:11px; color:#96adc4; padding:8px 0; }
.studio-type-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:15px; }
.editor-inline-suggestion { color:#efcf8a; background:#393326; border:1px solid #73603b; border-radius:9px; padding:9px 12px; font-size:12px; white-space:nowrap; }
.studio-types > div { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; }
#treasureEditor .category-card { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:78px; padding:10px 3px; border:1px solid #33485f; border-radius:12px; background:#0c1a2d; box-shadow:none; }
#treasureEditor .category-card > div:first-child { font-size:23px; margin:0; }
#treasureEditor .category-card > div:nth-child(2) { font-size:11px; font-weight:700; }
#treasureEditor .category-card small { display:none; }
#treasureEditor input[name="contentKind"]:checked + .category-card { border-color:#6bd2dd; background:#1c4858; box-shadow:0 0 0 1px #6bd2dd; }
#treasureEditor input[name="contentKind"]:focus-visible + .category-card { outline:3px solid #f5d38e; outline-offset:3px; }
.studio-hint { color:#9fb3c7; font-size:12px; line-height:1.7; margin-top:-6px; min-height:20px; }
#treasureEditor .editor-card-section { padding:0; border:0; background:none; border-radius:0; box-shadow:none; transform:none; }
#treasureEditor .editor-primary-content-section { display:block; min-height:0; }
.editor-section-heading { margin-bottom:10px; }
.editor-section-heading > div > span, .editor-section-heading > small { display:none; }
.editor-section-heading strong { font-size:15px; }
#treasureEditor input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), #treasureEditor select, #treasureEditor textarea { font:14px/1.7 Tahoma,Arial,sans-serif; color:#f2f6fc; background:#09192a; border:1px solid #38526b; border-radius:10px; padding:10px 12px; min-height:43px; width:100%; box-shadow:none; outline:none; }
#treasureEditor textarea#editContent { min-height:128px; height:128px; resize:vertical; }
#treasureEditor input:focus, #treasureEditor textarea:focus, #treasureEditor select:focus { border-color:#75d1dd; box-shadow:0 0 0 3px #285c7066; }
#treasureEditor input::placeholder, #treasureEditor textarea::placeholder { color:#758ba2; }
#treasureEditor label:not(.cursor-pointer):not(.editor-answer-mode-toggle) { color:#a8bed1; font-size:12px; margin-bottom:6px; }
#charCountDisplay { font-size:10px; color:#8fa7be; }
#treasureEditor #editCorrectChoice { display:none; }
.editor-primary-content-section .text-\[9px\] { color:#8fa7be; margin-top:8px; font-size:10px; }
#contentKindSettings { display:flex; flex-direction:column; gap:14px; }
#contentKindSettings:has(> :not(.hidden)) { margin-top:0; }
#contentKindSettings:not(:has(> :not(.hidden))) { display:none; }
.editor-correct-choice-picker, .editor-timer-presets { display:flex; gap:8px; margin-top:8px; }
.editor-correct-choice-picker button, .editor-timer-presets button { flex:1; padding:10px; border:1px solid #385269; border-radius:9px; color:#b6c9db; font-size:12px; background:#172c42; }
.editor-correct-choice-picker .is-active, .editor-timer-presets .is-active { background:#20574c; color:#b0f0d7; border-color:#64cfa7; }
.studio-choice-list { display:grid; gap:9px; }
.studio-choice-list > div { display:flex; gap:9px; align-items:center; }
.studio-choice-list button { flex:0 0 40px; height:40px; border:1px solid #3c5870; color:#7195b0; border-radius:50%; }
.studio-choice-list button.is-active { color:#a7f1cf; border-color:#62d4a6; background:#20574c; }
.editor-answer-mode-toggle { display:flex; gap:10px; align-items:flex-start; padding:12px; border:1px solid #335069; border-radius:10px; cursor:pointer; }
.editor-answer-mode-toggle input { width:18px; height:18px; accent-color:#47c3ac; flex-shrink:0; }
.editor-answer-mode-switch { display:none; }
.editor-answer-mode-copy { display:grid; gap:7px; }
.editor-answer-mode-copy strong { font-size:12px; }.editor-answer-mode-copy small { font-size:11px; color:#91aac1; line-height:1.8; }
.editor-score-presets { display:flex; align-items:center; justify-content:space-between; gap:10px; border-top:1px solid #2a4156; padding-top:16px; }
.editor-score-presets-copy { display:grid; gap:6px; font-size:13px; }
.editor-score-presets-copy small { font-size:10px; color:#93abc1; }
.editor-score-preset-buttons { display:flex; gap:5px; }
.editor-score-preset-buttons button { padding:10px; border:1px solid #39536d; border-radius:8px; font-size:11px; color:#c1d2e2; background:#162b41; }
.editor-score-preset-buttons .is-positive { color:#91e1bf; }.editor-score-preset-buttons .is-negative { color:#f3aca5; }
.editor-v2-disclosure, #roundPointsEditorCard { border:1px solid #2e465c !important; border-radius:12px !important; padding:0 !important; background:#0e1d30 !important; }
.editor-v2-disclosure > summary, .editor-advanced-summary { display:flex; align-items:center; gap:10px; padding:14px; list-style:none; cursor:pointer; }
.editor-v2-disclosure summary::-webkit-details-marker, .editor-advanced-summary::-webkit-details-marker { display:none; }
.editor-v2-disclosure summary strong, .editor-advanced-summary strong { display:block; font-size:13px; }
.editor-v2-disclosure summary small, .editor-advanced-summary small { display:block; color:#87a2bc; font-size:10px; margin-top:5px; }
.editor-v2-disclosure summary b, .editor-advanced-summary b { margin-right:auto; color:#83becd; }
.editor-v2-disclosure[open] > summary b, #roundPointsEditorCard[open] > summary b { transform:rotate(45deg); }
#roundPointsEditorCard > div, .studio-appearance > div, .studio-appearance > details { margin:14px !important; }
.editor-v2-disclosure > div { padding:12px; }
.studio-preview-panel { min-height:0; display:flex; flex-direction:column; gap:12px; border:1px solid #2e4359; border-radius:18px; padding:18px; background:#0c1b2e; }
.editor-live-preview { min-height:0; flex:1; display:flex; flex-direction:column; align-items:stretch; background:none; padding:0; border:0; box-shadow:none; perspective:none; }
.editor-preview-heading { display:flex; flex-direction:column; gap:14px; margin-bottom:14px; }
.editor-preview-heading > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.editor-preview-heading span { font-size:14px; font-weight:700; }.editor-preview-heading strong { font-size:11px; color:#8fa8be; }
.editor-preview-tabs { display:flex; background:#172c42; border-radius:10px; padding:4px; gap:4px; }
.editor-preview-tabs button { flex:1; padding:9px 4px; font-size:11px; color:#a9bfd3; border-radius:7px; }
.editor-preview-tabs .is-active { background:#30576b; color:#fff; }
.editor-preview-canvas { flex:1; min-height:220px; overflow:auto; border:1px solid #38506a; border-radius:16px; padding:18px; background:radial-gradient(ellipse at 50% 0,#21415d,#101e33 65%); }
.editor-preview-reveal { min-height:100%; display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; }
.editor-preview-meta { display:flex; justify-content:space-between; width:100%; font-size:10px; color:#91b7ce; }
.editor-preview-icon { font-size:40px; margin-top:10px; }
#previewTitle { font-family:AAGalaxy,Tahoma,sans-serif; color:#f3d38a; font-size:24px; overflow-wrap:anywhere; }
#previewContent { font-size:17px; line-height:1.9; white-space:pre-wrap; overflow-wrap:anywhere; width:100%; }
.editor-preview-choices { width:100%; display:grid; gap:8px; }
.editor-preview-choice { border:1px solid #47637d; border-radius:10px; padding:10px; background:#132d45; font-size:13px; overflow-wrap:anywhere; }
.editor-preview-choice.is-correct { border-color:#75d8af; background:#174e42; color:#c5fbe3; }
.editor-preview-answer-mode { font-size:11px; color:#9fc8de; }
.editor-preview-answer { width:100%; border:1px solid #5a9e80; border-radius:9px; color:#a4ebc8; padding:12px; font-size:13px; overflow-wrap:anywhere; }
.editor-preview-effect { margin-top:auto; width:100%; padding-top:18px; border-top:1px solid #38546c; font-size:12px; color:#efd195; }
.editor-preview-timer { font:700 24px monospace; color:#9cdfd8; }
.editor-preview-media { width:100%; }
.editor-preview-media img { max-height:170px; max-width:100%; object-fit:contain; margin:auto; border-radius:10px; }
.editor-preview-media audio { width:100%; margin-top:10px; }
.editor-preview-closed { min-height:100%; display:flex; flex-direction:column; gap:20px; align-items:center; justify-content:center; }
.editor-preview-closed img { width:180px; max-width:90%; }.editor-preview-closed small { color:#9db5cd; font-size:12px; }
.editor-preview-validation { display:grid; gap:7px; padding-top:12px; font-size:11px; color:#f4c387; line-height:1.6; }
.editor-preview-validation .is-ready { color:#87cfb0; }
.studio-preview-open { flex-shrink:0; padding:12px; border:1px solid #486580; border-radius:10px; color:#c3dced; font-size:13px; }
.editor-autosave-note { color:#859eb6; font-size:11px; line-height:1.9; padding-bottom:12px; }
.editor-ux-overlay { position:fixed; inset:0; z-index:96; display:flex; align-items:center; justify-content:center; padding:28px; background:#030b18dc; -webkit-backdrop-filter: blur(8px); backdrop-filter:blur(8px); font-family:Tahoma,Arial,sans-serif; }
.editor-suggestion-dialog, .editor-review-dialog { width:min(720px,92vw); max-height:88vh; overflow:auto; padding:28px; background:#11243a; border:1px solid #416079; border-radius:24px; box-shadow:0 30px 90px #0008; }
.editor-dialog-heading { display:flex; justify-content:space-between; gap:18px; padding-bottom:20px; border-bottom:1px solid #334b62; }
.editor-dialog-heading span { color:#91cbd5; font-size:12px; }.editor-dialog-heading h2 { font-size:24px; font-weight:bold; margin:8px 0; }
.editor-dialog-heading p { color:#a1b7cd; font-size:13px; line-height:1.8; }
.editor-dialog-heading > button { width:40px; height:40px; flex-shrink:0; border:1px solid #445f75; border-radius:10px; }
.editor-suggestion-source { font-size:12px; color:#94b7ce; margin:20px 0; }
.editor-suggestion-card { display:flex; flex-wrap:wrap; gap:18px; padding:22px; background:#172f45; border:1px solid #38566d; border-radius:16px; }
.editor-suggestion-card > span { font-size:40px; }.editor-suggestion-card > div { flex:1; min-width:250px; }
.editor-suggestion-card small { color:#83c2d2; font-size:12px; }.editor-suggestion-card h3 { color:#f0d593; margin:10px 0; font-size:23px; }
.editor-suggestion-card p { font-size:16px; line-height:1.9; white-space:pre-wrap; }.editor-suggestion-card > b { font-size:13px; color:#eed49b; }
.editor-suggestion-loading { padding:45px; text-align:center; color:#a4bbce; }
.editor-dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:24px; }
.editor-dialog-actions button { padding:14px 20px; border:1px solid #416078; border-radius:12px; font-size:14px; font-weight:700; }
.editor-dialog-actions .is-primary { background:#e8c476; color:#172635; border-color:#e8c476; }
.editor-review-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:20px; }
.editor-review-stats > div { display:grid; gap:8px; text-align:center; background:#1a3146; padding:16px; border-radius:12px; }
.editor-review-stats strong { font-size:30px; }.editor-review-stats span { font-size:12px; color:#a3bbce; }
.editor-review-stats .is-ready { color:#80dab4; }.editor-review-stats .is-incomplete { color:#eec483; }
.editor-review-success { padding:18px; font-size:14px; color:#8be2be; line-height:1.8; }
.editor-review-issues { display:grid; gap:8px; max-height:250px; overflow:auto; margin-top:18px; }
.editor-review-issue { display:flex; gap:14px; justify-content:space-between; align-items:center; padding:14px; border-radius:10px; background:#343228; color:#e4cc9e; font-size:13px; line-height:1.8; }
.editor-review-issue button { color:#9ed7e5; white-space:nowrap; }
.editor-undo-toast { position:fixed; bottom:24px; right:24px; z-index:98; padding:16px; border:1px solid #70b29c; border-radius:12px; background:#153e36; font:14px Tahoma,sans-serif; }
.editor-undo-toast button { margin-right:20px; color:#9cdeeb; text-decoration:underline; }
@media(min-width:1700px) { .studio-shell { padding:26px 34px; gap:24px; }.editor-main-layout { grid-template-columns:210px minmax(420px,1fr) minmax(390px,34%); gap:24px; }.editor-work-panel { padding:30px; }.studio-types .category-card > div:nth-child(2) { font-size:13px !important; } }
@media(max-width:1150px) { .editor-main-layout { grid-template-columns:145px minmax(340px,1fr) 270px; gap:12px; }.studio-shell { padding:12px; }.editor-round-health { display:none; }.editor-work-panel { padding:16px; }.editor-header-actions { padding-left:75px; } }
@media(prefers-reduced-motion:reduce) { #treasureEditor *, .editor-ux-overlay * { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
