/* Sandbox de terminal (Día 2): herramienta de laboratorio, no landing.
   Escritorio: guía 32% · terminal 68% con archivos y verificación debajo. Móvil: una columna. */
.sandbox-main {max-width:1440px;margin:0 auto;padding:16px 24px 32px;}
.sandbox-main [hidden] {display:none !important;}
.sandbox-main :focus-visible {outline:3px solid var(--focus);outline-offset:3px;}
.sandbox-sr {position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* Cabecera breve con estado */
.sandbox-head {display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px;}
.sandbox-eyebrow {margin:0 0 4px;font:600 13px/1.4 Montserrat,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--blue);}
.sandbox-head h1 {font-size:clamp(28px,2.4vw,32px);margin:0;letter-spacing:-.025em;}
.sandbox-head-status {display:flex;align-items:center;gap:8px;}
#sandbox-status {margin:0;font-size:14px;color:var(--muted);}

/* Rejilla principal */
.sandbox-layout {display:grid;grid-template-columns:minmax(0,32fr) minmax(0,68fr);gap:24px;align-items:start;}
.sandbox-main h2 {font-size:18px;letter-spacing:-.01em;margin:0;}
.sandbox-main h3 {font-size:14px;margin:0 0 8px;overflow-wrap:anywhere;}

/* Comandos guiados */
.sandbox-hint {margin:4px 0 12px;font-size:15px;color:var(--muted);}
.sandbox-commands {list-style:none;counter-reset:cmd;margin:0;padding:0;border-top:1px solid var(--line);}
.sandbox-commands li {counter-increment:cmd;display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);}
.sandbox-commands li::before {content:counter(cmd);font:600 13px Montserrat,sans-serif;color:var(--muted);}
.sandbox-commands code {font:14px/1.5 'IBM Plex Mono',monospace;color:var(--ink);overflow-wrap:anywhere;}
.sandbox-commands .btn {min-height:36px;padding:6px 12px;}
.sandbox-expect {margin:16px 0;font-size:15px;}
.sandbox-expect summary {cursor:pointer;font:600 15px/1.4 Montserrat,sans-serif;color:var(--ink);min-height:44px;display:flex;align-items:center;}
.sandbox-expect p {margin:8px 0;}
.sandbox-expect code {font-size:14px;overflow-wrap:anywhere;}
.sandbox-note {color:var(--muted);font-size:14px;}
.sandbox-back {font-size:15px;}

/* Terminal: navy en ambos temas */
.sandbox-workbench {display:grid;gap:16px;min-width:0;}
.sandbox-terminal {--code:var(--navy);--code-fg:var(--mist);--code-btn:color-mix(in srgb,var(--white) 8%,var(--navy));--code-btn-hover:color-mix(in srgb,var(--white) 14%,var(--navy));--code-btn-line:color-mix(in srgb,var(--mist) 35%,var(--navy));background:var(--code);color:var(--code-fg);padding:12px 16px;border:1px solid var(--code-btn-line);border-radius:var(--radius-field);}
.sandbox-terminal-bar {display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:8px;border-bottom:1px solid var(--code-btn-line);}
.sandbox-terminal h2 {color:var(--white);font-size:14px;letter-spacing:.02em;}
#sandbox-exit {margin:0;font-size:13px;color:var(--code-fg);text-align:right;}
#sandbox-log {height:clamp(260px,42vh,460px);overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font:15px/1.6 'IBM Plex Mono',monospace;margin:0;padding:12px 0;background:none;color:var(--code-fg);}
.sandbox-command-entry {display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;padding-top:8px;border-top:1px solid var(--code-btn-line);}
#sandbox-prompt {flex-basis:100%;font:600 13px/1.5 'IBM Plex Mono',monospace;color:var(--bright);overflow-wrap:anywhere;}
.sandbox-command-entry .input {flex:1;min-width:0;background:var(--code);color:var(--white);border:1px solid var(--code-btn-line);padding:8px 10px;font:15px/1.5 'IBM Plex Mono',monospace;}
.sandbox-command-entry .input:read-only {opacity:.7;}
#sandbox-run {background:var(--code-btn);color:var(--white);border-color:var(--code-btn-line);}
#sandbox-run:hover {background:var(--code-btn-hover);border-color:var(--bright);}
.terminal-help {font-size:12px;color:var(--code-fg);opacity:.8;margin:8px 0 0;}
.terminal-prompt {color:var(--bright);font-weight:600;}
.terminal-command {color:var(--white);font-weight:600;}
.terminal-option {color:var(--bright);}
.terminal-path {color:color-mix(in srgb,var(--bright) 55%,var(--white));}
.terminal-string {color:color-mix(in srgb,var(--orange) 55%,var(--white));}
.terminal-output {color:var(--code-fg);}
.terminal-error {color:color-mix(in srgb,var(--orange) 75%,var(--white));}

/* Archivos y verificación junto a la terminal */
.sandbox-inspect {display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;align-items:start;}
.sandbox-panel {border:1px solid var(--line);border-radius:var(--radius-field);padding:12px 16px;min-width:0;}
.sandbox-panel-head {display:flex;align-items:baseline;justify-content:space-between;gap:12px;}
#sandbox-file-count {margin:0;font-size:13px;color:var(--muted);}
#sandbox-cwd {margin:4px 0 8px;font:13px/1.5 'IBM Plex Mono',monospace;color:var(--muted);overflow-wrap:anywhere;}
.sandbox-explorer {padding:8px 12px;background:var(--soft);overflow-wrap:anywhere;font:14px/1.6 'IBM Plex Mono',monospace;min-height:64px;}
.sandbox-explorer ul {list-style:none;margin:0;padding-left:16px;border-left:1px solid var(--line);}
.sandbox-explorer > ul {padding-left:0;border-left:0;}
.sandbox-explorer li {margin:2px 0;}
.sandbox-folder {font-weight:600;color:var(--ink);}
.sandbox-folder-new {color:var(--blue);}
.sandbox-file {display:inline-flex;align-items:center;text-align:left;color:var(--text);background:none;border:0;font:inherit;padding:0;min-height:32px;cursor:pointer;}
.sandbox-file:hover {color:var(--blue);text-decoration:underline;}
.sandbox-file-new small {font:12px/1.5 Calibri,Carlito,sans-serif;color:var(--blue);margin-left:8px;}
#sandbox-file-detail {margin-top:12px;}
#sandbox-file-content {white-space:pre-wrap;overflow-wrap:anywhere;padding:8px 12px;margin:0;background:var(--soft);font-size:14px;max-height:200px;overflow:auto;}
.sandbox-actions {display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:12px 0;}
#sandbox-check:hover {background:color-mix(in srgb,var(--blue) 85%,var(--navy));border-color:var(--blue);color:var(--on-blue);}
#sandbox-reset {min-height:36px;padding:6px 8px;background:none;border-color:transparent;color:var(--muted);text-decoration:underline;text-underline-offset:4px;}
#sandbox-reset:hover {background:none;border-color:transparent;color:var(--blue);}
#sandbox-feedback {margin:0;font-size:15px;}
#sandbox-criteria {list-style:none;margin:8px 0 0;padding:0;font:14px/1.5 'IBM Plex Mono',monospace;}
#sandbox-criteria li {margin:4px 0;overflow-wrap:anywhere;}
.sandbox-main [data-ok='true'] {border-left:4px solid var(--success-control);padding-left:8px;}
.sandbox-main [data-ok='false'] {border-left:4px solid var(--line-strong);padding-left:8px;}

@media (max-width:1100px) {
  .sandbox-inspect {grid-template-columns:1fr;}
}
@media (max-width:800px) {
  .sandbox-main {padding:12px 16px 24px;}
  .sandbox-layout {grid-template-columns:1fr;}
  .sandbox-head {align-items:flex-start;}
  #sandbox-log {height:clamp(220px,45vh,360px);font-size:14px;}
  .sandbox-file {min-height:44px;}
  .sandbox-commands .btn,#sandbox-reset {min-height:44px;}
}
