/* Physical screen layers stay in viewport space, above the emitted image. */
.lcd-display-surface, .lcd-display-ghosts {
  position: fixed; inset: 0; pointer-events: none; user-select: none;
  overflow: hidden; contain: strict;
}
.lcd-display-surface {
  z-index: 10003; isolation: isolate;
  --lcd-room-light: radial-gradient(ellipse at var(--lcd-light-x, 35%) var(--lcd-light-y, 20%), #e3e9df30, transparent 59%), radial-gradient(ellipse at 85% 12%, #e0e6d633, transparent 60%);
}
.lcd-display-surface[hidden], .lcd-display-ghosts[hidden] { display: none; }
.lcd-display-surface > div { position: absolute; inset: 0; }
.lcd-display-panel {
  opacity: var(--lcd-panel, .35);
  background:
    radial-gradient(ellipse at 3% 94%, #b9caa52b, transparent 52%),
    radial-gradient(ellipse at 100% 5%, #bbc8e82b, transparent 48%),
    linear-gradient(180deg, #070e201a, transparent 38%, #b5ac8020),
    #a1a9ad0d;
  box-shadow: inset 0 0 70px #0005, inset 0 -2px 12px #d3d7af12;
}
.lcd-display-backlight {
  opacity: var(--lcd-uneven, .3);
  background:
    radial-gradient(ellipse 24% 31% at 0% 77%, #adbbc329, transparent 90%),
    radial-gradient(ellipse 33% 18% at 69% 100%, #c3bd9824, transparent 85%),
    radial-gradient(ellipse 17% 36% at 100% 19%, #a2b4ce20, transparent 90%),
    radial-gradient(ellipse 22% 13% at 24% 0%, #c4c7ad1a, transparent 85%);
}
.lcd-display-matte {
  opacity: calc(var(--lcd-matte, .3) * .12);
  background-size: 128px 128px;
}
.lcd-display-matte::after {
  content: ''; position: absolute; inset: 0; background: inherit;
  mask-image: radial-gradient(ellipse at var(--lcd-light-x, 35%) var(--lcd-light-y, 20%), #000, transparent 65%);
}
.lcd-display-angle {
  inset: -12% !important;
  opacity: calc(var(--lcd-angle, .25) * var(--lcd-angle-response, .25));
  background:
    radial-gradient(ellipse at var(--lcd-view-x, 50%) var(--lcd-view-y, 35%), #c6d6c52e, transparent 72%),
    linear-gradient(180deg, #14162a40, transparent 45%, #bfac7926);
}
.lcd-display-surface .lcd-display-reflection {
  inset: -8%; opacity: var(--lcd-reflection, .22);
  transform: translate(var(--lcd-reflect-x, 0px), var(--lcd-reflect-y, 0px));
  background: var(--lcd-room-light);
}
.lcd-display-reflection::after {
  content: ''; position: absolute; top: 3%; left: 13%; width: 36%; height: 65%;
  transform: skew(-19deg) rotate(-9deg); filter: blur(14px);
  background: linear-gradient(90deg, transparent 48.8%, #151b2466 49% 51%, transparent 51.2%),
    linear-gradient(0deg, transparent 48.8%, #151b2455 49% 51%, transparent 51.2%),
    linear-gradient(135deg, #dce5e450, #dce5e40a);
  mask-image: linear-gradient(#0008, transparent);
}
.lcd-display-wear { opacity: var(--lcd-wear, .18); background-size: 100% 100%; }
.lcd-display-lit-dust {
  opacity: var(--lcd-lit-dust, 0);
  mask-size: 100% 100%; mask-repeat: no-repeat;
}
.lcd-display-lit-dust::before {
  content: ''; position: absolute; inset: -8%;
  transform: translate(var(--lcd-light-offset-x, 0px), var(--lcd-light-offset-y, 0px));
  background: radial-gradient(ellipse at 35% 20%, #fff9e8, #e0e6d644 38%, transparent 63%), radial-gradient(ellipse at 85% 12%, #e0e6d688, transparent 60%);
}
.lcd-display-bezel {
  opacity: var(--lcd-bezel, .45);
  filter: blur(var(--lcd-bezel-blur, 0px));
  border: var(--lcd-bezel-size, 2.7px) solid #08090b;
  box-sizing: border-box;
  box-shadow: inset 0 2px 1px #000b, inset 0 0 3px 2px #0009, inset 0 0 16px #0006;
}
.lcd-display-bezel::after {
  content: ''; position: absolute; inset: -1px; border: 1px solid;
  border-color: #0009 #ffffff0a #ffffff22 #0007;
}
.lcd-display-ghosts { z-index: 9995; }
.lcd-display-ghost { position: absolute; inset: 0; pointer-events: none; }
.lcd-display-frame { position: absolute; pointer-events: none; }
.lcd-snapshot-context { position: static !important; width: auto; height: 0; min-height: 0; }
.lcd-display-dark-response { filter: url('#lcd-dark-response-filter'); }
.lcd-display-ghost *, .lcd-display-ghost *::before, .lcd-display-ghost *::after {
  animation: none !important; transition: none !important; caret-color: transparent !important;
}
.lcd-display-ghost .crt-tools { display: none !important; }
.lcd-controls { border-top: 1px solid var(--terminal-rule, #ffffff20); padding-top: 12px; margin-top: 12px; }
.lcd-controls > summary { color: var(--terminal-accent, #ef5754); cursor: pointer; margin-bottom: 14px; }
.lcd-controls label { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 10px 0 5px; }
.lcd-controls input[type='range'] { display: block; width: 100%; accent-color: var(--terminal-accent, #ef5754); }
.lcd-controls input[type='checkbox'] { width: 16px; height: 16px; margin: 0; accent-color: var(--terminal-accent, #ef5754); }
.lcd-controls output { color: var(--terminal-muted, #aaa6ae); }
.lcd-controls p { color: var(--terminal-muted, #aaa6ae); font-size: 12px; line-height: 1.6; margin: 8px 0; }
.lcd-controls button { color: var(--terminal-accent, #ef5754); background: none; border: 1px solid var(--terminal-rule, #ffffff20); padding: 7px 9px; cursor: pointer; font: inherit; margin: 6px 5px 0 0; }
.lcd-controls button:disabled { opacity: .4; cursor: default; }
.lcd-controls input:disabled { opacity: .4; }
.lcd-controls :is(button, input, summary):focus-visible { outline: 1px solid var(--terminal-accent, #ef5754); outline-offset: 3px; }
.lcd-post-settings { position: fixed; bottom: 12px; right: 18px; z-index: 40; font: 13px/1.5 monospace; color: var(--terminal-text, #dedce4); }
.lcd-post-settings > summary { cursor: pointer; list-style: none; color: var(--terminal-muted, #aaa6ae); }
.lcd-post-settings > div { position: absolute; bottom: 30px; right: 0; width: min(300px, calc(100vw - 36px)); max-height: calc(100svh - 100px); overflow-y: auto; padding: 18px; box-sizing: border-box; background: var(--terminal-bg, #101115); border: 1px solid var(--terminal-accent, #ef5754); box-shadow: 0 12px 32px #0008; }
.lcd-post-settings .lcd-controls { border: 0; margin: 0; padding: 0; }
.lcd-post-settings > div { scrollbar-width: thin; scrollbar-color: var(--terminal-accent, #ef5754) var(--terminal-bg, #101115); }
@media (prefers-reduced-motion: reduce) { .lcd-display-ghosts { display: none; } .lcd-display-reflection { transform: none !important; } }