/* The creation flow shares the Disposition workspace's theme tokens. */
#create-dialog { width:min(1120px,calc(100vw - 48px)); max-width:calc(100vw - 48px); padding:0; border:1px solid var(--admin-border); border-radius:18px; overflow:hidden; color:var(--admin-text); background:var(--admin-surface); }
#create-dialog::backdrop { background:#111d355c; backdrop-filter:blur(4px); }
#create-dialog #create-form { display:flex; flex-direction:column; max-height:calc(100dvh - 48px); padding:0; margin:0; }
#create-dialog form>header { display:flex; align-items:center; justify-content:space-between; flex:none; gap:20px; margin:0; padding:24px 28px; border-bottom:1px solid var(--admin-border); }
#create-dialog header small { color:var(--admin-accent); font-size:10px; font-weight:650; letter-spacing:.13em; }
#create-dialog header h2 { color:var(--admin-text); font-size:26px; font-weight:650; margin:5px 0 0; letter-spacing:-.03em; }
#create-dialog #close-create { width:38px; height:38px; border:1px solid var(--admin-border); border-radius:10px; background:var(--admin-surface); color:var(--admin-muted); }
#create-dialog .admin-order-body { display:grid; grid-template-columns:minmax(0,1fr) 280px; align-items:start; gap:28px; padding:28px; overflow:auto; overscroll-behavior:contain; min-height:0; }
#create-dialog .admin-order-fields { min-width:0; }
#create-dialog .admin-order-section+.admin-order-section { border-top:1px solid var(--admin-border); margin-top:26px; padding-top:26px; }
#create-dialog .admin-order-section-heading { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
#create-dialog .admin-order-section-heading>span { display:grid; place-items:center; width:32px; height:32px; flex:none; border-radius:10px; color:var(--admin-accent); background:var(--admin-selected); font-size:11px; font-weight:650; }
#create-dialog .admin-order-section-heading h3 { margin:0; color:var(--admin-text); font-size:15px; font-weight:650; letter-spacing:-.015em; }
#create-dialog .admin-order-section-heading p { margin:4px 0 0; color:var(--admin-muted); font-size:12px; line-height:1.5; }
#create-dialog .create-identity { grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:16px; }
#create-dialog label { margin:0; color:var(--admin-text); font-size:12px; font-weight:550; }
#create-dialog input:not([type=range]) { min-width:0; width:100%; min-height:44px; border:1px solid var(--admin-border); border-radius:8px; padding:10px 12px; background:var(--admin-surface); color:var(--admin-text); font-size:14px; }
#create-dialog input:focus-visible,#create-dialog button:focus-visible { outline:3px solid var(--admin-accent); outline-offset:3px; }
#create-dialog .hostname { display:flex; min-width:0; align-items:center; border:1px solid var(--admin-border); border-radius:8px; overflow:hidden; background:var(--admin-subtle); }
#create-dialog .hostname input { border:0; border-radius:0; flex:1; width:0; }
#create-dialog .hostname>span { flex:none; padding:0 12px; font-size:12px; color:var(--admin-muted); }
#create-dialog .create-resource-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:0; }
#create-dialog .create-resource-grid>label { display:grid; gap:12px; padding:16px; border:1px solid var(--admin-border); border-radius:10px; background:var(--admin-surface); }
#create-dialog .create-resource-grid>label:last-child { grid-column:auto; }
#create-dialog .create-resource-grid label>span { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; color:var(--admin-muted); font-size:12px; }
#create-dialog .create-resource-grid strong { padding:0; border:0; box-shadow:none; border-radius:0; background:none; color:var(--admin-text); white-space:nowrap; font-size:13px; font-weight:650; }
#create-dialog .create-resource-grid small { color:var(--admin-muted); font-size:10px; }
#create-dialog input[type=range] { width:100%; accent-color:var(--admin-accent); min-height:20px; padding:0; margin:0; cursor:pointer; }
#create-dialog .create-storage-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0 0; }
#create-dialog .create-storage-grid label { display:grid; gap:7px; }
#create-dialog .resource-grid-note { margin:14px 0 0; font-size:11px; line-height:1.6; color:var(--admin-muted); }
#create-dialog .admin-order-summary { position:sticky; top:0; min-width:0; padding:22px; border:1px solid var(--admin-border); border-radius:12px; background:var(--admin-canvas); }
#create-dialog .admin-order-summary-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:var(--admin-selected); color:var(--admin-accent); }
#create-dialog .admin-order-summary-icon svg { width:24px; height:24px; }
#create-dialog .admin-order-eyebrow { margin:20px 0 8px; font-size:9px; font-weight:650; letter-spacing:.12em; color:var(--admin-muted); }
#create-dialog #create-summary-heading { margin:0; font-size:18px; line-height:1.4; font-weight:650; color:var(--admin-text); overflow-wrap:anywhere; }
#create-dialog #create-summary-domain { margin:6px 0 22px; font-size:11px; line-height:1.6; color:var(--admin-muted); overflow-wrap:anywhere; }
#create-dialog .admin-order-summary dl { margin:0; }
#create-dialog .admin-order-summary dl>div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--admin-border); }
#create-dialog .admin-order-summary dt { font-size:11px; color:var(--admin-muted); }
#create-dialog .admin-order-summary dd { margin:0; flex:none; color:var(--admin-text); font-size:12px; font-weight:600; }
#create-dialog .admin-order-storage-note { margin-top:22px; }
#create-dialog .admin-order-storage-note strong { display:block; font-size:11px; line-height:1.6; color:var(--admin-text); }
#create-dialog .admin-order-storage-note p { margin:6px 0 0; font-size:11px; line-height:1.7; color:var(--admin-muted); }
#create-dialog #create-error:empty { display:none; }
#create-dialog #create-error:not(:empty) { display:block; flex:none; margin:0 28px 16px; padding:12px 16px; border-radius:8px; background:var(--admin-subtle); color:var(--admin-danger); font-size:12px; }
#create-dialog form>footer { display:flex; flex:none; align-items:center; justify-content:space-between; gap:20px; padding:18px 28px; margin:0; border-top:1px solid var(--admin-border); background:var(--admin-surface); }
#create-dialog footer>p { margin:0; max-width:260px; color:var(--admin-muted); font-size:11px; line-height:1.5; }
#create-dialog footer>div { display:flex; align-items:center; gap:10px; }
#create-dialog footer button { padding:11px 16px; min-height:42px; border-radius:8px; font-size:12px; box-shadow:none; }
#create-dialog footer .primary { background:var(--admin-accent); color:var(--admin-surface); border:1px solid var(--admin-accent); }
@media(max-width:900px) { #create-dialog .create-identity{grid-template-columns:1fr} #create-dialog .create-resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))} #create-dialog .create-resource-grid>label:last-child{grid-column:1/-1}  #create-dialog .admin-order-body{grid-template-columns:minmax(0,1fr) 240px;gap:20px;padding:22px} #create-dialog .admin-order-summary{padding:18px} }
@media(max-width:700px) { #create-dialog{width:calc(100vw - 24px)} #create-dialog #create-form{max-height:calc(100dvh - 24px)} #create-dialog .admin-order-body{grid-template-columns:1fr;padding:20px;gap:24px} #create-dialog .admin-order-summary{position:static} #create-dialog form>header{padding:20px} #create-dialog header h2{font-size:23px} #create-dialog form>footer{padding:16px 20px;gap:10px;align-items:stretch;flex-direction:column} #create-dialog footer>p{max-width:none} #create-dialog footer>div{justify-content:flex-end} #create-dialog footer button{font-size:11px;padding:10px 12px} }
@media(prefers-reduced-motion:reduce) { #create-dialog *{scroll-behavior:auto} }
#create-dialog .admin-order-body{grid-template-rows:minmax(0,1fr);align-items:stretch;overflow:hidden}
#create-dialog .admin-order-fields{overflow:auto;min-height:0;overscroll-behavior:contain;padding-right:8px;scrollbar-gutter:stable}
#create-dialog .admin-order-summary{position:static;overflow:auto;max-height:100%;min-height:0}
#create-dialog .admin-order-defaults-link{display:block;margin:18px 0 0;padding:0;border:0;background:none;box-shadow:none;font-size:11px;color:var(--admin-accent);text-align:left;line-height:1.6;cursor:pointer}
.instance-defaults-panel{margin:22px 0;padding:0 20px;border:1px solid var(--admin-border);border-radius:12px;background:var(--admin-surface);color:var(--admin-text)}
.instance-defaults-panel>summary{padding:18px 0;cursor:pointer;font-size:13px;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px}
.instance-defaults-panel>summary::-webkit-details-marker{display:none}
.instance-defaults-panel>summary:after{content:'⌄';color:var(--admin-muted)}
.instance-defaults-panel>summary span{font-size:11px;color:var(--admin-muted);margin-left:auto}
.instance-defaults-panel form{border-top:1px solid var(--admin-border);padding:0 0 20px;margin:0}
.instance-defaults-panel form>p{max-width:760px;font-size:12px;line-height:1.7;color:var(--admin-muted)}
.instance-defaults-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:580px}
.instance-defaults-fields label{display:grid;gap:8px;font-size:12px;color:var(--admin-text)}
.instance-defaults-fields input{width:100%;padding:10px 12px;min-height:42px;background:var(--admin-surface);border:1px solid var(--admin-border);border-radius:8px;color:var(--admin-text);font:inherit;font-size:14px}
.instance-defaults-actions{display:flex;gap:10px;margin-top:18px}
#instance-defaults-status:not(:empty){display:block;margin-top:16px;font-size:12px;color:var(--admin-accent)}
.instance-defaults-panel :focus-visible{outline:3px solid var(--admin-accent);outline-offset:3px}
@media(max-width:700px){#create-dialog .admin-order-body{grid-template-rows:auto;overflow:auto;align-items:start}#create-dialog .admin-order-fields,#create-dialog .admin-order-summary{overflow:visible;max-height:none;padding-right:0} .instance-defaults-panel>summary{flex-wrap:wrap;gap:6px}.instance-defaults-panel>summary span{margin-left:0}.instance-defaults-fields{grid-template-columns:1fr}}

.instance-defaults-panel>summary::before{display:none}.instance-defaults-panel>summary::marker{content:''}.instance-defaults-panel[open]>summary:after{transform:rotate(180deg)}
@media(max-width:700px){#create-dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}#create-dialog #create-form{max-height:calc(100dvh - 26px)}#create-dialog .admin-order-body{display:block}#create-dialog .admin-order-summary{margin-top:24px}}

.instance-defaults-panel{scroll-margin-top:170px}
