/* Sors Duo: the Amiga skin worn by the whole table while a special guest sits at it (colours from Daniel's Amiga palette) | games/Sors_Duo/css/amiga.css | v.0.9 */

/* VT323 (Hired Guns skin) and Jersey 10 (Chaos Engine skin), SIL Open Font License 1.1
   (fonts/OFL-VT323.txt, fonts/OFL-Jersey10.txt): pixel fonts with real Polish letters and
   clear digits, one per game (Daniel, 2026-09-27). */
@font-face { font-family: 'VT323'; src: url('../fonts/VT323-Regular.ttf') format('truetype'); font-display: swap; }
@font-face { font-family: 'Jersey 10'; src: url('../fonts/Jersey10-Regular.ttf') format('truetype'); font-display: swap; }

html.theme-amiga {
  font-synthesis: none;   /* the pixel font has one weight; no fake bold */
  /* Every colour comes from Daniel's palette (css/amiga-colors.css); the dark shades are
     palette colours mixed with black, the way the old copper lists darkened them. */
  --hg-metal: var(--amiga-gray-27);
  --hg-metal-hi: var(--amiga-light-gray);
  --hg-metal-lo: var(--amiga-gray-25);
  --hg-light: var(--amiga-off-white);
  --hg-dark: var(--amiga-gray-23);
  --hg-deep: var(--amiga-gray-21);
  --hg-teal: color-mix(in srgb, var(--amiga-teal) 35%, var(--amiga-black));
  --hg-teal-lo: color-mix(in srgb, var(--amiga-teal) 18%, var(--amiga-black));
  --hg-teal2: color-mix(in srgb, var(--amiga-teal) 60%, var(--amiga-gray-21));
  --hg-teal3: color-mix(in srgb, var(--amiga-teal) 45%, var(--amiga-silver));
  --hg-red: var(--amiga-red);
  --hg-blood: color-mix(in srgb, var(--amiga-dark-red) 35%, var(--amiga-black));
  --hg-blood2: color-mix(in srgb, var(--amiga-dark-red) 60%, var(--amiga-black));
  --hg-navy: color-mix(in srgb, var(--amiga-blue) 18%, var(--amiga-black));
  --hg-navy2: color-mix(in srgb, var(--amiga-medium-blue) 30%, var(--amiga-black));
  --hg-blue: color-mix(in srgb, var(--amiga-blue) 55%, var(--amiga-black));
  --hg-sky: var(--amiga-medium-blue);
  --hg-yellow: var(--amiga-yellow);
  --hg-green: var(--amiga-light-green);
  --hg-led-off: color-mix(in srgb, var(--amiga-dark-green) 25%, var(--amiga-black));
  --hg-font: 'VT323', 'Courier New', monospace;
  --hg-serif: Georgia, 'Times New Roman', serif;
}

/* ---------------------------------------------------------------- page */
html.theme-amiga body {
  background:
    repeating-linear-gradient(180deg, transparent 0 118px, var(--hg-navy) 118px 124px, var(--hg-navy2) 124px 126px, var(--hg-navy) 126px 132px),
    var(--amiga-black);
}
html.theme-amiga body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 30;
  background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .28) 0 1px, transparent 1px 3px);
}

/* Menu bar of the old title screen. */
.theme-amiga .topbar {
  border-bottom: 2px solid var(--hg-sky);
  background: linear-gradient(90deg, var(--hg-navy), var(--hg-blue) 30%, var(--hg-sky) 60%, var(--hg-blue));
}
.theme-amiga .brand { font-family: var(--hg-serif); font-weight: 400; color: var(--amiga-white); text-shadow: 2px 2px 0 var(--hg-navy); }
.theme-amiga .brand span { color: var(--amiga-silver); }
.theme-amiga .stat b, .theme-amiga .jackpot b, .theme-amiga .dial b, .theme-amiga .pot b { font-family: var(--hg-font); color: var(--hg-teal3); }
.theme-amiga .stat em, .theme-amiga .dial em { font-family: var(--hg-font); color: var(--hg-light); }
.theme-amiga .stat small { color: var(--hg-yellow); }
.theme-amiga .jackpot { border: 2px solid; border-color: var(--hg-light) var(--hg-deep) var(--hg-deep) var(--hg-light); border-radius: 0; background: var(--hg-teal); }
.theme-amiga .jackpot em { font-family: var(--hg-font); font-weight: 700; color: var(--hg-yellow); }
.theme-amiga .lang { font-family: var(--hg-font); color: var(--hg-light); border-color: var(--hg-teal3); }

/* ---------------------------------------------------------------- seats and machines */
.theme-amiga .seat-head { border-bottom: 2px solid var(--hg-teal2); }
.theme-amiga .seat-name { font-family: var(--hg-font); font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--amiga-orange); }
.theme-amiga .seat-stack { font-family: var(--hg-font); font-weight: 700; color: var(--hg-light); }

.theme-amiga { --hg-beige: color-mix(in srgb, var(--amiga-light-skin) 30%, var(--amiga-gray-27));
  --hg-beige-hi: color-mix(in srgb, var(--amiga-light-skin) 25%, var(--amiga-off-white));
  --hg-beige-lo: color-mix(in srgb, var(--amiga-light-skin) 20%, var(--amiga-gray-23)); }

/* The machine is a mercenary's view frame: bevelled beige metal with a rounded top left
   corner, folder tabs on the top edge, the green LED strip and the compass box, all on
   the dark red outline of the 1993 screen. The reels inside stay like the casino ones. */
.theme-amiga .cabinet {
  border: 3px solid;
  border-color: var(--hg-beige-hi) var(--hg-beige-lo) var(--hg-beige-lo) var(--hg-beige-hi);
  border-radius: 26px 6px 6px 6px;
  background:
    linear-gradient(90deg, transparent 0 8px, rgba(0, 0, 0, .12) 8px 9px, transparent 9px calc(100% - 9px), rgba(0, 0, 0, .12) calc(100% - 9px) calc(100% - 8px), transparent calc(100% - 8px)),
    linear-gradient(180deg, var(--hg-beige-hi), var(--hg-beige) 30%, var(--hg-beige-lo));
  box-shadow: 0 0 0 3px var(--hg-blood2), 0 0 0 5px var(--hg-blood), 0 14px 30px rgba(0, 0, 0, .7);
}
.theme-amiga .machine-rival .cabinet { border-color: var(--hg-beige-hi) var(--hg-beige-lo) var(--hg-beige-lo) var(--hg-beige-hi); }
/* Folder tabs along the top edge. */
.theme-amiga .cabinet::before {
  content: '';
  position: absolute;
  top: -14px;
  left: 64px;
  width: 132px;
  height: 14px;
  background:
    linear-gradient(90deg, var(--hg-beige-lo) 0 1px, var(--hg-beige) 1px 40px, var(--hg-beige-lo) 40px 41px, transparent 41px 46px,
      var(--hg-beige-lo) 46px 47px, var(--hg-beige) 47px 86px, var(--hg-beige-lo) 86px 87px, transparent 87px 92px,
      var(--hg-beige-lo) 92px 93px, var(--hg-beige) 93px 131px, var(--hg-beige-lo) 131px);
  clip-path: polygon(0 100%, 4px 0, 36px 0, 41px 100%, 46px 100%, 50px 0, 82px 0, 87px 100%, 92px 100%, 96px 0, 127px 0, 132px 100%);
}
/* The compass box in the top right corner. */
.theme-amiga .cabinet::after {
  content: 'S';
  position: absolute;
  top: 5px;
  right: 10px;
  width: 30px;
  height: 20px;
  border: 2px solid;
  border-color: var(--hg-beige-lo) var(--hg-beige-hi) var(--hg-beige-hi) var(--hg-beige-lo);
  background: linear-gradient(180deg, var(--hg-teal3), var(--amiga-white) 45%, var(--hg-teal2));
  font-family: var(--hg-font);
  font-size: 18px;
  line-height: 16px;
  text-align: center;
  color: var(--hg-teal);
}
/* The bulbs become the green LED strip left of the compass. */
.theme-amiga .bulbs {
  top: 11px;
  left: auto;
  right: 48px;
  width: 96px;
  height: 7px;
  background: repeating-linear-gradient(90deg, var(--amiga-dark-green) 0 3px, var(--hg-led-off) 3px 5px);
  border: 1px solid var(--hg-deep);
}
.theme-amiga .machine.spinning .bulbs, .theme-amiga .machine.win .bulbs {
  background: repeating-linear-gradient(90deg, var(--hg-green) 0 3px, var(--hg-led-off) 3px 5px);
  animation: hg-led .3s steps(2) infinite;
  filter: none;
}
@keyframes hg-led { 50% { opacity: .55; } }
/* The view itself, framed by the green and black hazard stripes of the corridors. */
.theme-amiga .window {
  padding: 2px;   /* 2px padding + 5px stripes = the casino's 6px + 1px, the layout stays */
  border: 5px solid transparent;
  border-image: repeating-linear-gradient(45deg, var(--amiga-dark-green) 0 6px, var(--amiga-black) 6px 12px) 5;
  background: var(--amiga-black);
  box-shadow: 0 0 0 1px var(--hg-beige-lo);
}
.theme-amiga .window::after { top: calc(2px + var(--row) * 1.5); background: linear-gradient(90deg, transparent, var(--hg-red), transparent); }
.theme-amiga .reel { background: linear-gradient(180deg, var(--amiga-black) 0%, var(--hg-teal-lo) 30%, var(--hg-teal-lo) 70%, var(--amiga-black) 100%); }
.theme-amiga .reel.hidden-reel { background: linear-gradient(180deg, var(--amiga-black) 0%, var(--hg-teal) 30%, var(--hg-teal) 70%, var(--amiga-black) 100%); }
.theme-amiga .reel.blur .strip { --reel-blur: .6px; }
.theme-amiga .reel.held { outline: 2px solid var(--hg-yellow); box-shadow: none; }
.theme-amiga .sym { font-family: var(--hg-font); font-weight: 700; text-shadow: 2px 2px 0 rgba(0, 0, 0, .35); }
.theme-amiga .sym-9 { color: var(--amiga-gray-21); }
.theme-amiga .sym-10 { color: var(--amiga-dark-green); }
.theme-amiga .sym-J { color: var(--amiga-blue); }
.theme-amiga .sym-Q { color: var(--amiga-purple); }
.theme-amiga .sym-K { color: var(--amiga-red); }
.theme-amiga .sym-A { color: var(--amiga-brown); }
.theme-amiga .reel.hidden-reel .sym-hidden { color: var(--hg-teal3); }
/* Daniel's painted symbols for this skin. */
html.art.theme-amiga .sym-9 { background-image: url('../img/sym/hg/9.png'); }
html.art.theme-amiga .sym-10 { background-image: url('../img/sym/hg/10.png'); }
html.art.theme-amiga .sym-J { background-image: url('../img/sym/hg/J.png'); }
html.art.theme-amiga .sym-Q { background-image: url('../img/sym/hg/Q.png'); }
html.art.theme-amiga .sym-K { background-image: url('../img/sym/hg/K.png'); }
html.art.theme-amiga .sym-A { background-image: url('../img/sym/hg/A.png'); }
.theme-amiga .lamp { font-family: var(--hg-font); color: var(--hg-teal3); border-color: var(--hg-deep); background: var(--hg-navy); }
.theme-amiga .lamp.on { color: var(--hg-led-off); background: var(--hg-green); border-color: var(--hg-green); box-shadow: none; }
.theme-amiga .lever-knob { background: radial-gradient(circle at 35% 30%, var(--amiga-light-skin), var(--hg-red) 55%, var(--hg-blood2)); }
.theme-amiga .lever::after { background: linear-gradient(180deg, var(--hg-light), var(--hg-dark)); }

.theme-amiga .card {
  border-radius: 2px;
  border: 2px solid;
  border-color: var(--amiga-white) var(--hg-dark) var(--hg-dark) var(--amiga-white);
  background: var(--hg-teal-lo);
  font-family: var(--hg-font);
}
.theme-amiga .card.back {
  background: repeating-linear-gradient(0deg, var(--hg-teal) 0 3px, var(--hg-teal-lo) 3px 5px);
  border-color: var(--hg-teal3) var(--hg-deep) var(--hg-deep) var(--hg-teal3);
}
.theme-amiga .hand-label { font-family: var(--hg-font); font-weight: 700; color: var(--hg-yellow); }

/* ---------------------------------------------------------------- centre */
.theme-amiga .portrait {
  border-radius: 0;
  border: 3px solid;
  border-color: var(--hg-light) var(--hg-deep) var(--hg-deep) var(--hg-light);
  box-shadow: 0 0 0 3px var(--hg-blood);
}
.theme-amiga .rival-name { font-family: var(--hg-font); font-weight: 700; text-transform: uppercase; color: var(--amiga-orange); }
.theme-amiga .rival-species, .theme-amiga .rival-trait { font-family: var(--hg-font); color: var(--hg-teal3); }
.theme-amiga .dossier-btn { font-family: var(--hg-font); color: var(--hg-light); border: 2px solid; border-color: var(--hg-light) var(--hg-deep) var(--hg-deep) var(--hg-light); background: var(--hg-dark); }
.theme-amiga .pot { border-color: var(--hg-teal2); }
.theme-amiga .pot em { font-family: var(--hg-font); background: none; -webkit-text-fill-color: currentColor; color: var(--hg-red); text-shadow: 2px 2px 0 var(--hg-blood); }
.theme-amiga { --sors-lo: var(--hg-red); --sors-hi: var(--hg-yellow); --sors-glow: color-mix(in srgb, var(--hg-red) 60%, transparent); --sors-font: var(--hg-font); --pot-glow: color-mix(in srgb, var(--hg-red) 45%, transparent); }
.theme-amiga .phase { font-family: var(--hg-font); color: var(--hg-teal3); }
.theme-amiga .result { font-family: var(--hg-font); font-weight: 700; color: var(--hg-yellow); border: 3px solid; border-color: var(--hg-light) var(--hg-deep) var(--hg-deep) var(--hg-light); background: var(--hg-teal); }
.theme-amiga .result small { font-family: var(--hg-font); color: var(--hg-light); }
/* The message bar: yellow words on dark blue. */
.theme-amiga .log { font-family: var(--hg-font); font-size: 12px; border: 2px solid var(--hg-navy2); background: var(--hg-navy); color: var(--hg-teal3); }
.theme-amiga .log li.you { color: var(--hg-light); }
.theme-amiga .log li.rival, .theme-amiga .log li.gold { color: var(--hg-yellow); }
.theme-amiga .log li.sep { color: var(--amiga-orange); border-top-color: var(--hg-navy2); }
.theme-amiga .speech {
  border-radius: 0;
  border: 2px solid var(--amiga-light-blue);
  background: var(--hg-blue);
  color: var(--hg-yellow);
  box-shadow: 3px 3px 0 var(--amiga-black);
  font-family: var(--hg-font);
  font-weight: 700;
}
.theme-amiga .bubble { font-family: var(--hg-font); border-color: var(--hg-teal3); background: var(--hg-navy); color: var(--hg-yellow); }
.theme-amiga .dossier { font-family: var(--hg-font); border: 3px solid; border-color: var(--hg-light) var(--hg-deep) var(--hg-deep) var(--hg-light); background: var(--hg-teal); color: var(--hg-teal3); }
.theme-amiga .dossier h3 { font-family: var(--hg-font); color: var(--hg-yellow); }
.theme-amiga .dossier .entry b { color: var(--hg-light); }

/* ---------------------------------------------------------------- action bar */
.theme-amiga .actions { position: relative; overflow: hidden; border-top: 2px solid var(--hg-sky); background: linear-gradient(180deg, var(--hg-navy), var(--hg-navy2)); }
@media (max-width: 700px) { .theme-amiga .actions::before { font-size: 16px; letter-spacing: 2px; } .theme-amiga .brand { font-size: 15px; } }
/* The spaced metallic letters of the old bottom band, behind the buttons. */
.theme-amiga .actions::before {
  content: 'S   O   R   S       D   U   O';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 6px;
  text-align: center;
  font-family: var(--hg-serif);
  font-weight: 700;
  font-size: 26px;
  letter-spacing: 6px;
  color: transparent;
  background: linear-gradient(180deg, var(--amiga-silver), var(--amiga-medium-blue) 60%, var(--amiga-silver));
  -webkit-background-clip: text;
  background-clip: text;
  opacity: .35;
  pointer-events: none;
  white-space: pre;
}
.theme-amiga .actions::after { content: 'Tribute to Hired Guns by DMA Design (1993)'; font-family: var(--hg-font); font-size: 16px; letter-spacing: 0; color: var(--hg-teal3); }
.theme-amiga .hint { font-family: var(--hg-font); color: var(--hg-teal3); }
.theme-amiga .btn {
  border: 2px solid;
  border-color: var(--hg-light) var(--hg-deep) var(--hg-deep) var(--hg-light);
  border-radius: 0;
  background: var(--hg-metal);
  color: var(--amiga-dark-brown);
  font-family: var(--hg-font);
  font-weight: 700;
}
.theme-amiga .btn:hover:not(:disabled) { color: var(--amiga-black); background: var(--hg-metal-hi); border-color: var(--amiga-white) var(--hg-deep) var(--hg-deep) var(--amiga-white); }
.theme-amiga .btn-gold { color: var(--amiga-dark-red); }
.theme-amiga .btn-gold:hover:not(:disabled) { color: var(--hg-red); }
.theme-amiga .chip { border-radius: 0; font-family: var(--hg-font); background: var(--hg-navy); color: var(--hg-teal3); border-color: var(--hg-teal2); }
.theme-amiga .chip.on { color: var(--hg-yellow); border-color: var(--hg-yellow); }
.theme-amiga .slider { accent-color: var(--hg-teal2); }

/* Effects keep their meaning, in the old colours. */
.theme-amiga .fx-banner {
  border-color: var(--hg-sky);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0), var(--hg-blue) 12%, var(--hg-sky) 50%, var(--hg-blue) 88%, rgba(0, 0, 0, 0));
  color: var(--amiga-white);
  font-family: var(--hg-serif);
  font-weight: 400;
  text-shadow: 3px 3px 0 var(--hg-navy);
}
.theme-amiga .fx-chip { background: radial-gradient(circle, var(--hg-light) 0 3px, var(--hg-red) 3.5px 6px, var(--hg-light) 6.5px 7px, var(--hg-red) 7.5px); border-radius: 2px; }

/* Achievement toasts. */
.theme-amiga .toast { border: 3px solid; border-color: var(--hg-light) var(--hg-deep) var(--hg-deep) var(--hg-light); background: var(--hg-teal); box-shadow: none; }
.theme-amiga .toast b, .theme-amiga .toast small, .theme-amiga .toast span { font-family: var(--hg-font); font-size: 17px; line-height: 1.5; color: var(--hg-yellow); }

/* ---------------------------------------------------------------- pixel font sizes */
/* Every pixel font text gets a size that keeps the layout still. */
.theme-amiga .stat b, .theme-amiga .jackpot b, .theme-amiga .dial b, .theme-amiga .pot b { font-size: 16px; letter-spacing: 1px; }
.theme-amiga .pot b { font-size: 19px; letter-spacing: 3px; }
.theme-amiga .stat em, .theme-amiga .dial em { font-size: 20px; }
.theme-amiga .stat small { font-size: 16px; }
.theme-amiga .jackpot em { font-size: 22px; }
.theme-amiga .lang { font-size: 17px; }
.theme-amiga .seat-name { font-size: 20px; letter-spacing: 0; }
.theme-amiga .seat-stack { font-size: 21px; }
.theme-amiga .sym { font-size: 36px; }
.theme-amiga .card { font-size: 34px; }
.theme-amiga .hand-label { font-size: 18px; }
.theme-amiga .lamp { font-size: 14px; letter-spacing: 1px; padding: 3px 0; }
.theme-amiga .rival-name { font-size: 20px; letter-spacing: 0; }
.theme-amiga .rival-species, .theme-amiga .rival-trait { font-size: 14px; letter-spacing: 0; }
.theme-amiga .dossier-btn { font-size: 14px; letter-spacing: 1px; }
.theme-amiga .pot em { font-size: 48px; }
.theme-amiga .phase { font-size: 16px; letter-spacing: 1px; }
.theme-amiga .result { font-size: 21px; line-height: 1.5; }
.theme-amiga .result small { font-size: 16px; line-height: 1.6; }
.theme-amiga .log { font-size: 16px; line-height: 1.9; }
.theme-amiga .speech { font-size: 16px; line-height: 1.7; }
.theme-amiga .bubble { font-size: 16px; }
.theme-amiga .dossier { font-size: 16px; line-height: 1.8; }
.theme-amiga .dossier h3 { font-size: 18px; }
.theme-amiga .hint { font-size: 16px; }
.theme-amiga .btn { font-size: 17px; letter-spacing: 0; padding: 12px 14px; }
.theme-amiga .btn small { font-size: 14px; }
.theme-amiga .chip { font-size: 16px; }
