/* Tres vistas del estudio y montaje de las capturas reales de Daytona. */
#win #studio-body {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}
#win .studio-tabs { position: static; flex: none; gap: 4px; }
#win .studio-tabs button { flex: 1; padding: 8px 6px; white-space: nowrap; }
#win .studio-tabs svg { width: 15px; height: 15px; flex: none; }
#win .studio-content { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
#win #studio-body[data-view="preview"] .studio-content { overflow: hidden; }
#win .studio-expand {
  margin-left: auto;
  flex: none;
  padding: 6px 9px;
  border: 1px solid var(--line-2);
  border-radius: 6px;
  background: transparent;
  color: var(--soft);
  font-size: 11px;
}
#win .panel__head > .icon-btn { flex: none; }
#win .desktop-examples { display: grid; gap: 9px; margin-top: 22px; font-size: 12px; }
#win .desktop-examples b { font-size: 12px; font-weight: 500; color: var(--muted); }
#win .desktop-examples button {
  text-align: left;
  padding: 11px 12px;
  border: 1px solid var(--line-2);
  border-radius: 8px;
  background: var(--raise);
  color: var(--text);
  font-size: 12px;
}
#win .desktop-examples button:hover { border-color: var(--green-line); color: var(--green); }
#win .daytona-screen {
  position: relative;
  width: 100%;
  aspect-ratio: 1135 / 852;
  overflow: hidden;
  border: 1px solid #45535b;
  border-radius: 6px;
  background: #044958;
  isolation: isolate;
}
#win .daytona-screen > img { display: block; width: 100%; height: 100%; object-fit: contain; }
#win .desktop-selection {
  position: absolute;
  left: 35.7%;
  top: 18.2%;
  width: 7.3%;
  height: 11.3%;
  border: 1px solid #94c8ff;
  background: #65aaff38;
  border-radius: 3px;
}
#win .desktop-selection--browser { left: 2.4%; top: 71.8%; width: 8.5%; height: 11%; }
#win .daytona-pointer {
  position: absolute;
  left: var(--cursor-x);
  top: var(--cursor-y);
  z-index: 3;
  width: clamp(14px, 2vw, 24px);
  pointer-events: none;
  filter: drop-shadow(0 1px 2px #0007);
}
#win .daytona-pointer svg { display: block; width: 100%; }
#win .daytona-pointer small {
  display: block;
  width: max-content;
  padding: 3px 6px;
  margin-left: 12px;
  border-radius: 4px;
  background: #b4c58b;
  color: #172017;
  font: 9px/1.2 var(--sans);
}
#win .daytona-pointer.is-moving { animation: daytona-point 1.4s ease-out both; }
@keyframes daytona-point { from { transform: translate(55px, 40px); } to { transform: translate(0, 0); } }
#win .daytona-browser-note {
  position: absolute;
  top: 41%;
  left: 33%;
  right: 8%;
  padding: 16px;
  border: 1px solid #65828e;
  border-radius: 7px;
  background: #17272eeb;
  color: #e0ecef;
  font-size: 11px;
  line-height: 1.6;
}
#win .blender-workspace {
  position: absolute;
  left: 5.1%;
  top: 16.7%;
  width: 76.7%;
  height: 76.1%;
  display: flex;
  flex-direction: column;
  background: #343a40;
  overflow: hidden;
  box-shadow: 0 0 0 1px #242729;
}
#win .blender-workspace__tools, #win .blender-workspace__status {
  flex: none;
  background: #303336;
  color: #d8dede;
  padding: 3px 6px;
  font-size: clamp(5px, .65vw, 10px);
}
#win .blender-workspace .reception-model { flex: 1; min-height: 0; width: 100%; }
#win .blender-workspace__status { border-top: 1px solid #42494e; }
#win .daytona-calc {
  position: absolute;
  inset: 9% 4% 8%;
  background: #fff;
  overflow: auto;
  border: 1px solid #47585b;
  border-radius: 4px;
  box-shadow: 0 6px 18px #0007;
}
#win .daytona-app-title { padding: 6px 9px; background: #303537; color: #e8ebeb; font-size: 10px; }
#win .daytona-calc .workbook { border: 0; border-radius: 0; }
#win .daytona-calc .workbook > header { padding: 8px; }
#win .daytona-calc .workbook table { min-width: 350px; }
#win .daytona-calc .workbook table th, #win .daytona-calc .workbook table td { padding: 5px 6px; font-size: 9px; }
#win .daytona-calc .workbook-chart { display: none; }
#win .workbook { background: #fff; color: #263b31; border: 1px solid #d4ded7; border-radius: 8px; overflow: hidden; }
#win .workbook > header { display: flex; align-items: center; gap: 10px; padding: 13px 12px; background: #236342; color: #fff; }
#win .workbook > header > div { display: grid; gap: 3px; min-width: 0; }
#win .workbook > header b { font-size: 12px; overflow-wrap: anywhere; }
#win .workbook > header small { font-size: 9px; color: #cce4d6; }
#win .workbook > header img { flex: none; background: #fff; border-radius: 3px; padding: 2px; }
#win .workbook-ribbon { display: flex; gap: 16px; padding: 9px 12px; background: #f3f6f3; color: #4f6254; font-size: 10px; }
#win .workbook-ribbon b { border-bottom: 2px solid #358557; padding-bottom: 3px; }
#win .formula-bar { display: flex; align-items: center; gap: 10px; border-block: 1px solid #d9e1db; padding: 6px; font-size: 11px; background: #f8faf8; }
#win .formula-bar > span { padding: 3px 10px; min-width: 43px; background: #fff; border: 1px solid #d5ded6; }
#win .formula-bar b { font-family: Georgia, serif; color: #7a887c; }
#win .formula-bar code { font: 10px ui-monospace, SFMono-Regular, monospace; color: #35583f; }
#win .workbook-scroll { overflow-x: auto; }
#win .workbook table { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 370px; }
#win .workbook caption { padding: 10px; text-align: left; font-size: 9px; color: #68776b; }
#win .workbook th, #win .workbook td { padding: 10px 7px; border: 1px solid #e0e6e1; font-size: 10px; text-align: right; height: 33px; }
#win .workbook th { font-weight: 400; text-align: center; background: #f1f4f1; color: #718075; }
#win .workbook th:first-child { width: 25px; padding-inline: 3px; }
#win .workbook td:nth-child(2) { text-align: left; }
#win .workbook-head td { color: #315c3d; background: #e9f2e6; font-weight: 600; }
#win .workbook-total td { color: #254a31; background: #eff5ec; font-weight: 700; border-top: 2px solid #91ad88; }
#win .workbook td.is-writing { position: relative; background: #e3f3df; outline: 2px solid #2d8d50; outline-offset: -2px; }
#win .workbook td.is-writing::after { content: ""; position: absolute; right: 0; bottom: 0; width: 5px; height: 5px; background: #2d8d50; }
#win .workbook-sheets { display: flex; gap: 14px; align-items: center; padding: 9px 11px; background: #f2f6f1; border-top: 1px solid #d4dfd3; font-size: 10px; }
#win .workbook-sheets b { color: #326d43; border-bottom: 2px solid #37784b; padding-bottom: 4px; }
#win .workbook-sheets small { margin-left: auto; font-size: 8px; color: #718575; }
#win .workbook-chart { padding: 17px 12px; }
#win .workbook-chart > b { font-size: 11px; }
#win .workbook-chart > div { display: flex; gap: 12px; height: 150px; margin-top: 24px; padding: 0 8px; border-bottom: 1px solid #dce5d8; }
#win .workbook-chart > div > span { flex: 1; min-width: 0; position: relative; display: flex; flex-direction: column; justify-content: end; align-items: center; }
#win .workbook-chart i { display: block; width: 65%; height: calc(var(--amount) * .75); background: #83a369; border-radius: 3px 3px 0 0; }
#win .workbook-chart strong { position: absolute; bottom: calc(var(--amount) * .75 + 23px); white-space: nowrap; font-size: 9px; font-weight: 500; color: #4b6941; }
#win .workbook-chart small { padding: 6px 0; font-size: 9px; }
#win .artifact-download { display: block; padding: 12px; border-top: 1px solid #dce4d9; color: #32663c; background: #eef5ea; font-size: 12px; text-decoration: none; }
#win .artifact-download:hover { text-decoration: underline; }
#win .artifact-progress { font-size: 10px; color: #728577; padding: 12px; }
#win .model-result { overflow: hidden; border: 1px solid var(--line-2); border-radius: 8px; background: #e8ebe4; color: #33412f; }
#win .model-result > header { padding: 22px 20px 10px; }
#win .model-result header small { letter-spacing: .1em; font-size: 9px; color: #627754; }
#win .model-result h3 { font: 24px/1.25 Georgia, serif; margin-top: 10px; max-width: 340px; }
#win .model-result .reception-model { display: block; width: 100%; height: auto; }
#win .model-result dl { display: grid; gap: 12px; padding: 15px 20px 22px; font-size: 11px; }
#win .model-result dt { color: #667a57; }
#win .model-result dd { margin-top: 4px; }
#win .model-result .studio-note { color: #5e7155; padding: 0 12px 12px; }
#win .studio-run-controls { flex: none; padding: 12px; background: #202a24; border-top: 1px solid #40523a; }
#win .studio-run-controls > span { display: block; color: #dce7cf; font-size: 12px; line-height: 1.45; }
#win .studio-run-controls > div { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 9px; }
#win .studio-run-controls button { padding: 6px 10px; border: 1px solid #667b52; border-radius: 6px; background: transparent; color: #d5e2c1; font-size: 11px; }
#win .studio-run-controls small { color: #91a282; font-size: 10px; }
#win .studio-run-controls button:hover { background: #35432c; }
#win #studio-expanded { --expanded-height: min(980px, calc(100svh - 40px)); width: min(1200px, calc(100vw - 40px)); height: var(--expanded-height); max-width: none; max-height: none; margin: auto; padding: 0; border: 1px solid var(--line-2); border-radius: 12px; background: var(--bar); color: var(--text); }
#win #studio-expanded::backdrop { background: #000b; backdrop-filter: blur(5px); }
#win #studio-expanded > .panel { position: static; width: 100%; height: 100%; max-height: none; border: 0; border-radius: 0; box-shadow: none; }
#win #studio-expanded .panel__head { flex: none; }
#win #studio-expanded .panel__head::before { display: none; }
#win #studio-expanded .studio-tabs { justify-content: center; }
#win #studio-expanded .studio-tabs button { flex: 0 1 180px; }
#win #studio-expanded .studio-content { padding: 20px; }
#win #studio-expanded .daytona-view { max-width: 1050px; margin: auto; }
#win #studio-expanded .daytona-screen { width: min(100%, calc((var(--expanded-height) - 290px) * 1.3322)); margin: auto; }
#win #studio-expanded .studio-note { text-align: center; }
#win #studio-expanded .preview-content > * { max-width: 820px; margin-inline: auto; }
#win #studio-expanded .computer-desktop { max-width: 850px; margin-inline: auto; }
#win #studio-expanded .computer-viewport { max-height: none; }
#win #studio-expanded .workbook td, #win #studio-expanded .workbook th { font-size: 12px; padding: 12px; }
#win #studio-expanded .daytona-calc .workbook th, #win #studio-expanded .daytona-calc .workbook td { padding: 5px 6px; font-size: 10px; }
#win #studio-expanded .studio-run-controls { padding-inline: 24px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#win #studio-expanded .studio-run-controls > div { margin: 0; flex: none; }
@media (max-width: 600px) {
  #win .studio-tabs { padding: 10px 8px; }
  #win .studio-tabs button { font-size: 11px; gap: 4px; }
  #win .panel__head { padding-inline: 12px; gap: 7px; }
  #win .panel__head h2 { font-size: 12px; }
  #win .studio-expand { padding: 6px 8px; font-size: 10px; }
  #win .computer-info b { font-size: 12px; }
  #win .daytona-browser-note { font-size: 9px; padding: 10px; }
  #win #studio-expanded { width: calc(100vw - 12px); height: calc(100svh - 20px); }
  #win #studio-expanded .studio-content { padding: 10px; }
  #win #studio-expanded .daytona-screen { max-height: none; width: 100%; }
  #win #studio-expanded .studio-run-controls { display: block; padding: 12px; }
  #win #studio-expanded .studio-run-controls > div { margin-top: 9px; }
  #win .workbook-ribbon { gap: 12px; }
  #win .workbook-chart > div { gap: 8px; }
  #win .workbook-chart small { font-size: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  #win .daytona-pointer.is-moving { animation: none; }
}