@import './resource-dialog-busy.css';
@import './window-standard.css';
.resource-dialog{--rd-inset:color-mix(in srgb,var(--panel,#252624) 85%,#000);box-sizing:border-box;width:min(480px,calc(100vw - 24px));max-height:min(680px,calc(100dvh - 32px));padding:0;border:1px solid var(--line,#3c3d39);border-radius:var(--r-14);background:var(--panel,#252624);color:var(--text,#eeede8);font:var(--t-small)/1.35 var(--font-ui,system-ui);text-shadow:none;overflow:hidden}
.resource-dialog[open]{display:flex;flex-direction:column}
.resource-dialog *{box-sizing:border-box;text-shadow:none}.resource-dialog button,.resource-dialog input,.resource-dialog select,.resource-dialog textarea{font:inherit;color:inherit}
.resource-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line,#3c3d39);cursor:move;flex:none;touch-action:none}
.resource-dialog-header h2{display:flex;align-items:center;gap:8px;margin:0;font-size:calc(17px * var(--t-k));line-height:1.25;font-weight:650;min-width:0}.resource-dialog-mark{color:var(--accent,#49a0d0);display:flex}.resource-dialog-mark svg{width:18px;height:18px}
.resource-dialog-tabs{display:flex;gap:4px;flex-wrap:wrap;padding:9px 16px;border-bottom:1px solid var(--line,#3c3d39);flex:none}
.resource-dialog-tabs[hidden]{display:none}.resource-dialog-tabs button{border:0;border-radius:var(--r-18);background:var(--rd-inset);color:var(--muted,#a5a59b);padding:6px 11px;cursor:pointer}.resource-dialog-tabs button.on{background:color-mix(in srgb,var(--accent,#49a0d0) 18%,var(--panel,#252624));color:var(--text,#eeede8)}
.resource-dialog-body{overflow:auto;overscroll-behavior:contain;min-height:0;flex:1;padding:14px 16px;scrollbar-gutter:stable}
.resource-dialog-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:10px 16px;border-top:1px solid var(--line,#3c3d39);flex:none;flex-wrap:wrap}
.resource-dialog button:focus-visible,.resource-dialog input:focus-visible,.resource-dialog select:focus-visible,.resource-dialog textarea:focus-visible{outline:2px solid var(--accent,#49a0d0);outline-offset:3px}
.resource-dialog .rd-button{background:var(--rd-inset);border:1px solid var(--line,#3c3d39);border-radius:var(--r-16);min-height:30px;padding:5px 12px;cursor:pointer}.resource-dialog .rd-button.primary{background:var(--accent,#49a0d0);border-color:transparent;color:var(--onAccent,#fff)}.resource-dialog button:disabled{opacity:.45;cursor:default}
.resource-dialog label{display:flex;flex-direction:column;gap:4px;font-size:var(--t-tiny);color:var(--muted,#a5a59b);min-width:0}.resource-dialog input:not([type=range]):not([type=color]):not([type=checkbox]),.resource-dialog select,.resource-dialog textarea{width:100%;border:1px solid var(--field-edge,var(--line,#3c3d39));border-radius:var(--r-7);background:var(--field,var(--rd-inset));padding:6px 8px;color:var(--text,#eeede8);min-width:0;min-height:30px}.resource-dialog textarea{resize:vertical;min-height:72px}
.resource-dialog input[type=range]{width:100%;accent-color:var(--accent,#49a0d0)}.resource-dialog input[type=color]{width:36px;height:34px;border:0;padding:2px;background:none;cursor:pointer}.resource-dialog input[type=color]::-webkit-color-swatch{border-radius:50%;border:1px solid var(--line,#3c3d39)}.resource-dialog input[type=checkbox]:not([role=switch]){accent-color:var(--accent,#49a0d0);width:16px;height:16px;min-height:0;flex:none;margin:0}
.rd-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.rd-group{border:0;padding:0;margin:0 0 16px;display:grid;gap:8px;min-width:0}.rd-group:last-child{margin-bottom:0}.rd-group legend{color:var(--muted,#a5a59b);font-size:calc(10px * var(--t-k));letter-spacing:.09em;text-transform:uppercase;padding:0 0 7px;font-weight:650}.rd-color{display:flex;align-items:center;gap:6px}.rd-range{display:flex;align-items:center;gap:8px}.rd-range output{min-width:34px;text-align:right;font-variant-numeric:tabular-nums}.rd-check{flex-direction:row!important;align-items:center;gap:7px!important;color:var(--text,#eeede8)!important}.rd-note{font-size:var(--t-label);color:var(--muted,#a5a59b);margin:0}.rd-status{flex:1;min-width:70px;font-size:calc(10px * var(--t-k));color:var(--muted,#a5a59b)}.rd-status[role=alert]{color:var(--text,#eeede8)}
@media(max-width:500px){.resource-dialog{max-height:calc(100dvh - 16px);width:calc(100vw - 16px)}.resource-dialog-header,.resource-dialog-body,.resource-dialog-footer{padding:12px}.resource-dialog-tabs{padding:8px 12px}.resource-dialog-tabs button{padding:6px 9px}.rd-grid{gap:8px}}
/* Visual controls shared by resource editors. */
.rd-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}.rd-columns>div{min-width:0}.rd-columns>div+div{border-left:1px solid var(--line);padding-left:24px}
.rd-field-label{color:var(--muted);font-size:var(--t-tiny)}.rd-choice-field{display:grid;gap:6px}
/* Segments, one house control everywhere: a track with the same inner room on every side, every choice the same width
   and height with its words centered and never clipped, and the chosen one a pill sitting inside the track with the same
   inset all round, Day and Night. The up and down room follows Spacing (--space-k), the side room Text size (--t-k). */
.rd-segments{display:flex;gap:var(--s1,4px);background:var(--rd-inset);padding:var(--s1,4px);border-radius:var(--r-8);min-width:0;box-sizing:border-box}
.rd-segments>button,.rd-segments>label>span{flex:1 1 0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:calc(24px * var(--t-k));margin:0;border:1px solid transparent;background:transparent;color:var(--muted);border-radius:var(--r-5);padding:calc(var(--s1,4px) * var(--space-k,1)) calc(var(--s4,10px) * var(--t-k,1));font-size:var(--t-label);line-height:1.3;text-align:center;cursor:pointer;white-space:nowrap}
.rd-segments>button[aria-pressed=true],.rd-segments>label>input:checked+span{background:var(--panel);color:var(--accent);border-color:var(--line,var(--edge));box-shadow:0 1px 2px color-mix(in srgb,#000 14%,transparent)}
/* The same segments as a form's radio choice: each label holds its radio, unseen over the choice, and its words. */
.rd-segments>label{flex:1 1 0;position:relative;display:flex;min-width:0;margin:0;cursor:pointer}
.rd-segments>label>input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.rd-segments>label:hover>span{color:var(--text)}
.rd-segments>label>input:focus-visible+span{outline:2px solid var(--accent);outline-offset:1px}
.resource-dialog label.rd-color-line{flex-direction:row;justify-content:space-between;align-items:center}.rd-color-field{display:grid;gap:5px}.rd-color-value{font-size:var(--t-label);font-variant-numeric:tabular-nums}
.resource-dialog .rd-color input[type=color]{width:26px;height:26px;padding:0}.rd-swatches{display:flex;gap:8px;align-items:center;padding:3px 2px}
.rd-swatches button{height:23px;width:23px;border:1px solid color-mix(in srgb,var(--text) 14%,transparent);border-radius:50%;background:var(--swatch);padding:0;cursor:pointer;position:relative}
.rd-swatches button[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:3px}.rd-swatches button[aria-pressed=true]:after{content:'';position:absolute;width:5px;height:5px;border-radius:50%;background:var(--swatch);filter:invert(1);left:8px;top:8px}
.resource-dialog .rd-slider-row{display:grid;grid-template-columns:95px minmax(0,1fr);gap:10px;align-items:center;min-height:28px;font-size:var(--t-tiny);color:var(--muted)}
.rd-range{min-width:0}.rd-range output{font-size:var(--t-label);min-width:34px;color:var(--text)}
.resource-dialog input[type=range]{appearance:none;height:4px;min-height:0;margin:10px 0;padding:0;border:0;border-radius:var(--r-4);cursor:pointer;background:linear-gradient(to right,var(--accent) var(--range-fill),color-mix(in srgb,var(--text) 18%,transparent) var(--range-fill));min-width:0}
.resource-dialog input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:var(--accent);border:0}.resource-dialog input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--accent);border:0}
.resource-dialog label.rd-switch{justify-content:space-between;min-height:28px;color:var(--muted)!important}
.rd-details{border-top:1px solid var(--line);margin-top:12px;padding-top:3px}.rd-details>summary{list-style:none;cursor:pointer;padding:9px 0;font-size:var(--t-tiny);color:var(--muted);display:flex;align-items:center;gap:7px}.rd-details>summary::-webkit-details-marker{display:none}
.rd-details>summary:before{content:'';width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(-45deg);margin-right:2px}.rd-details[open]>summary:before{transform:rotate(45deg)}
.rd-details>div{display:grid;gap:10px;padding:4px 0 8px}.rd-details>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.resource-dialog .rd-text-button{border:0;background:transparent;color:var(--muted);text-align:left;padding:0;font-size:var(--t-label);cursor:pointer;width:fit-content}.rd-text-button:hover{color:var(--text)}
.rd-focal{display:grid;grid-template-columns:repeat(3,14px);gap:3px}.rd-focal button{height:14px;padding:0;border:1px solid var(--line);background:var(--rd-inset);border-radius:3px;cursor:pointer;display:grid;place-items:center}.rd-focal button[aria-pressed=true]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 20%,var(--panel))}.rd-focal span{width:3px;height:3px;background:var(--muted);border-radius:50%}.rd-focal [aria-pressed=true] span{background:var(--accent)}
.rd-presets{display:flex;gap:8px}.rd-presets button{flex:1;display:grid;place-items:center;gap:10px;border:1px solid var(--line);border-radius:var(--r-8);background:transparent;color:var(--muted);padding:12px 6px 7px;font-size:var(--t-label);cursor:pointer}.rd-presets button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}.rd-presets button>span{width:28px;height:19px;background:color-mix(in srgb,var(--panel) 85%,var(--text));border-radius:var(--r-4)}
@media(max-width:560px){.rd-columns{grid-template-columns:1fr;gap:18px}.rd-columns>div+div{padding:16px 0 0;border-left:0;border-top:1px solid var(--line)}}

/* Exact values share the same bounds as their slider. */
.resource-dialog .rd-number-unit{display:flex;align-items:center;gap:3px;flex:none;font-size:var(--t-label)}.resource-dialog .rd-number-unit input[type=number]{width:58px;min-height:28px;padding:4px;text-align:right;font-variant-numeric:tabular-nums}
