/* Simulador: paleta oscura y oliva independiente del tema de la web. */
#win {
  --win: #0c1117;
  --side: #070b0f;
  --raise: #20272c;
  --raise-2: #293324;
  --line: #293137;
  --line-2: #394248;
  --line-3: #9daa73;
  --text: #e8edef;
  --soft: #b5c0c7;
  --muted: #98a5af;
  --green: #b3c58a;
  --green-tint: #293524;
  --green-line: #657b4b;
  --bar: #171e24;
  --pop: #171e24;
  --dim: #465052;
  --scroll: #536057;
  --pri-bg: #a9bb79;
  --pri-fg: #11180e;
  --pri-hover: #bdce8e;
  --sec-bg: #252e25;
  --sec-hover: #34412f;
  --me-bg: #273324;
  --me-fg: #e8efdd;
  --me-av-bg: #34412b;
  --me-av-fg: #d8e6b8;
  --hover: #141c20;
  --shadow: #0006;
  --shadow-2: #0008;
  --overlay: #0008;
  color-scheme: dark;
  color: var(--text);
  border-radius: 12px;
}
#win :focus-visible { outline-color: var(--green); }
#win .sim-toolbar { display: flex; align-items: center; gap: 18px; min-height: 58px; padding: 0 16px; background: var(--bar); border-bottom: 1px solid var(--line); }
#win .sim-brand { display: flex; align-items: center; gap: 9px; width: 255px; }
#win .sim-brand b { font-size: 21px; letter-spacing: -.6px; }
#win .sim-brand > span { font-size: 12px; color: var(--soft); border-left: 1px solid var(--line-2); padding-left: 10px; }
#win .sim-tab { padding: 5px 16px; border-radius: 7px; background: var(--pri-bg); color: var(--pri-fg); font-size: 13px; font-weight: 600; }
#win .sim-toolbar__end { display: flex; align-items: center; gap: 14px; margin-left: auto; }
#win .sim-badge { font-size: 11px; color: var(--green); }
#win .sim-studio { border: 1px solid var(--line-2); border-radius: 8px; padding: 6px 12px; color: var(--text); background: transparent; font-size: 12px; }
#win .sim-studio:hover { background: var(--raise); }
#win .sim-workspace { display: flex; justify-content: space-between; padding: 13px 18px; border-bottom: 1px solid var(--line); font-size: 12px; }
#win .sim-section-label { display: flex; justify-content: space-between; padding: 9px 16px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-size: 9px; font-weight: 600; }
#win .sim-section-label span { text-transform: none; letter-spacing: 0; font-weight: 400; }
#win .row { border-radius: 9px; padding: 12px 9px; }
#win .row.is-on { background: var(--green-tint); box-shadow: inset 2px 0 var(--green); }
#win .row__top b { font-size: 13px; font-weight: 600; }
#win .row__last { font-size: 11px; margin-top: 3px; }
#win .row .av { border: 1px solid #ffffff55; }
#win .dot { width: 6px; height: 6px; background: #d3ac69; }
#win .chat__head { background: var(--bar); min-height: 64px; }
#win .chat__who b { font-size: 14px; font-weight: 600; }
#win .m p { border-radius: 12px; font-size: 13px; line-height: 1.65; }
#win .m--me p { border-bottom-right-radius: 4px; }
#win .m--bot p { border-top-left-radius: 4px; }
#win .m__body { max-width: calc(100% - 42px); }
#win .m__name { font-size: 10px; }
#win .me { background: var(--bar); }
#win .panel { background: var(--bar); }
#win .panel__head { min-height: 64px; }
#win .panel__head h2 { font-size: 13px; font-weight: 600; }
#win .composer { border-radius: 14px; background: var(--bar); padding: 7px; }
#win .composer textarea { flex: 1; min-width: 0; height: 76px; resize: none; border: 0; background: none; font: inherit; font-size: 13px; line-height: 1.55; padding: 6px; color: var(--text); }
#win .composer textarea::placeholder { color: var(--muted); }
#win .composer .icon-btn:disabled, #win .send:disabled { opacity: .4; cursor: default; }
#win .composer-hint { margin: 0 max(18px, calc((100% - 660px) / 2)) 8px; font-size: 11px; color: var(--soft); }
#win .chip { font-size: 11px; padding: 5px 10px; border-radius: 8px; }
#win.is-new .composer-hint { display: none; }
#win .activity { margin-left: 42px; font-size: 12px; color: var(--soft); }
#win .activity summary { cursor: pointer; padding: 8px 0; }
#win .activity .tools { margin: 0; padding: 6px 0; }
#win .activity .tools li { font-size: 12px; }
#win .task-result { margin-left: 42px; padding: 14px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--raise); }
#win .task-result > small { color: var(--green); font-size: 10px; }
#win .task-result h3 { font-size: 14px; margin: 4px 0 12px; }
#win .task-result__image { display: block; width: 100%; height: auto; max-height: 220px; object-fit: contain; background: #edf0ec; border-radius: 6px; margin-bottom: 12px; }
#win .task-result dl { margin: 0 0 12px; display: grid; gap: 8px; font-size: 12px; }
#win .task-result dl > div { display: grid; grid-template-columns: minmax(75px, 1fr) minmax(0, 2fr); gap: 10px; }
#win .task-result dt { color: var(--muted); }
#win .task-result dd { margin: 0; overflow-wrap: anywhere; }
#win .task-result .btn { font-size: 12px; color: var(--green); }
#win #task-preview .task-result { margin: 0; }
@media (max-width: 1100px) {
  #win .sim-brand { width: auto; }
}
@media (max-width: 768px) {
  #win .sim-toolbar { min-height: 48px; padding: 0 12px; gap: 12px; }
  #win .sim-brand > span, #win .sim-studio { display: none; }
  #win .sim-brand b { font-size: 18px; }
  #win .sim-tab { padding: 4px 10px; font-size: 11px; }
  #win .sim-toolbar__end { gap: 0; }
  #win .composer-hint { margin: 0 14px 8px; }
  #win .activity, #win .task-result { margin-left: 0; }
  #win .composer textarea { height: 88px; }
}