/* Optional Easter eggs. All classes are scoped and removable by reset/Escape. */
.egg-effect-layer { position: fixed; inset: 0; z-index: 30; pointer-events: none; overflow: hidden; }
.egg-particle { position: absolute; left: var(--x); top: -8%; font: 700 var(--size)/1 monospace; opacity: .75; animation: egg-fall var(--duration) linear var(--delay) infinite; text-shadow: 0 0 14px currentColor; }
.egg-particle--space { top: var(--y); animation: egg-drift var(--duration) ease-in-out var(--delay) infinite alternate; }
.egg-particle--fireworks { top: var(--y); animation: egg-burst var(--duration) ease-out var(--delay) infinite; }
.egg-particle--meteor { animation-name: egg-meteor; font-size: 50px; }
.egg-particle--holi, .egg-particle--splatoon { top: var(--y); filter: blur(2px); animation: egg-splash .8s ease-out both; opacity: .35; }
.egg-particle--heart { animation-name: egg-rise; top: 105%; }
.egg-particle--dog, .egg-particle--cat { top: var(--y); transform: rotate(-25deg); animation: egg-paw 5s ease-in-out var(--delay) infinite; }
.egg-particle--sonic { color: #e5bc75 !important; animation: egg-ring 3s ease-in-out var(--delay) infinite; }
.egg-particle--mario { color: #e5bc75 !important; }
.egg-particle--matrix { color: #56e77d !important; opacity: .28; text-shadow: 0 0 4px currentColor; }
.egg-tilt { transform: rotate(2.5deg); }
.egg-mirror { transform: scaleX(-1); }
.egg-space { animation: egg-shell-float 6s ease-in-out infinite alternate; }
.egg-underwater { filter: hue-rotate(25deg); animation: egg-water 5s ease-in-out infinite alternate; }
.egg-blink .output-line { animation: egg-blink 2s steps(1, end) infinite; }
.egg-rainbow .output-line, .egg-rainbow .output-command { background: linear-gradient(90deg, #f1808f, #e5bc75, #a0e5aa, #73dce9, #c4a0ff); background-clip: text; -webkit-background-clip: text; color: transparent; }
.egg-matrix .terminal-body { background: #020d07; }
.egg-matrix .output-line, .egg-matrix .output-command, .egg-matrix .command-input { color: #56e77d; text-shadow: 0 0 5px #56e77d55; }
.egg-retro .terminal-window { border-radius: 0; border-color: #888; box-shadow: 7px 7px 0 #000; }
.egg-retro .window-header, .egg-retro .window-footer { background: #bdbdbd; color: #111; }
.egg-retro .identity h1, .egg-retro .identity p, .egg-retro .window-footer a { color: #111; }
.egg-retro .terminal-body { background: #000071; }
.egg-retro .output-line, .egg-retro .output-command { color: #fff; }
.egg-font-comic, .egg-font-comic * { font-family: 'Comic Sans MS', 'Comic Sans', cursive !important; }
.egg-font-courier, .egg-font-courier * { font-family: 'Courier New', Courier, monospace !important; }
.egg-binary .output-line { letter-spacing: .12em; color: #a0e5aa; font-variant-numeric: tabular-nums; }
.egg-ascii .terminal-window, .egg-ascii .identity-icon, .egg-ascii .enter-key { border-radius: 0; border-style: dashed; box-shadow: none; }
.egg-ascii .terminal-body { background: #000; }
.egg-pride .terminal-window { border-image: linear-gradient(135deg, #e66565, #e5bc75, #e9e36f, #79ce89, #73a5e9, #bb8de8) 1; }
.egg-portal .terminal-body { box-shadow: inset 30px 0 40px -38px #f6ad51, inset -30px 0 40px -38px #60c6f6; }
.egg-dusted { opacity: 0; filter: blur(7px); visibility: hidden; pointer-events: none; transition: opacity 1s, filter 1s, visibility 0s 1s; }
.egg-glitch-label { position: absolute; top: 25%; left: 0; right: 0; text-align: center; color: #73dce9; font: 700 clamp(40px, 10vw, 120px)/1 monospace; text-shadow: 12px 2px #f1808f88, -12px -2px #73dce988; }
.egg-crawl { position: absolute; inset: 30% 12% auto; color: #e5bc75; font: 600 clamp(24px, 5vw, 60px)/1.8 monospace; text-align: center; transform-origin: 50% 100%; animation: egg-crawl 12s linear infinite; }
.egg-moon { position: absolute; top: 12%; left: -20%; color: #deded2; font: 150px/1 serif; text-shadow: 0 0 30px #ffffff44; animation: egg-moon 14s linear infinite; }
.egg-moon--2 { top: 26%; font-size: 70px; animation-delay: -6s; animation-duration: 20s; opacity: .65; }
.egg-eclipse { position: absolute; inset: 0; display: grid; place-items: center; background: #000b; animation: egg-eclipse 6s ease-in-out both; }
.egg-eclipse::after { content: ''; display: block; width: min(32vw, 220px); aspect-ratio: 1; background: #030407; border-radius: 50%; box-shadow: 0 0 8px 3px #fff8e6, 0 0 45px 8px #ffe2a7aa; }
@keyframes egg-crawl { from { transform: perspective(500px) rotateX(45deg) translateY(150%); opacity: 1; } to { transform: perspective(500px) rotateX(45deg) translateY(-200%); opacity: 0; } }
@keyframes egg-moon { to { left: 115%; } }
@keyframes egg-eclipse { 0%, 100% { opacity: 0; } 20%, 80% { opacity: 1; } }
.egg-bat-signal { position: absolute; top: 5%; right: 10%; display: grid; place-items: center; width: 180px; height: 100px; border-radius: 50%; background: #e5bc75; color: #111; font: 900 80px/1 monospace; box-shadow: 0 0 80px 30px #e5bc7555; transform: rotate(-20deg); }
.egg-dvd { position: absolute; top: 8%; left: 4%; padding: 12px 18px; max-width: 94%; box-sizing: border-box; overflow-wrap: anywhere; text-align: center; font: italic 900 clamp(20px, 3.5vw, 38px)/1 monospace; color: #73dce9; border: 3px solid currentColor; border-radius: 50%; animation: egg-dvd-x 9s linear infinite alternate, egg-dvd-y 6s linear infinite alternate, egg-dvd-color 7s steps(1) infinite; }
.egg-motion-paused .terminal-window { outline: 2px dotted #e5bc75; outline-offset: -5px; }
.egg-marquee { position: absolute; top: 45%; left: 0; width: max-content; max-width: none; padding: 12px 18px; color: #73dce9; background: #0b1016ed; border-block: 1px solid #395866; font: 600 clamp(16px, 3vw, 30px)/1.5 var(--mono, monospace); animation: egg-marquee 12s linear infinite; }
.egg-kerning .output-line, .egg-kerning .output-command { letter-spacing: var(--egg-letter-spacing, .45em); }
.egg-monochrome { filter: grayscale(1); }
.egg-aurora { position: absolute; inset: 0; opacity: .35; background: radial-gradient(ellipse at 20% 0, #68edc6 0, transparent 50%), radial-gradient(ellipse at 70% 0, #a184ff 0, transparent 55%), radial-gradient(ellipse at 50% 100%, #3287e5 0, transparent 60%); animation: egg-aurora 8s ease-in-out infinite alternate; }
.egg-festivus-pole { position: absolute; left: 24px; top: 10%; bottom: 8%; width: 13px; border-radius: 6px 6px 0 0; background: linear-gradient(90deg, #777, #ddd 40%, #888 85%); box-shadow: 7px 8px 12px #0006; }
.egg-festivus-pole::after { content: ''; position: absolute; bottom: -4px; left: -16px; width: 45px; height: 7px; background: #aaa; border-radius: 50%; }
@keyframes egg-marquee { from { transform: translateX(100vw); } to { transform: translateX(-100%); } }
@keyframes egg-aurora { to { transform: scale(1.2) skewX(8deg); filter: hue-rotate(30deg); } }
@keyframes egg-fall { from { transform: translate(0, -10vh) rotate(0); } to { transform: translate(var(--drift), 120vh) rotate(360deg); } }
@keyframes egg-rise { to { transform: translate(var(--drift), -120vh) rotate(-20deg); opacity: 0; } }
@keyframes egg-drift { to { transform: translate(var(--drift), -30px); opacity: .3; } }
@keyframes egg-burst { 0%, 15% { transform: scale(.1); opacity: 0; } 35% { transform: scale(2.2); opacity: 1; } 70%, 100% { transform: scale(3); opacity: 0; } }
@keyframes egg-meteor { from { transform: translate(-25vw, -15vh) rotate(35deg); } to { transform: translate(90vw, 100vh) rotate(35deg); } }
@keyframes egg-splash { from { transform: scale(0); } to { transform: scale(1); } }
@keyframes egg-paw { 0%, 100% { opacity: .1; } 40%, 75% { opacity: .55; } }
@keyframes egg-ring { 0% { transform: translate(-20vw, 35vh) scaleX(.3); opacity: 0; } 35%, 65% { opacity: 1; } 100% { transform: translate(110vw, 35vh) scaleX(1); opacity: 0; } }
@keyframes egg-shell-float { to { transform: translateY(-12px) rotate(-1deg); } }
@keyframes egg-water { to { transform: skewX(.7deg) translateY(4px); filter: hue-rotate(50deg); } }
@keyframes egg-blink { 0%, 85% { opacity: 1; } 86%, 100% { opacity: .12; } }
@keyframes egg-dvd-x { to { left: 100%; transform: translateX(-100%); } }
@keyframes egg-dvd-y { to { top: 100%; translate: 0 -100%; } }
@keyframes egg-dvd-color { 0% { color: #73dce9; } 25% { color: #f1808f; } 50% { color: #a0e5aa; } 75% { color: #e5bc75; } }

.egg-modal-layer { position: fixed; inset: 0; z-index: 60; display: flex; justify-content: center; align-items: center; padding: 18px; background: #020408d9; backdrop-filter: blur(5px); }
.egg-dialog { width: min(100%, 610px); max-height: 94dvh; overflow: auto; padding: clamp(16px, 3vw, 27px); border: 1px solid #47717e; border-radius: 14px; background: #10161d; color: #e6edf4; box-shadow: 0 25px 100px #0009; font: 14px/1.5 var(--mono, monospace); scrollbar-color: #3c5363 transparent; }
.egg-dialog:focus { outline: none; }
.egg-dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.egg-dialog-title { margin: 0; font: 600 clamp(17px, 3vw, 21px)/1.4 var(--mono, monospace); }
.egg-dialog-content { display: flex; flex-direction: column; align-items: stretch; gap: 16px; }
.egg-status { min-height: 3em; margin: 14px 0 18px; color: #adbfce; font-size: 13px; }
.egg-button { border: 1px solid #395866; border-radius: 7px; padding: 9px 13px; min-height: 39px; color: #b8edf2; background: #142630; font: inherit; line-height: 1.3; cursor: pointer; touch-action: manipulation; }
.egg-button:hover:not(:disabled) { border-color: #73dce9; background: #1b3440; }
.egg-button:disabled { cursor: default; }
.egg-button:focus-visible, .egg-input:focus-visible, .egg-canvas:focus-visible { outline: 2px solid #c4f2f7; outline-offset: 3px; }
.egg-close { flex-shrink: 0; font-size: 12px; padding: 6px 9px; min-height: 32px; }
.egg-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 9px; }
.egg-label { color: #8fa6b7; }
.egg-input { max-width: 100%; width: 100%; padding: 10px 12px; color: #e6edf4; background: #0b1016; border: 1px solid #395866; border-radius: 6px; font: inherit; }
.egg-controls .egg-input { width: 105px; }
.egg-input[type="color"] { width: 100%; height: 50px; padding: 4px; cursor: pointer; }
.egg-big-result { display: grid; place-items: center; min-height: 130px; font: 600 clamp(34px, 8vw, 64px)/1.2 var(--mono, monospace); color: #73dce9; text-align: center; font-variant-numeric: tabular-nums; }
.egg-chance-coin { border: 2px solid #e5bc75; color: #e5bc75; border-radius: 50%; width: 180px; height: 180px; align-self: center; font-size: 28px; }
.egg-breath-orb { display: grid; place-items: center; width: 150px; height: 150px; margin: 25px auto; border: 1px solid #73dce9; background: #173b47; color: #c8f6fa; border-radius: 50%; transition: transform 4s linear, background 4s linear; font-size: 20px; }
.egg-breath-expanded { transform: scale(1.25); background: #245563; }
.egg-metronome-dot { width: 70px; height: 70px; border: 1px solid #73dce9; border-radius: 50%; margin: 15px auto; background: #19313a; }
.egg-beat-on { background: #73dce9; box-shadow: 0 0 30px #73dce955; }
.egg-calculator-result { display: block; min-height: 60px; padding: 14px; border: 1px solid #26333e; background: #0b1016; color: #a0e5aa; font: 24px/1.3 var(--mono, monospace); text-align: right; overflow-wrap: anywhere; }
.egg-keypad { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.egg-keypad .egg-button { min-height: 45px; font-size: 20px; }
.egg-color-swatch { height: 110px; border-radius: 8px; border: 1px solid #395866; }
.egg-color-values { margin: 0; white-space: pre-wrap; line-height: 1.9; color: #c8d8e4; }
.egg-lamps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.egg-lamp { height: 90px; color: #5a4b37; font-size: 45px; border-color: #5a4b37; background: #1c1813; }
.egg-lamp-lit { color: #ffce70; border-color: #e5bc75; box-shadow: 0 0 24px #ffbb4933; background: radial-gradient(ellipse at center, #735528, #1c1813 80%); }
.egg-dreidel { width: 130px; height: 150px; min-height: 0; align-self: center; border: 2px solid #73dce9; border-radius: 20px 20px 45px 45px; background: #17323d; }
.egg-canvas { display: block; align-self: center; width: min(100%, 400px); height: auto; aspect-ratio: 1; border: 1px solid #395866; border-radius: 6px; background: #0b1016; image-rendering: auto; touch-action: none; }
.egg-dpad { display: grid; grid-template-columns: repeat(3, 48px); grid-template-rows: repeat(2, 43px); gap: 5px; align-self: center; }
.egg-dpad .egg-button:first-child { grid-column: 2; }
.egg-dpad .egg-button:nth-child(2) { grid-column: 1; grid-row: 2; }
.egg-dpad .egg-button:nth-child(3) { grid-column: 2; grid-row: 2; }
.egg-dpad .egg-button:nth-child(4) { grid-column: 3; grid-row: 2; }
.egg-tictactoe { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; width: min(100%, 340px); align-self: center; }
.egg-tic-cell { aspect-ratio: 1; padding: 0; font-size: clamp(30px, 8vw, 52px); color: #73dce9; background: #0b1016; }
.egg-mine-board { display: grid; grid-template-columns: repeat(8, 1fr); gap: 3px; width: min(100%, 400px); align-self: center; }
.egg-mine-cell { padding: 0; min-height: 0; aspect-ratio: 1; border-radius: 3px; background: #233744; font: 600 clamp(12px, 3.5vw, 22px)/1 var(--mono, monospace); }
.egg-mine-open { background: #0b1016; border-color: #1c2b35; }
.egg-mine-open[data-count="1"] { color: #73dce9; }
.egg-mine-open[data-count="2"] { color: #a0e5aa; }
.egg-mine-open[data-count="3"], .egg-mine-open[data-count="4"] { color: #f1808f; }
.egg-zerg-arena { height: 360px; position: relative; background: #0b1016; border: 1px solid #26333e; border-radius: 6px; overflow: hidden; }
.egg-zerg-arena::after { content: 'TERMINAL'; position: absolute; inset: auto 0 8px; text-align: center; color: #395866; letter-spacing: .25em; font-size: 18px; pointer-events: none; }
.egg-zerg-enemy { position: absolute; z-index: 1; top: 0; width: 42px; height: 42px; padding: 0; border: 0; background: transparent; color: #f1808f; font: 700 32px/1 monospace; }
.egg-zerg-enemy:hover:not(:disabled) { background: #f1808f22; }
.egg-solitaire { width: 100%; user-select: none; }
.egg-solitaire-top, .egg-solitaire-columns { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.egg-solitaire-top { margin-bottom: 18px; }
.egg-solitaire-column { position: relative; }
.egg-card { display: block; width: 100%; height: 68px; padding: 6px 4px; text-align: left; color: #dce8ef; background: #17252e; border-color: #45606d; border-radius: 5px; font: 600 clamp(11px, 2.5vw, 18px)/1.1 var(--mono, monospace); }
.egg-solitaire-column > .egg-card:not(.egg-card-slot) { position: absolute; }
.egg-card-red { color: #f1808f; }
.egg-card-back { color: #51798c; background: repeating-linear-gradient(45deg, #16313c 0px, #16313c 3px, #112530 3px, #112530 6px); }
.egg-card-stock { color: #73dce9; }
.egg-card-slot { border-style: dashed; background: #0b1016; color: #38515f; }
.egg-card-selected { border-color: #e5bc75; box-shadow: 0 0 0 1px #e5bc75 inset; background-color: #354031; }
@media (max-width: 480px) {
  .egg-modal-layer { padding: 8px; }
  .egg-dialog { max-height: 96dvh; padding: 14px; border-radius: 10px; }
  .egg-dialog-header { gap: 8px; }
  .egg-close { font-size: 11px; padding: 5px 7px; }
  .egg-status { font-size: 12px; }
  .egg-solitaire-top, .egg-solitaire-columns { gap: 3px; }
  .egg-card { height: 58px; padding: 5px 2px; }
}
@media (prefers-reduced-motion: reduce) {
  .egg-particle, .egg-space, .egg-underwater, .egg-blink .output-line, .egg-dvd, .egg-marquee, .egg-aurora, .egg-crawl, .egg-moon, .egg-eclipse { animation: none !important; }
  .egg-moon { left: 30%; }
  .egg-moon--2 { left: 65%; }
  .egg-crawl { transform: none; }
  .egg-particle { top: var(--y); transform: none; opacity: .35; }
  .egg-breath-orb, .egg-dusted { transition: none; }
  .egg-breath-expanded { transform: none; background: #306574; }
}