/* =====================================================================
   GoDartsPro : MICO-factor concept                                v2.0.0
   /wp-content/themes/dart/assets/css/gdp-mico.css

   Loaded AFTER gdp-game.css, which keeps the tokens, the stats tab and
   panel, the flash, the full screen button and the Scolia badge. This
   file is the MICO-factor games' own look, the "instrument":
     - a 0 to 40 ruler along the top of the frame, with the player's
       MICO-factor in the game marked on it;
     - a fine measuring grid instead of the crowd photograph;
     - MICO steel (#c7ced3) for scales and quiet lines, the site's amber
       for the needle and what is chosen, green for go;
     - five notches for the five sessions that give a MICO-factor;
     - numbers in IBM Plex Mono where they are read as measurements.
   One rule for every screen: one main number, one goal, one next action.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Anton&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

.gdp-mico-root{
  --mico-steel:#c7ced3;
  --mico-steel-2:#8d9398;
  --mico-line:#2f3336;
  --mico-ground:#0b0c0d;
  --mico-card:rgba(18,18,18,.9);
  --mico-warm:rgba(35,26,10,.92);
  --mico-warm-line:rgba(255,164,0,.45);
  --mico-gold:#ffd451;
  --mico-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
/* Room above the frame for the full screen button (and the Scolia badge),
   which sit half above the frame's top border: half a badge (17px) plus
   a clear margin, so nothing above the game can cut them. */
.gdp.gdp-mico-root{padding-top:calc(var(--gdp-badge-h, 34px) / 2 + 13px);overflow-x:clip;}
.gdp .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.gdp .gdp-mico .is-hidden{display:none !important;}

/* ---------- the frame: measuring paper ---------- */
.gdp .gdp-wrap.gdp-mico{
  /* Layers, top first: the MICO dial as a faint watermark in the lower
     right (0 to 40, a major tick every 5 = the 8 bands, a needle), a
     warm glow under the ruler, the GoDartsPro line (rising 18 degrees left
     to right through the middle, 3px #FFA400 at 0.2), then the measuring
     grid. */
  --mico-dial:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 320'%3E%3Cpath d='M38 300 A262 262 0 0 1 562 300' fill='none' stroke='%23c7ced3' stroke-opacity='.10' stroke-width='2'/%3E%3Cpath d='M82 300 A218 218 0 0 1 518 300' fill='none' stroke='%23c7ced3' stroke-opacity='.05' stroke-width='1'/%3E%3Cline x1='38.0' y1='300.0' x2='68.0' y2='300.0' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='38.8' y1='279.4' x2='51.8' y2='280.5' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='41.2' y1='259.0' x2='54.1' y2='261.0' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='45.2' y1='238.8' x2='57.9' y2='241.9' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='50.8' y1='219.0' x2='63.2' y2='223.1' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='57.9' y1='199.7' x2='85.7' y2='211.2' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='66.6' y1='181.1' x2='78.1' y2='187.0' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='76.6' y1='163.1' x2='87.7' y2='169.9' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='88.0' y1='146.0' x2='98.6' y2='153.6' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='100.8' y1='129.8' x2='110.7' y2='138.3' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='114.7' y1='114.7' x2='136.0' y2='136.0' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='129.8' y1='100.8' x2='138.3' y2='110.7' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='146.0' y1='88.0' x2='153.6' y2='98.6' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='163.1' y1='76.6' x2='169.9' y2='87.7' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='181.1' y1='66.6' x2='187.0' y2='78.1' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='199.7' y1='57.9' x2='211.2' y2='85.7' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='219.0' y1='50.8' x2='223.1' y2='63.2' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='238.8' y1='45.2' x2='241.9' y2='57.9' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='259.0' y1='41.2' x2='261.0' y2='54.1' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='279.4' y1='38.8' x2='280.5' y2='51.8' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='300.0' y1='38.0' x2='300.0' y2='68.0' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='320.6' y1='38.8' x2='319.5' y2='51.8' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='341.0' y1='41.2' x2='339.0' y2='54.1' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='361.2' y1='45.2' x2='358.1' y2='57.9' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='381.0' y1='50.8' x2='376.9' y2='63.2' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='400.3' y1='57.9' x2='388.8' y2='85.7' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='418.9' y1='66.6' x2='413.0' y2='78.1' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='436.9' y1='76.6' x2='430.1' y2='87.7' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='454.0' y1='88.0' x2='446.4' y2='98.6' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='470.2' y1='100.8' x2='461.7' y2='110.7' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='485.3' y1='114.7' x2='464.0' y2='136.0' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='499.2' y1='129.8' x2='489.3' y2='138.3' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='512.0' y1='146.0' x2='501.4' y2='153.6' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='523.4' y1='163.1' x2='512.3' y2='169.9' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='533.4' y1='181.1' x2='521.9' y2='187.0' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='542.1' y1='199.7' x2='514.3' y2='211.2' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='549.2' y1='219.0' x2='536.8' y2='223.1' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='554.8' y1='238.8' x2='542.1' y2='241.9' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='558.8' y1='259.0' x2='545.9' y2='261.0' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='561.2' y1='279.4' x2='548.2' y2='280.5' stroke='%23c7ced3' stroke-opacity='.07' stroke-width='1'/%3E%3Cline x1='562.0' y1='300.0' x2='532.0' y2='300.0' stroke='%23c7ced3' stroke-opacity='.13' stroke-width='2'/%3E%3Cline x1='300' y1='300' x2='347.6' y2='101.6' stroke='%23c7ced3' stroke-opacity='.10' stroke-width='3' stroke-linecap='round'/%3E%3Ccircle cx='300' cy='300' r='9' fill='%23c7ced3' fill-opacity='.10'/%3E%3C/svg%3E");
  background-color:var(--mico-ground);
  background-image:
    var(--mico-dial),
    radial-gradient(ellipse 60% 220px at 50% 0, rgba(255,164,0,.07), transparent 70%),
    linear-gradient(-18deg, transparent calc(50% - 2px), rgba(255,164,0,.2) calc(50% - 1px), rgba(255,164,0,.2) calc(50% + 1px), transparent calc(50% + 2px)),
    linear-gradient(rgba(199,206,211,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199,206,211,.07) 1px, transparent 1px),
    linear-gradient(rgba(199,206,211,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199,206,211,.032) 1px, transparent 1px);
  background-repeat:no-repeat, no-repeat, no-repeat, repeat, repeat, repeat, repeat;
  background-size:760px auto, 100% 100%, 100% 100%, 80px 80px, 80px 80px, 16px 16px, 16px 16px;
  background-position:right -150px bottom -40px, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0;
  border-color:rgba(199,206,211,.24);
  /* No clipping on the frame: the full screen button and the Scolia badge
     sit half above its top border, and Safari's overflow-x:clip cuts them
     (it clips the top as well). The sideways clip is on the game area
     around it (.gdp-mico-root), which includes the room above the frame. */
  overflow:visible;
  min-height:680px;
  padding-top:44px;
}
/* Crown Judgement: the crown from the game cover as a large watermark,
   barely visible, behind everything. The dial is left out here so the
   two marks do not overlap. */
.gdp .gdp-wrap.gdp-mico[data-app="41"]{isolation:isolate;}
.gdp .gdp-wrap.gdp-mico[data-app="41"]:not(.is-playing){background-image:
    radial-gradient(ellipse 60% 220px at 50% 0, rgba(255,164,0,.07), transparent 70%),
    linear-gradient(-18deg, transparent calc(50% - 2px), rgba(255,164,0,.2) calc(50% - 1px), rgba(255,164,0,.2) calc(50% + 1px), transparent calc(50% + 2px)),
    linear-gradient(rgba(199,206,211,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199,206,211,.07) 1px, transparent 1px),
    linear-gradient(rgba(199,206,211,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199,206,211,.032) 1px, transparent 1px);
  background-repeat:no-repeat, no-repeat, repeat, repeat, repeat, repeat;
  background-size:100% 100%, 100% 100%, 80px 80px, 80px 80px, 16px 16px, 16px 16px;
  background-position:0 0, 0 0, 0 0, 0 0, 0 0, 0 0;}
.gdp .gdp-wrap.gdp-mico[data-app="41"]::before{
  content:"";position:absolute;inset:56px 4% 4%;z-index:-1;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-33 -27 66 48'%3E%3Cpath d='M-30 18L-30 -16L-14 0L0 -24L14 0L30 -16L30 18Z' fill='none' stroke='%23D9B45A' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity:.06;}
/* While playing, the dial steps back: the number and the keys lead. */
.gdp .gdp-wrap.gdp-mico.is-playing{
  background-image:
    radial-gradient(ellipse 60% 220px at 50% 0, rgba(255,164,0,.05), transparent 70%),
    linear-gradient(-18deg, transparent calc(50% - 2px), rgba(255,164,0,.2) calc(50% - 1px), rgba(255,164,0,.2) calc(50% + 1px), transparent calc(50% + 2px)),
    linear-gradient(rgba(199,206,211,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199,206,211,.06) 1px, transparent 1px),
    linear-gradient(rgba(199,206,211,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199,206,211,.028) 1px, transparent 1px);
  background-repeat:no-repeat, no-repeat, repeat, repeat, repeat, repeat;
  background-size:100% 100%, 100% 100%, 80px 80px, 80px 80px, 16px 16px, 16px 16px;
  background-position:0 0, 0 0, 0 0, 0 0, 0 0, 0 0;
}
@media (max-width:600px){
  .gdp .gdp-wrap.gdp-mico{background-size:440px auto, 100% 100%, 100% 100%, 80px 80px, 80px 80px, 16px 16px, 16px 16px;
    background-position:right -120px bottom -10px, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0;}
}
/* The removing-darts popup must not widen the page. */
.gdp .gdp-wrap.gdp-mico .dart-retrieve-container{left:0;right:0;width:auto;max-width:100%;margin-left:0;margin-right:0;box-sizing:border-box;}
.gdp .gdp-wrap.gdp-mico .gdp-retrieve{width:600px;max-width:100%;box-sizing:border-box;}
/* Your stats on setup and the result only. */
.gdp .gdp-wrap.gdp-mico.is-playing .gdp-statstab{display:none;}

/* ---------- the ruler along the top ---------- */
.gdp-mico-ruler{
  position:absolute;left:20px;right:20px;top:14px;height:14px;pointer-events:none;
  background:
    repeating-linear-gradient(90deg, rgba(199,206,211,.55) 0 1px, transparent 1px 12.5%) bottom / 100% 14px no-repeat,
    repeating-linear-gradient(90deg, rgba(199,206,211,.32) 0 1px, transparent 1px 2.5%) bottom / 100% 7px no-repeat;
  border-bottom:1px solid rgba(199,206,211,.32);
}
.gdp-mico-ruler-band{
  position:absolute;bottom:0;width:12.5%;height:14px;
  background:linear-gradient(180deg, rgba(255,164,0,0), rgba(255,164,0,.22));
  border-bottom:2px solid rgba(255,164,0,.75);
  transition:left .8s cubic-bezier(.16,1,.3,1);
}
.gdp-mico-ruler-band.is-hidden{display:none;}
.gdp-mico-ruler-mark{
  position:absolute;bottom:-6px;width:3px;height:22px;margin-left:-1px;border-radius:2px;
  background:var(--gdp-accent);box-shadow:0 0 0 3px rgba(255,164,0,.18);
  transition:left .8s cubic-bezier(.16,1,.3,1);
}

/* ---------- type and pieces ---------- */
.gdp-mico-label{font-family:var(--gdp-font);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#a3a3a3;}
.gdp-mico-label.is-accent{color:#ffc04d;}
.gdp-mico-muted,.gdp-mico .is-muted{color:var(--mico-steel-2);}
.gdp-mico-chip{
  display:inline-flex;align-items:center;height:26px;padding:0 12px;border-radius:99px;
  border:1px solid var(--mico-steel);color:var(--gdp-ink);
  font-family:var(--gdp-font);font-size:13px;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;
}
.gdp-mico-notches{display:flex;gap:6px;}
.gdp-mico-notches i{width:16px;height:9px;border-radius:2px;border:1px solid #4a4f53;box-sizing:border-box;}
.gdp-mico-notches i.is-on{background:var(--gdp-accent);border-color:var(--gdp-accent);}
.gdp-mico-notches.is-full i{background:var(--gdp-go);border-color:var(--gdp-go);}
.gdp-mico-notches.is-wide{gap:8px;}
.gdp-mico-notches.is-wide i{flex:1 1 0;height:12px;}

.gdp-mico-lockup{display:flex;align-items:center;gap:10px;}
.gdp-mico-lockup-t{display:flex;flex-direction:column;gap:2px;}
.gdp-mico-lockup-t b{font-family:var(--gdp-font);font-size:15px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;}
.gdp-mico-lockup-t small{font-family:var(--gdp-font);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:#b9c0c5;}
.gdp-mico-mark{width:30px;height:30px;flex:none;}
.gdp-mico-mark.is-small{width:24px;height:24px;}
.gdp-mico-mark path,.gdp-mico-mark circle{fill:none;stroke-linecap:round;}
.gdp-mico-mark .a{stroke:var(--mico-steel);stroke-width:1.6;}
.gdp-mico-mark .b{stroke:var(--gdp-accent);stroke-width:2.6;}
.gdp-mico-mark .c{stroke:#fff;stroke-width:2.2;}
.gdp-mico-mark circle{fill:#fff;stroke:none;}
.gdp-mico-lockup.is-small{margin-bottom:22px;}

/* ---------- buttons ---------- */
.gdp-mico-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:0 22px;border-radius:10px;cursor:pointer;
  font-family:var(--gdp-font);font-size:16px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  background:transparent;border:1px solid #3a3f43;color:#e6e9eb;text-decoration:none;
  transition:background .15s,border-color .15s,transform .1s;
}
.gdp a.gdp-mico-btn,.gdp a.gdp-mico-btn:hover,.gdp a.gdp-mico-btn:visited{color:#e6e9eb;text-decoration:none;}
.gdp-mico-btn:hover{border-color:var(--mico-steel);}
.gdp-mico-btn:active{transform:scale(.98);}
.gdp-mico-btn.is-go{background:var(--gdp-go);border-color:var(--gdp-go);color:#fff;}
.gdp-mico-btn.is-go:hover{background:var(--gdp-go-hi);border-color:var(--gdp-go-hi);}
.gdp-mico-btn.is-big{min-height:60px;padding:0 44px;font-size:21px;}
.gdp-mico-btn:focus-visible,.gdp-mico-iconbtn:focus-visible,.gdp-mico-key:focus-visible,.gdp-mico-linkbtn:focus-visible,.gdp-mico-next:focus-visible{outline:2px solid var(--gdp-accent);outline-offset:2px;}
.gdp-mico-iconbtn{
  width:48px;height:48px;flex:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
  border-radius:10px;background:#1a1b1c;border:1px solid var(--mico-line);color:var(--mico-steel);font-size:18px;
}
.gdp-mico-iconbtn:hover{color:#fff;border-color:#4a4f53;}
.gdp-mico-start .gdp-mico-iconbtn{width:60px;height:60px;}
.gdp-mico-linkbtn{background:none;border:0;padding:6px 2px;cursor:pointer;font-family:var(--gdp-font-note);font-size:14px;color:#c7ced3;text-decoration:underline;text-underline-offset:3px;}
.gdp-mico-linkbtn:hover{color:#fff;}
.gdp-mico-linkbtn.is-danger{color:#ff8a84;}

/* ---------- setup ---------- */
.gdp-mico-setup{padding:8px 24px 18px;}
.gdp-mico-setup-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:56px;align-items:center;margin-top:40px;}
.gdp-mico-title{
  font-family:var(--gdp-font);font-weight:600;text-transform:uppercase;letter-spacing:-.005em;
  font-size:clamp(56px,8.6vw,104px);line-height:.86;margin:0 0 18px;text-shadow:0 4px 26px rgba(0,0,0,.7);
}
.gdp-mico-title span{color:var(--gdp-accent);display:block;}
.gdp-mico-lede{font-family:var(--gdp-font-note);font-weight:300;font-size:17px;line-height:1.5;color:#d7d7d7;max-width:40ch;margin:0 0 26px;}
.gdp-mico-start{display:flex;gap:12px;align-items:center;}
.gdp-mico-folds{display:flex;gap:26px;flex-wrap:wrap;margin-top:18px;}
.gdp-mico-fold > summary{
  list-style:none;cursor:pointer;font-family:var(--gdp-font-note);font-size:14px;color:#a9afb3;
  text-decoration:underline;text-underline-offset:3px;
}
.gdp-mico-fold > summary::-webkit-details-marker{display:none;}
.gdp-mico-fold[open] > summary{color:#fff;}
.gdp-mico-foldbody{margin-top:12px;padding:14px 16px;border-radius:12px;background:var(--mico-card);border:1px solid var(--mico-line);
  font-family:var(--gdp-font-note);font-size:14px;line-height:1.5;color:#d4d8db;max-width:520px;}
.gdp-mico-foldbody p{margin:8px 0 0;}
.gdp-mico-rules{margin:0;padding-left:20px;}
.gdp-mico-rules li{margin:4px 0;}
.gdp-mico-darts select{max-width:260px;}
.gdp-mico-darts .app-header-s{display:none;}

.gdp-mico-card{
  display:flex;flex-direction:column;gap:16px;padding:28px 30px;border-radius:18px;
  background:var(--mico-warm);border:1px solid var(--mico-warm-line);
}
.gdp-mico-card-big{font-family:var(--gdp-font);font-size:38px;font-weight:600;line-height:1.02;}
.gdp-mico-card-row{display:flex;align-items:center;gap:16px;}
.gdp-mico-card-mico{font-family:var(--mico-mono);font-size:58px;font-weight:500;line-height:1;}
.gdp-mico-card-t{font-family:var(--gdp-font-note);font-size:15px;line-height:1.45;color:#e2d6bd;}
.gdp-mico-card-t.is-muted{color:#cbb894;font-size:14px;}
.gdp a.gdp-mico-card-league{font-family:var(--gdp-font-note);font-size:13px;color:#cbb894;text-decoration:underline;text-underline-offset:3px;}

.gdp-mico-resume{
  display:flex;flex-direction:column;gap:8px;margin:0 0 22px;padding:16px 18px;border-radius:14px;
  border:1px solid var(--mico-steel);background:rgba(20,21,22,.92);max-width:520px;
}
.gdp-mico-resume b{font-family:var(--gdp-font);font-size:20px;letter-spacing:.04em;}
.gdp-mico-resume span{font-family:var(--gdp-font-note);font-size:14px;color:#d4d8db;}
.gdp-mico-resume-actions{display:flex;align-items:center;gap:16px;margin-top:4px;}

/* ---------- play ---------- */
.gdp-mico-play{padding:0 20px 10px;}
/* Crown Judgement: two progress bars at the bottom, section and session. */
.gdp-mico-progs{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:14px;row-gap:6px;align-items:center;
  padding:11px 20px 13px;border-top:1px solid var(--mico-line);background:rgba(10,12,14,.55);z-index:2;border-radius:0 0 inherit inherit;}
.gdp .gdp-wrap.gdp-mico[data-app="41"]{position:relative;}
.gdp-mico:not(.is-playing) .gdp-mico-progs{display:none;}
.gdp .gdp-wrap.gdp-mico[data-app="41"].is-playing{padding-bottom:70px;}
@media (max-width:600px){
  .gdp .gdp-wrap.gdp-mico[data-app="41"].is-playing{padding-bottom:58px;}
  .gdp-mico-progs{padding:9px 12px 11px;column-gap:10px;}
}
@media (orientation:landscape) and (max-height:520px){
  .gdp .gdp-wrap.gdp-mico[data-app="41"].is-playing{padding-bottom:52px;}
  .gdp-mico-progs{padding:7px 14px 9px;row-gap:5px;}
}
.gdp-mico-prog{display:contents;}
.gdp-mico-prog-name{font-family:var(--gdp-font);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#FFA400;white-space:nowrap;}
.gdp-mico-prog.is-all .gdp-mico-prog-name{color:var(--mico-steel-2);}
.gdp-mico-prog-track{position:relative;display:block;height:4px;border-radius:2px;background:rgba(199,206,211,.12);overflow:hidden;}
.gdp-mico-prog-track i{position:absolute;inset:0 auto 0 0;width:0;border-radius:2px;background:#FFA400;transition:width .4s ease;}
.gdp-mico-prog.is-all .gdp-mico-prog-track i{background:rgba(199,206,211,.75);}
.gdp-mico-prog-fig{font-family:var(--mico-mono);font-size:12px;color:var(--mico-steel-2);text-align:right;white-space:nowrap;min-width:9ch;}
@media (prefers-reduced-motion: reduce){ .gdp-mico-prog-track i{transition:none;} }
.gdp-mico-bar{display:flex;align-items:center;gap:16px;height:52px;margin-bottom:22px;}
.gdp-mico-bar-name{font-family:var(--gdp-font);font-size:18px;letter-spacing:.06em;text-transform:uppercase;flex:1;}
.gdp-mico-bar-fig{font-family:var(--mico-mono);font-size:18px;min-width:64px;text-align:right;}
.gdp-mico-bar-fig.is-time{color:#a9afb3;min-width:72px;}
/* The play screen is one grid. Computer and tablet landscape: the number
   and the total on the left, the keys (or the Scolia boxes) on the right,
   the six numbers 7 to 12 in a wide row along the bottom. One column on
   a phone or a tablet in portrait; two compact columns on a phone in
   landscape (see the media queries at the end). */
.gdp-mico-stage{display:grid;grid-template-columns:minmax(0,1fr) 360px;grid-template-rows:auto 1fr auto;
  grid-template-areas:"now pad" "total pad" "strip strip";column-gap:44px;row-gap:26px;align-items:start;}
.gdp-mico-hero{display:contents;}
.gdp-mico-now{grid-area:now;min-width:0;}
.gdp-mico-strip{grid-area:strip;}
.gdp-mico-totalrow{grid-area:total;align-self:end;}
/* While playing, the play screen fills the frame (full screen too), so
   the row of numbers and results sits at the bottom of it. */
.gdp .gdp-wrap.gdp-mico.is-playing{display:flex;flex-direction:column;}
.gdp-mico.is-playing .gdp-mico-play{flex:1 1 auto;display:flex;flex-direction:column;}
.gdp-mico.is-playing .gdp-mico-stage{flex:1 1 auto;}
.gdp-mico-pad{grid-area:pad;min-width:0;}
.gdp-mico-dartslot:not(.is-pad){grid-column:1 / -1;}
.gdp-mico-now{display:flex;align-items:center;gap:28px;}
.gdp-mico-num{
  width:190px;height:190px;flex:none;border-radius:50%;border:3px solid var(--mico-steel);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--gdp-font);font-size:124px;font-weight:600;line-height:1;
  box-shadow:inset 0 0 0 12px rgba(199,206,211,.05);
}
.gdp-mico-ask{display:flex;flex-direction:column;gap:10px;min-width:0;}
.gdp-mico-q{font-family:var(--gdp-font);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:#ffc04d;}
/* Crown Check-Outs with a board: a bust, until the darts are removed. */
.gdp-mico.is-co-bust .gdp-mico-q{color:#ff8a84;}
.gdp-mico.is-co-bust .gdp-mico-num{color:#ff8a84;border-color:rgba(255,90,82,.7);}
.gdp-mico-eq{display:flex;align-items:baseline;gap:16px;font-family:var(--mico-mono);font-size:76px;line-height:1;}
.gdp-mico-eq i{font-style:normal;color:#7f868b;font-size:52px;}
.gdp-mico-play[data-phase] .gdp-mico-eq-h,.gdp-mico .gdp-mico-eq-h{color:#fff;}
.gdp-mico-eq-s{color:#6b7277;}
.gdp-mico[data-phase="hits"] .gdp-mico-eq-h{color:var(--mico-gold);border-bottom:3px solid var(--gdp-accent);padding:0 6px;}
.gdp-mico[data-phase="score"] .gdp-mico-eq-s{color:var(--mico-gold);border-bottom:3px solid var(--gdp-accent);padding:0 6px;}
.gdp-mico-eq-r{font-family:var(--mico-mono);font-size:22px;color:#a9afb3;min-height:28px;}

/* --mico-n: the game's count of numbers (6 Exponential, 7 Pivot), set on the element. */
.gdp-mico-strip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--mico-n,6),minmax(0,1fr));gap:14px;}
.gdp-mico-strip li{
  height:108px;border-radius:12px;box-sizing:border-box;border:1px dashed #4a4f53;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
}
.gdp-mico-strip b{font-family:var(--gdp-font);font-size:44px;font-weight:600;line-height:1;color:#6b7277;}
.gdp-mico-strip span{font-family:var(--mico-mono);font-size:20px;color:#6b7277;min-height:24px;}
.gdp-mico-strip li.is-done{border:1px solid #3a3f43;background:rgba(20,20,20,.9);}
.gdp-mico-strip li.is-done b{color:#fff;}
.gdp-mico-strip li.is-done span{color:var(--mico-steel);}
.gdp-mico-strip li.is-now{border:2px solid var(--gdp-accent);background:var(--mico-warm);}
.gdp-mico-strip li.is-now b,.gdp-mico-strip li.is-now span{color:var(--mico-gold);}

.gdp-mico-totalrow{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;}
.gdp-mico-total{font-family:var(--mico-mono);font-size:48px;font-weight:500;line-height:1;}
.gdp-mico-totalrow .gdp-mico-muted{font-family:var(--gdp-font-note);font-size:14px;}
.gdp-mico-dartslot:empty{display:none;}
.gdp-mico-dartslot .dart-detail-container{margin:0;}
/* The MICO games keep the three dart boxes in view the whole session
   (they are reset at every takeout), so their own HIDE link goes. */
.gdp-mico .js-hide-autotrack-darts{display:none;}
/* Compact boxes of the same size everywhere, so Undo stays on screen on
   a short phone. */
.gdp-mico .dart-detail-container{top:auto !important;padding-top:0 !important;}
.gdp-mico .dart-detail-container .row{max-width:none !important;margin:0 -4px !important;}
.gdp-mico .dart-detail-wrapper{padding:0 4px !important;}
.gdp-mico .dart-detail{min-height:0 !important;height:auto !important;padding:10px 4px !important;text-align:center;}
.gdp-mico .js-dart-detail-score{font-size:30px !important;line-height:1.1 !important;font-family:var(--mico-mono);}
.gdp-mico .js-dart-detail-hit{font-size:15px !important;line-height:1.3 !important;min-height:1.3em;}
.gdp-mico .js-dart-distance{display:none !important;}
.gdp-mico-dartslot.is-pad:empty{display:none;}

/* No clock in the MICO games: the time still counts (it is saved with
   the session), it is just not shown. */
.gdp-mico-bar-fig.is-time{display:none;}

/* With a Scolia board the darts come from the board: the number buttons
   wait behind "Show buttons" (for a dart the board missed). */
.gdp-mico-keytoggle{display:none;align-self:flex-start;}

/* The phase slide: a very large white number ("7") or SCORING crosses
   the game frame from left to right, fast in, slow through the middle,
   fast out (about 2 seconds), over a light dimming. It never takes a
   click and goes at the first key or dart. Shared by the MICO games. */
/* z-index above the Scolia dart boxes (1185 in gdp-game.css), the board
   status and the ribbons (1200 to 1210); below Your stats (1400) and the
   site's dialogs (1500). */
.gdp-mico-slide{position:absolute;inset:0;z-index:1300;overflow:hidden;pointer-events:none;border-radius:inherit;
  display:flex;align-items:center;visibility:hidden;}
.gdp-mico-slide::before{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.72) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.2) 100%);opacity:0;}
.gdp-mico-slide-in{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;transform:translateX(-100%);}
.gdp-mico-slide b{display:block;font-family:var(--gdp-font);font-weight:600;color:#fff;line-height:.86;
  font-size:clamp(170px, 44vh, 400px);letter-spacing:-.01em;font-variant-numeric:tabular-nums;
  text-shadow:0 10px 50px rgba(0,0,0,.75);}
.gdp-mico-slide.is-score b{font-size:clamp(70px, 14vw, 210px);line-height:1;letter-spacing:.04em;text-transform:uppercase;}
.gdp-mico-slide span{margin-top:14px;font-family:var(--gdp-font);font-size:clamp(13px,1.6vw,18px);letter-spacing:.3em;text-transform:uppercase;
  color:var(--mico-gold);text-shadow:0 2px 12px rgba(0,0,0,.9);}
.gdp-mico-slide.is-run{visibility:visible;}
.gdp-mico-slide.is-run .gdp-mico-slide-in{animation:gdpMicoSlide 2s both;}
.gdp-mico-slide.is-run::before{animation:gdpMicoDim 2s both;}
.gdp-mico-slide.is-out{opacity:0;transition:opacity .16s ease;}
@keyframes gdpMicoSlide{
  0%{transform:translateX(-100%);animation-timing-function:cubic-bezier(.1,.75,.25,1);}
  30%{transform:translateX(-4%);animation-timing-function:linear;}
  70%{transform:translateX(4%);animation-timing-function:cubic-bezier(.75,0,.9,.25);}
  100%{transform:translateX(100%);}
}
@keyframes gdpMicoDim{0%{opacity:0;}22%{opacity:1;}78%{opacity:1;}100%{opacity:0;}}
@media (max-width:600px){
  .gdp-mico-slide b{font-size:clamp(150px, 46vw, 260px);}
  .gdp-mico-slide.is-score b{font-size:clamp(54px, 16vw, 90px);}
}
@media (prefers-reduced-motion:reduce){
  .gdp-mico-slide.is-run .gdp-mico-slide-in{animation:gdpMicoFade 2s both;}
  @keyframes gdpMicoFade{0%{opacity:0;transform:none;}15%{opacity:1;transform:none;}85%{opacity:1;transform:none;}100%{opacity:0;transform:none;}}
}
.gdp-mico.is-scolia .gdp-mico-keytoggle{display:inline-flex;}
.gdp-mico.is-scolia:not(.is-keys) .gdp-mico-keys{display:none;}
/* Crown Check-Outs typed in: what the points are. Under the question
   on a computer or tablet; a short row by the keys on a phone. */
.gdp-mico-cohint{margin:14px 0 0;padding:9px 12px;border:1px solid var(--mico-line);border-radius:10px;background:rgba(255,164,0,.05);display:grid;row-gap:4px;max-width:380px;}
.gdp-mico-cohint > div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;}
.gdp-mico-cohint dt{font-family:var(--gdp-font-note);font-size:13px;font-weight:400;color:var(--mico-steel);}
.gdp-mico-cohint dd{margin:0;font-family:var(--mico-mono);font-size:15px;color:#FFA400;white-space:nowrap;}
.gdp-mico-cohint .is-short{display:none;}
.gdp-mico-cohint.is-pad{display:none;}
.gdp-mico.is-scolia:not(.is-keys) .gdp-mico-cohint{display:none !important;}
@media (max-width:600px), (orientation:landscape) and (max-height:520px){
  .gdp-mico-cohint.is-hero{display:none;}
  .gdp-mico-cohint.is-pad:not(.is-hidden){display:flex;}
  .gdp-mico-cohint.is-pad{flex:1 0 100%;flex-wrap:wrap;justify-content:space-between;column-gap:8px;row-gap:2px;margin:6px 0 0;padding:4px 8px;max-width:none;}
  .gdp-mico-cohint.is-pad > div{gap:4px;white-space:nowrap;}
  .gdp-mico-cohint.is-pad .is-long{display:none;}
  .gdp-mico-cohint.is-pad .is-short{display:inline;}
  .gdp-mico-cohint.is-pad dt{font-size:11px;line-height:1.15;}
  .gdp-mico-cohint.is-pad dd{font-size:14px;}
}

.gdp-mico-pad{display:flex;flex-direction:column;gap:10px;}
.gdp-mico-padhead{display:flex;justify-content:space-between;align-items:center;}
.gdp-mico-tracked{font-family:var(--gdp-font);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gdp-win);}
.gdp-mico-field{
  display:flex;align-items:center;justify-content:center;height:78px;border-radius:12px;
  background:#0b0b0b;border:1px solid var(--gdp-frame);font-family:var(--mico-mono);font-size:48px;color:#fff;
}
.gdp-mico-warn{min-height:0;font-family:var(--gdp-font-note);font-size:13.5px;color:#ff8a84;}
.gdp-mico-warn.is-on{min-height:20px;}
.gdp-mico-keys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.gdp-mico-key{
  height:64px;border-radius:10px;cursor:pointer;background:var(--gdp-panel2);border:1px solid var(--gdp-line);color:var(--gdp-ink);
  font-family:var(--gdp-font);font-size:26px;font-variant-numeric:tabular-nums;transition:background .1s;
}
.gdp-mico-key:active{background:var(--gdp-accent);color:var(--gdp-accent-ink);}
.gdp-mico-key.is-del{font-size:20px;color:var(--mico-steel);}
.gdp-mico-key.is-enter{background:var(--gdp-go);border-color:var(--gdp-go);color:#fff;font-size:17px;font-weight:600;letter-spacing:.08em;}
.gdp-mico-key.is-enter:active{background:var(--gdp-go-hi);}
/* The hits step: one key is the hits, so the field, Enter and Delete
   step aside (the question above already shows "? x ?"). */
.gdp-mico[data-phase="hits"] .gdp-mico-field,
.gdp-mico[data-phase="hits"] .gdp-mico-padhead .gdp-mico-label{display:none;}
/* The hits step: one key is the hits, so Enter and Delete step aside. */
.gdp-mico[data-phase="hits"] .gdp-mico-key.is-enter,
.gdp-mico[data-phase="hits"] .gdp-mico-key.is-del{visibility:hidden;}
/* The "steps" games (one value per step): the value under the question,
   no "x ?" step; one key for small values (keys that cannot be the value
   are greyed out), digits and Enter for points. */
.gdp-mico[data-kind="steps"] .gdp-mico-eq i,
.gdp-mico[data-kind="steps"] .gdp-mico-eq-s{display:none;}
.gdp-mico[data-kind="steps"] .gdp-mico-eq-h{color:var(--mico-gold);border-bottom:3px solid var(--gdp-accent);padding:0 6px;}
.gdp-mico[data-kind="steps"][data-input="key"] .gdp-mico-field,
.gdp-mico[data-kind="steps"][data-input="key"] .gdp-mico-padhead .gdp-mico-label{display:none;}
.gdp-mico[data-kind="steps"][data-input="key"] .gdp-mico-key.is-enter,
.gdp-mico[data-kind="steps"][data-input="key"] .gdp-mico-key.is-del{visibility:hidden;}
.gdp-mico .gdp-mico-key.is-off{opacity:.22;pointer-events:none;}
/* Labels longer than a number (D 20-20-B, S2, T8 fit; longer ones shrink). */
.gdp-mico-num{flex-direction:column;}
.gdp-mico-num small{display:block;font-size:max(13px,.17em);letter-spacing:.06em;font-weight:500;color:var(--mico-steel);margin-top:.1em;line-height:1;}
.gdp-mico-strip b small{display:block;font-size:clamp(10px,1vw,13px);font-weight:500;color:inherit;opacity:.8;margin-top:3px;letter-spacing:.02em;white-space:nowrap;}
.gdp-mico-num.is-word{font-size:clamp(28px,4.4vw,52px);line-height:1.05;text-align:center;padding:0 10px;}
.gdp-mico-strip li.is-word b{font-size:clamp(12px,1.25vw,17px);letter-spacing:.02em;white-space:nowrap;}
.gdp-mico-st-nums > div.is-word b{font-size:15px;white-space:nowrap;}
@media (max-width:860px){ .gdp-mico-strip{grid-template-columns:repeat(var(--mico-n2,var(--mico-n,6)),minmax(0,1fr));} }

/* Pivot Bundle's bull step is one key too (0 to 6): no field, Enter or
   Delete, and 7 to 9 cannot be bulls. */
.gdp-mico[data-second="bull"][data-phase="score"] .gdp-mico-field,
.gdp-mico[data-second="bull"][data-phase="score"] .gdp-mico-padhead .gdp-mico-label{display:none;}
.gdp-mico[data-second="bull"][data-phase="score"] .gdp-mico-key.is-enter,
.gdp-mico[data-second="bull"][data-phase="score"] .gdp-mico-key.is-del{visibility:hidden;}
.gdp-mico[data-second="bull"][data-phase="score"] .gdp-mico-key[data-k="7"],
.gdp-mico[data-second="bull"][data-phase="score"] .gdp-mico-key[data-k="8"],
.gdp-mico[data-second="bull"][data-phase="score"] .gdp-mico-key[data-k="9"]{opacity:.22;pointer-events:none;}
.gdp-mico-undo{
  height:44px;border-radius:9px;cursor:pointer;background:transparent;border:1px solid #3a3f43;color:var(--mico-steel);
  font-family:var(--gdp-font);font-size:14px;letter-spacing:.1em;
}
.gdp-mico-undo:disabled{opacity:.35;cursor:default;}
.gdp-mico-save{min-height:20px;font-family:var(--gdp-font-note);font-size:12.5px;color:var(--mico-steel-2);}
.gdp-mico-save.is-bad{color:#ff8a84;}

/* ---------- result ---------- */
.gdp-mico-result{padding:40px 24px 20px;}
.gdp-mico-res-wait{display:flex;flex-direction:column;align-items:center;gap:10px;padding:80px 0;}
.gdp-mico-res-big{font-family:var(--mico-mono);font-size:84px;font-weight:500;line-height:1;}
.gdp-mico-res.is-progress{display:flex;flex-direction:column;align-items:center;gap:26px;max-width:560px;margin:0 auto;text-align:center;}
.gdp-mico-res-score{display:flex;flex-direction:column;align-items:center;gap:8px;}
.gdp-mico-res-card{
  width:100%;display:flex;flex-direction:column;align-items:center;gap:14px;padding:22px 24px;border-radius:16px;
  background:var(--mico-warm);border:1px solid var(--mico-warm-line);font-family:var(--gdp-font-note);font-size:15px;color:#e2d6bd;
}
.gdp-mico-res-card b{font-family:var(--gdp-font);font-size:28px;color:#fff;font-weight:600;}
.gdp-mico-res-card .gdp-mico-notches{width:100%;max-width:340px;}
.gdp-mico-res-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;}
.gdp-mico-res.is-mico{display:grid;grid-template-columns:400px minmax(0,1fr);gap:50px;align-items:center;}
.gdp-mico-res-gauge{position:relative;width:400px;height:248px;}
.gdp-mico-gauge{display:block;width:100%;height:auto;}
.gdp-mico-gauge .t{fill:none;stroke:#262626;}
.gdp-mico-gauge .v{fill:none;stroke:var(--gdp-accent);}
.gdp-mico-gauge .k{stroke:var(--mico-steel);stroke-width:1.4;}
.gdp-mico-gauge .m{stroke:#5b6166;stroke-width:1;}
.gdp-mico-gauge .n{stroke:#fff;stroke-width:2.6;stroke-linecap:round;}
.gdp-mico-gauge text{font-family:var(--mico-mono);font-size:14px;fill:#7f868b;text-anchor:middle;}
.gdp-mico-res-gaugev{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:6px;}
.gdp-mico-res-gaugev b{font-family:var(--mico-mono);font-size:64px;font-weight:500;line-height:1;}
.gdp-mico-res-text{display:flex;flex-direction:column;gap:14px;}
.gdp-mico-badges{display:flex;gap:8px;flex-wrap:wrap;}
.gdp-mico-badges:empty{display:none;}
.gdp-mico-badge{height:30px;padding:0 12px;border-radius:7px;display:inline-flex;align-items:center;font-family:var(--gdp-font);font-size:14px;letter-spacing:.12em;}
.gdp-mico-badge.is-go{background:var(--gdp-go);color:#fff;}
.gdp-mico-badge.is-gold{border:1px solid rgba(255,212,81,.6);color:var(--mico-gold);}
.gdp-mico-res-h{margin:0;font-family:var(--gdp-font);font-size:44px;line-height:.98;font-weight:600;text-transform:uppercase;}
.gdp-mico-res-line,.gdp-mico-res-goal,.gdp-mico-res-pub{margin:0;font-family:var(--gdp-font-note);font-size:17px;line-height:1.45;color:#d4d8db;}
.gdp-mico-res-goal{color:#ffc04d;}
.gdp-mico-res-pub{color:var(--mico-steel);font-size:15px;}
.gdp-mico-res-actions.is-split{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:stretch;margin-top:40px;}
.gdp-mico-res-actions.is-split > .gdp-mico-btn{align-self:center;}
.gdp a.gdp-mico-next,.gdp a.gdp-mico-next:hover,.gdp a.gdp-mico-next:visited{color:#fff;text-decoration:none;}
.gdp-mico-next{
  display:flex;align-items:center;gap:20px;padding:16px 22px;border-radius:14px;
  background:var(--mico-warm);border:1px solid rgba(255,164,0,.5);transition:border-color .15s;
}
.gdp-mico-next:hover{border-color:var(--gdp-accent);}
.gdp-mico-next-t{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0;}
.gdp-mico-next-t b{font-family:var(--gdp-font);font-size:26px;font-weight:600;line-height:1;}
.gdp-mico-next-why{font-family:var(--gdp-font-note);font-size:14px;color:#e2d6bd;}
.gdp-mico-next-go{height:52px;padding:0 26px;border-radius:10px;background:var(--gdp-go);display:flex;align-items:center;
  font-family:var(--gdp-font);font-size:17px;font-weight:600;letter-spacing:.08em;flex:none;}
.gdp a.gdp-mico-alllink{display:inline-block;margin-top:16px;font-family:var(--gdp-font-note);font-size:13px;color:var(--mico-steel-2);text-decoration:underline;}
/* "All MICO games" opens the other games right here, as small buttons. */
.gdp button.gdp-mico-alllink{display:inline-flex;align-items:center;gap:6px;margin-top:16px;background:none;border:0;padding:4px 0;cursor:pointer;
  font-family:var(--gdp-font-note);font-size:13px;color:var(--mico-steel-2);text-decoration:underline;text-underline-offset:3px;}
.gdp-mico-games-toggle i{font-size:.8em;transition:transform .25s;}
.gdp-mico-games-toggle[aria-expanded="true"] i{transform:rotate(180deg);}
.gdp-mico-games{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .28s ease,opacity .2s ease,margin .28s ease;margin-top:0;width:100%;}
.gdp-mico-games.is-open{grid-template-rows:1fr;opacity:1;margin-top:14px;}
.gdp-mico-games-in{overflow:hidden;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;}
.gdp a.gdp-mico-game{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;align-items:center;
  padding:9px 12px;border-radius:10px;border:1px solid var(--mico-line);background:rgba(20,20,20,.85);color:var(--gdp-ink);text-decoration:none;
  text-align:left;transition:border-color .15s,background .15s;}
.gdp a.gdp-mico-game:hover,.gdp a.gdp-mico-game:focus-visible{border-color:var(--gdp-accent);background:var(--mico-warm);}
.gdp-mico-game-no{grid-row:1 / 3;font-family:var(--mico-mono);font-size:13px;color:var(--mico-steel-2);}
.gdp-mico-game b{font-family:var(--gdp-font);font-weight:500;font-size:15px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gdp-mico-game em{font-style:normal;font-family:var(--gdp-font-note);font-size:12px;color:var(--mico-steel-2);}
.gdp-mico-game.is-started em{color:var(--mico-gold);}
.gdp-mico-game.is-set em{color:var(--mico-steel);}
@media (max-width:600px){ .gdp-mico-games-in{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (prefers-reduced-motion:reduce){ .gdp-mico-games,.gdp-mico-games-toggle i{transition:none;} }

/* ---------- exit ---------- */
.gdp-mico-exit{position:absolute;inset:0;z-index:1300;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.72);border-radius:var(--gdp-radius);padding:20px;}
.gdp-mico-exit-panel{max-width:440px;width:100%;padding:26px 26px 22px;border-radius:16px;background:#141516;border:1px solid var(--mico-line);
  box-shadow:0 30px 80px rgba(0,0,0,.6);}
.gdp-mico-exit-panel h3{margin:0 0 8px;font-family:var(--gdp-font);font-size:26px;}
.gdp-mico-exit-panel p{margin:0 0 18px;font-family:var(--gdp-font-note);font-size:14.5px;line-height:1.5;color:#c7ced3;}
.gdp-mico-exit-actions{display:flex;flex-direction:column;gap:10px;}
.gdp-mico-exit-actions .gdp-mico-linkbtn{align-self:center;margin-top:4px;}

/* ---------- Your stats ---------- */
.gdp-mico-stats .gdp-stats-head h2 small{font-size:14px;color:var(--mico-steel-2);letter-spacing:.06em;margin-left:8px;}
.gdp-mico-st-figs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px;}
.gdp-mico-st-figs > div{padding:14px 16px;border-radius:12px;background:var(--mico-card);border:1px solid var(--mico-line);display:flex;flex-direction:column;gap:8px;align-items:flex-start;}
.gdp-mico-st-figs b{font-family:var(--mico-mono);font-size:30px;font-weight:500;line-height:1;}
.gdp-mico-st-figs b.is-up::after{content:" \2191";color:var(--gdp-win);font-size:22px;}
.gdp-mico-st-figs b.is-down::after{content:" \2193";color:#ff8a84;font-size:22px;}
.gdp-mico-st-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.gdp-mico-st-box{padding:16px 18px;border-radius:12px;background:var(--mico-card);border:1px solid var(--mico-line);min-width:0;}
.gdp-mico-st-box.is-wide{grid-column:1 / -1;}
.gdp-mico-st-box h3{margin:0 0 4px;font-family:var(--gdp-font);font-size:18px;letter-spacing:.03em;}
.gdp-mico-st-box p{margin:0 0 12px;font-family:var(--gdp-font-note);font-size:12.5px;color:var(--mico-steel-2);}
.gdp-mico-bars{display:flex;align-items:flex-end;gap:6px;height:150px;}
.gdp-mico-bar1{flex:1 1 0;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;gap:4px;}
.gdp-mico-bar1 i{display:block;border-radius:4px 4px 1px 1px;background:#4a4f53;}
.gdp-mico-bar1.is-on i{background:var(--mico-steel);}
.gdp-mico-bars.is-five .gdp-mico-bar1 i{background:var(--gdp-accent);}
.gdp-mico-bar1 .v{font-family:var(--mico-mono);font-size:11px;text-align:center;color:#c7ced3;}
.gdp-mico-bar1 .d{font-family:var(--gdp-font-note);font-size:11px;text-align:center;color:var(--mico-steel-2);}
.gdp-mico-bar1 .d em{display:block;font-style:normal;font-size:10.5px;opacity:.75;}
.gdp-mico-bars.is-trend .gdp-mico-bar1 .v{font-size:10px;}
.gdp-mico-st-nums{display:grid;grid-template-columns:repeat(var(--mico-n,6),minmax(0,1fr));gap:8px;}
.gdp-mico-st-nums > div{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border-radius:10px;border:1px solid var(--mico-line);}
.gdp-mico-st-nums b{font-family:var(--gdp-font);font-size:24px;}
.gdp-mico-st-nums span{font-family:var(--gdp-font-note);font-size:12px;color:var(--mico-steel-2);}
.gdp-mico-st-nums span + span{color:var(--mico-steel);font-size:13px;}
.gdp-mico-st-nums em{font-style:normal;font-family:var(--mico-mono);font-size:16px;}
.gdp-mico-st-nums > div.is-low{border-color:rgba(255,90,82,.6);}
.gdp-mico-st-nums > div.is-low em{color:#ff8a84;}
.gdp-mico-st-table{width:100%;border-collapse:collapse;font-family:var(--gdp-font-note);font-size:13.5px;}
.gdp-mico-st-table th{text-align:left;font-weight:400;color:var(--mico-steel-2);padding:6px 8px;border-bottom:1px solid var(--mico-line);}
.gdp-mico-st-table td{padding:7px 8px;border-bottom:1px solid #1f2123;font-variant-numeric:tabular-nums;}
.gdp-mico-st-table.is-recent th.is-n,.gdp-mico-st-table.is-recent td.is-n{text-align:center;white-space:nowrap;}
.gdp-mico-st-table.is-recent th.is-fig,.gdp-mico-st-table.is-recent td.is-fig{text-align:right;}
.gdp-mico-st-table.is-recent td.is-n b{font-weight:600;color:#fff;}
.gdp-mico-st-table.is-recent td.is-n i{font-style:normal;color:var(--mico-steel-2);margin:0 3px;}
.gdp-mico-st-table.is-recent td.is-n span{color:var(--mico-steel);}
.gdp-mico-st-table.is-recent td.is-zero b{color:var(--mico-steel-2);font-weight:400;}
.gdp-mico-st-table.is-recent td.is-total{font-family:var(--mico-mono);color:#fff;}
.gdp-mico-st-table.is-recent td.is-date{white-space:nowrap;color:var(--mico-steel);}
/* A phone: each session is a card, the six numbers in a row with their
   number above, then total, MICO and band. */
@media (max-width:700px){
  .gdp-mico-st-table.is-recent thead{display:none;}
  .gdp-mico-st-table.is-recent tbody{display:flex;flex-direction:column;gap:8px;}
  /* Three columns per number, so the numbers and the three figures
     (span --mico-n each) share one grid for 6 or 7 numbers. */
  .gdp-mico-st-table.is-recent tr{display:grid;grid-template-columns:repeat(var(--mico-cols,18),minmax(0,1fr));gap:6px 4px;
    padding:10px;border:1px solid var(--mico-line);border-radius:10px;}
  .gdp-mico-st-table.is-recent td{border:0;padding:0;}
  .gdp-mico-st-table.is-recent td.is-date{grid-column:1 / -1;font-size:12.5px;}
  .gdp-mico-st-table.is-recent td.is-n{grid-column:span 3;display:flex;flex-direction:column;align-items:center;gap:1px;font-size:14px;line-height:1.2;}
  .gdp-mico-st-table.is-recent td.is-n::before{content:attr(data-l);font-family:var(--gdp-font);font-size:12px;color:var(--mico-steel-2);}
  .gdp-mico-st-table.is-recent td.is-n i{display:none;}
  .gdp-mico-st-table.is-recent td.is-n span{font-size:12.5px;}
  .gdp-mico-st-table.is-recent td.is-fig{grid-column:span var(--mico-n,6);text-align:left;display:flex;flex-direction:column;
    padding-top:6px;border-top:1px solid #1f2123;font-size:15px;}
  .gdp-mico-st-table.is-recent td.is-fig::before{content:attr(data-l);font-family:var(--gdp-font);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mico-steel-2);}
}

/* ---------- full screen: fixed sizes inside the scaled play screen ---------- */
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-num{width:190px;height:190px;font-size:124px;}

/* ---------- narrower ---------- */
@media (max-width:1100px){
  .gdp-mico-setup-grid{grid-template-columns:minmax(0,1fr) 360px;gap:36px;}
  .gdp-mico-stage{grid-template-columns:minmax(0,1fr) 320px;column-gap:28px;row-gap:22px;}
  .gdp-mico-strip{gap:10px;}
  .gdp-mico-strip li{height:94px;}
  .gdp-mico-strip b{font-size:38px;}
  .gdp-mico-strip span{font-size:17px;}
  .gdp-mico-num{width:160px;height:160px;font-size:104px;}
  .gdp-mico-eq{font-size:62px;}
  .gdp-mico-res.is-mico{grid-template-columns:340px minmax(0,1fr);gap:32px;}
  .gdp-mico-res-gauge{width:340px;height:211px;}
}
@media (max-width:860px){
  .gdp-mico-setup-grid{grid-template-columns:minmax(0,1fr);gap:26px;margin-top:26px;}
  .gdp-mico-card{max-width:520px;}
  /* One column: what to throw with first (the keys, or the Scolia boxes),
     the total and the row of numbers and results, smaller, at the bottom. */
  .gdp-mico-stage{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto;grid-template-areas:"now" "pad" "total" "strip";row-gap:18px;}
  .gdp-mico-totalrow{align-self:end;}
  .gdp-mico-strip li{height:64px;}
  .gdp-mico-strip b{font-size:26px;}
  .gdp-mico-strip span{font-size:13px;}
  .gdp-mico-pad{width:100%;max-width:520px;justify-self:center;}
  .gdp-mico-res.is-mico{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:20px;}
  .gdp-mico-res-text{align-items:center;}
  .gdp-mico-res-actions.is-split{grid-template-columns:minmax(0,1fr);}
  .gdp-mico-st-figs{grid-template-columns:repeat(2,minmax(0,1fr));}
  .gdp-mico-st-grid{grid-template-columns:minmax(0,1fr);}
}
/* A phone: everything to throw on one screen, no scrolling. */
@media (max-width:600px){
  .gdp .gdp-wrap.gdp-mico{padding:38px 12px 18px;min-height:0;}
  .gdp-mico-ruler{left:12px;right:12px;top:10px;height:10px;}
  .gdp-mico-setup{padding:4px 4px 10px;}
  .gdp-mico-title{font-size:56px;}
  .gdp-mico-lede{font-size:15px;margin-bottom:20px;}
  .gdp-mico-btn.is-big{flex:1;padding:0 20px;}
  .gdp-mico-card{padding:20px;}
  .gdp-mico-card-big{font-size:30px;}
  .gdp-mico-card-mico{font-size:46px;}
  .gdp-mico-play{padding:0 2px;}
  .gdp-mico-bar{height:44px;gap:10px;margin-bottom:10px;}
  .gdp-mico-bar-name{font-size:0;}
  .gdp-mico-bar-fig{font-size:15px;min-width:46px;}
  .gdp-mico-bar .gdp-mico-iconbtn{width:44px;height:44px;}
  .gdp-mico-stage{row-gap:12px;}
  .gdp-mico-now{gap:14px;}
  .gdp-mico-num{width:min(30vw,22svh,124px);height:min(30vw,22svh,124px);font-size:min(20vw,14svh,80px);border-width:2px;}
  .gdp-mico-q{font-size:11px;letter-spacing:.14em;}
  .gdp-mico-eq{font-size:44px;gap:10px;}
  .gdp-mico-eq i{font-size:30px;}
  .gdp-mico-eq-r{font-size:16px;min-height:20px;}
  .gdp-mico-strip{gap:5px;}
  .gdp-mico-strip li{height:50px;border-radius:8px;gap:3px;}
  .gdp-mico-strip b{font-size:19px;}
  .gdp-mico-strip span{font-size:11px;min-height:13px;}
  .gdp-mico-totalrow{gap:10px;justify-content:center;}
  .gdp-mico-total{font-size:28px;}
  .gdp-mico-pad{gap:6px;}
  .gdp-mico-padhead .gdp-mico-label{display:none;}
  .gdp-mico-field{height:46px;font-size:30px;}
  .gdp-mico-keys{gap:5px;}
  .gdp-mico-key{height:min(54px,6.8svh);font-size:24px;}
  .gdp-mico-undo{height:40px;}
  .gdp-mico-save{min-height:16px;font-size:11.5px;}
  .gdp-mico-result{padding:36px 4px 10px;}
  .gdp-mico-res-big{font-size:64px;}
  .gdp-mico-res-gauge{width:300px;height:186px;}
  .gdp-mico-res-gaugev b{font-size:48px;}
  .gdp-mico-res-h{font-size:34px;}
  .gdp-mico-res-actions{flex-direction:column;width:100%;}
  .gdp-mico-res-actions .gdp-mico-btn{width:100%;}
  .gdp-mico-next{flex-wrap:wrap;}
  .gdp-mico-st-nums{grid-template-columns:repeat(3,minmax(0,1fr));}
  .gdp-mico-st-nums > div.is-word b{white-space:normal;text-align:center;line-height:1.1;}
}

/* A phone in portrait: sizes follow the screen height, so a tall phone
   gets large targets and a small one still has everything on screen. */
@media (max-width:600px){
  .gdp-mico-stage{row-gap:clamp(10px,1.8svh,18px);}
  .gdp-mico-num{width:clamp(96px,min(34vw,16svh),150px);height:clamp(96px,min(34vw,16svh),150px);font-size:clamp(62px,min(22vw,10.4svh),98px);}
  .gdp-mico-q{font-size:12px;}
  .gdp-mico-eq{font-size:clamp(40px,min(13vw,7svh),60px);}
  .gdp-mico-eq i{font-size:clamp(28px,min(9vw,4.8svh),42px);}
  .gdp-mico-strip{gap:clamp(4px,1.2vw,6px);}
  .gdp-mico-strip li{height:clamp(38px,5.4svh,50px);border-radius:7px;gap:1px;}
  .gdp-mico-strip b{font-size:clamp(15px,2.5svh,20px);}
  .gdp-mico-strip span{font-size:clamp(10px,1.5svh,12px);min-height:12px;}
  .gdp-mico-total{font-size:clamp(28px,4.6svh,40px);}
  .gdp-mico-totalrow .gdp-mico-muted{font-size:clamp(13px,1.9svh,15px);}
  .gdp-mico-pad{gap:clamp(6px,1.1svh,10px);}
  .gdp-mico-field{height:clamp(44px,6.6svh,62px);font-size:clamp(28px,4.4svh,40px);}
  .gdp-mico-keys{gap:clamp(5px,0.9svh,8px);}
  .gdp-mico-key{height:clamp(44px,7.4svh,70px);font-size:clamp(22px,3.4svh,30px);}
  .gdp-mico-undo{height:clamp(38px,5.6svh,48px);}
  /* With a Scolia board and the buttons hidden there is room to spare:
     everything a player reads from the oche gets bigger. */
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage{row-gap:clamp(12px,2.4svh,24px);}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-num{width:clamp(110px,min(40vw,21svh),180px);height:clamp(110px,min(40vw,21svh),180px);font-size:clamp(70px,min(26vw,13.5svh),118px);}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-eq{font-size:clamp(46px,min(15vw,8.4svh),72px);}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-eq i{font-size:clamp(32px,min(10vw,5.6svh),50px);}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-total{font-size:clamp(32px,5.6svh,46px);}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-field{height:clamp(48px,7.6svh,70px);font-size:clamp(32px,5svh,46px);}
  .gdp-mico.is-scolia:not(.is-keys) .dart-detail{padding:clamp(10px,2.4svh,22px) 4px !important;}
  .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-score{font-size:clamp(28px,5.2svh,44px) !important;}
  .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-hit{font-size:clamp(13px,2.1svh,17px) !important;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-undo{height:clamp(40px,6.2svh,52px);}
}
/* A short phone screen (a small iPhone with the browser bars showing). */
@media (max-width:600px) and (max-height:640px){
  .gdp .gdp-wrap.gdp-mico{padding-top:32px;}
  .gdp-mico-bar{height:38px;margin-bottom:6px;}
  .gdp-mico-stage{row-gap:8px;}
  .gdp-mico-num{width:96px;height:96px;font-size:62px;}
  .gdp-mico-eq{font-size:38px;}
  .gdp-mico-strip li{height:32px;}
  .gdp-mico-strip span{display:none;}
  .gdp-mico-total{font-size:24px;}
  .gdp-mico-field{height:40px;font-size:26px;}
  .gdp-mico-key{height:min(50px,7.6svh);font-size:22px;}
  .gdp-mico-undo{height:36px;}
  .gdp-mico .dart-detail{padding:5px 4px !important;}
  .gdp-mico .js-dart-detail-score{font-size:22px !important;}
  .gdp-mico .js-dart-detail-hit{font-size:13px !important;}
  .gdp-mico.is-scolia .gdp-mico-pad{gap:6px;}
  .gdp-mico-keytoggle{padding:2px;}
}
/* A phone on its side (low and wide): two compact columns, everything to
   throw on one screen. Setup and result use two columns too. */
@media (orientation:landscape) and (max-height:520px){
  .gdp .gdp-wrap.gdp-mico{padding:30px 14px 12px;min-height:0;}
  .gdp .gdp-wrap.gdp-mico:not(.is-playing){padding-right:48px;}
  .gdp-mico-ruler{left:14px;right:14px;top:8px;height:10px;}
  .gdp-mico-bar{height:36px;margin-bottom:6px;gap:10px;}
  .gdp-mico-bar-name{font-size:14px;}
  .gdp-mico-bar .gdp-mico-iconbtn{width:36px;height:36px;}
  /* The row of numbers and results at the bottom of the left column. */
  .gdp-mico-stage{grid-template-columns:minmax(0,1fr) minmax(0,40%);grid-template-rows:auto 1fr auto;
    grid-template-areas:"now pad" "total pad" "strip pad";column-gap:18px;row-gap:8px;}
  .gdp-mico-totalrow{align-self:end;}
  .gdp-mico-now{gap:14px;}
  .gdp-mico-num{width:min(84px,20svh);height:min(84px,20svh);font-size:min(54px,13svh);border-width:2px;box-shadow:none;}
  .gdp-mico-q{font-size:10.5px;letter-spacing:.14em;}
  .gdp-mico-eq{font-size:36px;gap:8px;}
  .gdp-mico-eq i{font-size:24px;}
  .gdp-mico-eq-r{font-size:14px;min-height:16px;}
  .gdp-mico-strip{gap:5px;}
  .gdp-mico-strip li{height:min(40px,10svh);border-radius:7px;gap:1px;}
  .gdp-mico-strip b{font-size:16px;}
  .gdp-mico-strip span{font-size:10px;min-height:11px;}
  .gdp-mico-totalrow{gap:10px;}
  .gdp-mico-total{font-size:26px;}
  .gdp-mico-pad{gap:5px;max-width:none;}
  .gdp-mico-padhead .gdp-mico-label{display:none;}
  .gdp-mico-field{height:min(40px,10svh);font-size:24px;}
  .gdp-mico-keys{gap:4px;}
  .gdp-mico-key{height:min(42px,10.5svh);font-size:19px;}
  .gdp-mico-undo{height:min(34px,9svh);}
  .gdp-mico-save{min-height:14px;font-size:11px;}
  .gdp-mico .dart-detail{padding:5px 4px !important;}
  .gdp-mico .js-dart-detail-score{font-size:22px !important;}
  .gdp-mico .js-dart-detail-hit{font-size:12px !important;}
  .gdp-mico-setup-grid{grid-template-columns:minmax(0,1fr) minmax(0,44%);gap:20px;margin-top:10px;align-items:start;}
  .gdp-mico-title{font-size:44px;}
  .gdp-mico-lede{font-size:14px;margin-bottom:12px;}
  .gdp-mico-card{padding:16px;}
  .gdp-mico-card-mico{font-size:38px;}
  .gdp-mico-result{padding:20px 4px 8px;}
  .gdp-mico-res.is-mico{grid-template-columns:240px minmax(0,1fr);justify-items:start;text-align:left;gap:20px;}
  .gdp-mico-res-text{align-items:flex-start;}
  .gdp-mico-res-gauge{width:240px;height:150px;}
  .gdp-mico-res-gaugev b{font-size:38px;}
  .gdp-mico-res-h{font-size:26px;}
  .gdp-mico-res-big{font-size:54px;}
  .gdp-mico-res-actions.is-split{grid-template-columns:auto minmax(0,1fr);margin-top:16px;}
  .gdp-mico-res-actions{flex-direction:row;}
  .gdp-mico-res-actions .gdp-mico-btn{width:auto;}
}
@media (prefers-reduced-motion:reduce){
  .gdp-mico-ruler-band,.gdp-mico-ruler-mark,.gdp-mico-btn,.gdp-mico-key,.gdp-mico-next{transition:none;}
}

/* ---------- Cricket Bundle: a visit is entered dart by dart ----------
   S, D and T (keys 1, 2, 3) and Miss (0); the third dart enters the
   visit, Enter takes fewer. Only these keys are shown, larger. */
.gdp-mico[data-input="sdt"] .gdp-mico-field,
.gdp-mico[data-input="sdt"] .gdp-mico-padhead .gdp-mico-label{display:none;}
.gdp-mico[data-input="sdt"] .gdp-mico-key[data-k="4"],
.gdp-mico[data-input="sdt"] .gdp-mico-key[data-k="5"],
.gdp-mico[data-input="sdt"] .gdp-mico-key[data-k="6"],
.gdp-mico[data-input="sdt"] .gdp-mico-key[data-k="7"],
.gdp-mico[data-input="sdt"] .gdp-mico-key[data-k="8"],
.gdp-mico[data-input="sdt"] .gdp-mico-key[data-k="9"]{display:none;}
.gdp-mico[data-input="sdt"] .gdp-mico-key{height:84px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;line-height:1;}
.gdp-mico[data-input="sdt"] .gdp-mico-key small{font-family:var(--gdp-font-note);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mico-steel);}
.gdp-mico[data-input="sdt"] .gdp-mico-key:active small{color:inherit;}
.gdp-mico[data-input="sdt"] .gdp-mico-key[data-k="0"]{font-size:19px;letter-spacing:.06em;}
.gdp-mico[data-input="sdt"] .gdp-mico-eq-h{letter-spacing:.18em;padding-left:.18em;white-space:nowrap;}
@media (max-width:600px){ .gdp-mico[data-input="sdt"] .gdp-mico-eq-h{letter-spacing:.06em;padding-left:.06em;font-size:.82em;} }
@media (max-height:620px) and (orientation:landscape){ .gdp-mico[data-input="sdt"] .gdp-mico-key{height:min(64px,12svh);} }
@media (max-width:600px){ .gdp-mico[data-input="sdt"] .gdp-mico-key{height:68px;} }

/* The order of the targets (Cricket Bundle). */
.gdp-mico-order{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;border:0;padding:0;margin:0 0 18px;min-width:0;}
.gdp-mico-order legend{float:left;margin:0 6px 0 0;padding:0;width:auto;border:0;}
.gdp-mico-order label{margin:0;cursor:pointer;}
.gdp-mico-order input{position:absolute;opacity:0;width:1px;height:1px;}
.gdp-mico-order span{
  display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid #3a3f43;
  font-family:var(--gdp-font);font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:#c7ced3;transition:border-color .15s,color .15s;
}
.gdp-mico-order input:checked + span{border-color:var(--gdp-accent);color:#fff;box-shadow:inset 0 0 0 1px var(--gdp-accent);}
.gdp-mico-order input:focus-visible + span{outline:2px solid var(--gdp-accent);outline-offset:2px;}

/* ---------- start screen: "All MICO games" ----------
   A link in the row under Start (with Darts setup and How to play). It
   slides down every MICO game under the start screen, this one marked,
   so all the MICO-factors are seen at once. */
.gdp-mico-fold-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:0;cursor:pointer;
  font-family:var(--gdp-font-note);font-size:14px;color:#a9afb3;text-decoration:underline;text-underline-offset:3px;}
.gdp-mico-fold-btn:hover,.gdp-mico-fold-btn[aria-expanded="true"]{color:#fff;}
.gdp-mico-fold-btn:focus-visible{outline:2px solid var(--gdp-accent);outline-offset:2px;}
.gdp-mico-setup-games .gdp-mico-games.is-open{margin-top:26px;}
.gdp-mico-game.is-here{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;align-items:center;
  padding:9px 12px;border-radius:10px;border:1px solid var(--gdp-accent);background:var(--mico-warm);color:var(--gdp-ink);text-align:left;}
.gdp-mico-game.is-here .gdp-mico-game-no{color:var(--gdp-accent);}

/* A short title on one line (19 Halve It), sized to the column. */
.gdp-mico-setup-main{container-type:inline-size;}
.gdp-mico-title.is-one-line{white-space:nowrap;font-size:min(104px,19cqi);}
.gdp-mico-title.is-one-line span{display:inline;}

/* ---------- GreenZone: one key per dart ----------
   1 Bull, 2 25, 3 Zone, 4 two points, 5 one point, 0 Miss. 6 keeps its
   place (empty) so Delete, Miss and Enter stay on the bottom row. */
.gdp-mico[data-input="darts"] .gdp-mico-field,
.gdp-mico[data-input="darts"] .gdp-mico-padhead .gdp-mico-label{display:none;}
.gdp-mico[data-input="darts"] .gdp-mico-key[data-k="7"],
.gdp-mico[data-input="darts"] .gdp-mico-key[data-k="8"],
.gdp-mico[data-input="darts"] .gdp-mico-key[data-k="9"]{display:none;}
.gdp-mico[data-input="darts"] .gdp-mico-key[data-k="6"]{visibility:hidden;}
.gdp-mico[data-input="darts"] .gdp-mico-key{height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;line-height:1;font-size:21px;}
.gdp-mico[data-input="darts"] .gdp-mico-key small{font-family:var(--gdp-font-note);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mico-steel);}
.gdp-mico[data-input="darts"] .gdp-mico-key:active small{color:inherit;}
.gdp-mico[data-input="darts"] .gdp-mico-key[data-k="3"]{border-color:rgba(76,196,106,.55);}
.gdp-mico[data-input="darts"] .gdp-mico-eq-h{letter-spacing:.1em;white-space:nowrap;}
@media (max-height:620px) and (orientation:landscape){ .gdp-mico[data-input="darts"] .gdp-mico-key{height:min(56px,10.5svh);} }
@media (max-width:600px){ .gdp-mico[data-input="darts"] .gdp-mico-key{height:min(58px,9svh);font-size:18px;} .gdp-mico[data-input="darts"] .gdp-mico-eq-h{font-size:.8em;letter-spacing:.04em;} }

/* No game numbers on the game buttons (owner, 4 Nov): name and figure only. */
.gdp a.gdp-mico-game,.gdp-mico-game.is-here{grid-template-columns:minmax(0,1fr);}

/* Crown Judgement: once per 30 days, the date it opens again. */
.gdp-mico-locked{margin:0 0 14px;padding:10px 14px;border:1px solid rgba(255,164,0,.45);border-radius:10px;background:rgba(255,164,0,.06);
  font-family:var(--gdp-font-note);font-size:15px;line-height:1.45;color:#e9ecef;max-width:46ch;}
.gdp-mico-start.is-locked .js-mico-start{opacity:.35;cursor:not-allowed;}

/* D18, T20 (Crown Judgement): a letter and two digits, a little smaller so
   it stays inside the ring. */
.gdp-mico-num-3{font-size:.74em;letter-spacing:-.02em;}
.gdp-mico-st-nums .gdp-mico-st-mm{color:#FFA400;text-align:center;line-height:1.25;}
.gdp-mico-num-fit{display:flex;flex-direction:column;align-items:center;line-height:1;letter-spacing:-.02em;white-space:nowrap;}
.gdp-mico-num-fit small{font-size:max(13px,.24em);}
/* Crown Judgement's progress line ("Major Doubles · Round 1 of 6") stays
   on one line on a phone. */
.gdp-mico-bar-fig .is-short{display:none;}
@media (max-width:600px){
  .gdp-mico[data-app="41"] .gdp-mico-bar-fig{white-space:nowrap;font-size:13px;letter-spacing:.02em;}
  .gdp-mico-bar-fig .is-long{display:none;}
  .gdp-mico-bar-fig .is-short{display:inline;}
}

/* Without a Scolia board in use (none selected in Darts setup, or no
   connection) the dart boxes are never shown: the buttons are the input. */
.gdp-mico:not(.is-scolia) .gdp-mico-dartslot{display:none !important;}

/* The Scolia badge with no board in use ("NONE"). scolia-func.js shows it
   with slideDown(), which leaves an inline display:block; gdp-game.css
   turns that back into the badge's flex only under .has-scolia, and a MICO
   game without a board in use no longer has that class. So it is done here
   for the MICO pages: the S, NONE, the divider and the menu centred in the
   badge again. slideUp() leaves display:none, which is not matched. */
.gdp.gdp-mico-root .autotrack-status-wrapper[style*="display: block"],
.gdp.gdp-mico-root .autotrack-status-wrapper[style*="display:block"]{display:flex !important;align-items:center;}
/* The label of the not-ready states (NONE, errors: the ones that blink)
   sits about 2px low: the condensed font's capitals are not centred in
   its line box. Lifted so they line up with the S and the menu icon. The
   Ready label is not touched. */
.gdp.gdp-mico-root .autotrack-status-wrapper .js-autotrack-status-label.blink_me{position:relative;top:-2px;}

/* The ? in the game bar opens the rules (Crown Judgement: of the section
   being played) in the same popup style as Exit. */
.gdp-mico-help .gdp-mico-help-body{margin:0 0 18px;font-family:var(--gdp-font-note);font-size:15px;line-height:1.55;color:#d6dbdf;max-height:min(52svh,420px);overflow:auto;}
.gdp-mico-help .gdp-mico-help-body p{margin:0 0 10px;font-size:15px;color:#d6dbdf;}
.gdp-mico-help .gdp-mico-help-body ol{margin:0 0 12px;padding-left:20px;}
.gdp-mico-help .gdp-mico-help-body li{margin:0 0 6px;}
.gdp-mico-help .gdp-mico-help-body .gdp-mico-muted{color:var(--mico-steel);font-size:13.5px;}

/* ---------- guide ----------
   The popup that says what to do now: a small board (Crown Judgement),
   the section, the goal in one large line, three numbered steps and how
   it scores. "Got it" plays on; "Don't show guides" turns the automatic
   popups off for this game (the start screen checkbox turns them on). */
/* Fixed to the screen, so the whole guide is in view wherever the page
   is scrolled (a phone shows the game taller than the screen). */
.gdp-mico-exit.gdp-mico-help{position:fixed;z-index:2147480500;border-radius:0;padding:12px;}
.gdp-mico-help .gdp-mico-exit-panel.gdp-mico-guide{max-width:520px;max-height:calc(100% - 8px);overflow:auto;padding:24px 26px 20px;text-align:left;}
.gdp-mico-guide-art{width:112px;height:112px;margin:0 auto 12px;}
.gdp-mico-guide-art svg{display:block;width:100%;height:100%;}
.gdp-mico-guide-art .b0{fill:#0f1112;stroke:rgba(199,206,211,.35);stroke-width:1.5;}
.gdp-mico-guide-art .b1{stroke:rgba(199,206,211,.14);}
.gdp-mico-guide-art .b2{stroke:rgba(199,206,211,.22);stroke-width:1;}
.gdp-mico-guide-art .b1f{fill:rgba(199,206,211,.14);}
.gdp-mico-guide-art .b2f{fill:rgba(199,206,211,.3);}
.gdp-mico-guide-art .hl{fill:#FFA400;stroke:#FFA400;}
.gdp-mico-guide-art circle.hl[fill="none"]{fill:none;}
.gdp-mico-guide-art .hl-soft{stroke:rgba(255,164,0,.38);}
.gdp-mico-guide-art .hl-soft-f{fill:rgba(255,164,0,.22);}
.gdp-mico-guide-art .hl-faint{fill:rgba(255,164,0,.1);}
.gdp-mico-guide-eyebrow{display:block;font-family:var(--gdp-font);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#FFA400;margin:0 0 2px;}
.gdp-mico-guide h3{font-size:30px;margin:0 0 10px;}
.gdp-mico-help .gdp-mico-help-body{max-height:none;overflow:visible;}
.gdp-mico-help .gdp-mico-help-body p.gdp-mico-guide-goal{font-family:var(--gdp-font);font-size:22px;line-height:1.25;color:#fff;margin:0 0 14px;}
.gdp-mico-help .gdp-mico-help-body ol.gdp-mico-guide-steps{list-style:none;margin:0 0 14px;padding:0;counter-reset:gstep;display:grid;gap:9px;}
.gdp-mico-guide-steps li{counter-increment:gstep;position:relative;padding-left:36px;margin:0;font-size:15px;line-height:1.45;color:#d6dbdf;}
.gdp-mico-guide-steps li::before{content:counter(gstep);position:absolute;left:0;top:-1px;width:24px;height:24px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:rgba(255,164,0,.14);border:1px solid rgba(255,164,0,.55);color:#FFA400;
  font-family:var(--gdp-font);font-size:13px;}
.gdp-mico-guide-score{padding:10px 12px;border-radius:10px;border:1px solid var(--mico-line);background:rgba(199,206,211,.04);}
.gdp-mico-guide-score b{display:block;font-family:var(--gdp-font);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mico-steel-2);font-weight:400;margin:0 0 3px;}
.gdp-mico-help .gdp-mico-help-body .gdp-mico-guide-score p{margin:0;font-size:14px;line-height:1.45;color:#c7ced3;}
/* The Guide button in the game bar: a word next to the ?, easy to find. */
.gdp-mico-bar .gdp-mico-iconbtn.gdp-mico-guidebtn{width:auto;padding:0 14px;gap:8px;color:#FFA400;border-color:rgba(255,164,0,.45);}
.gdp-mico-guidebtn i{font-size:15px;}
.gdp-mico-guidebtn span{font-family:var(--gdp-font);font-size:14px;letter-spacing:.12em;text-transform:uppercase;}
.gdp-mico-bar .gdp-mico-iconbtn.gdp-mico-guidebtn:hover{color:#ffc04d;border-color:#FFA400;}
@media (max-width:600px){
  .gdp-mico-bar .gdp-mico-iconbtn.gdp-mico-guidebtn{padding:0;width:44px;}
  .gdp-mico-guidebtn span{display:none;}
  .gdp-mico-help .gdp-mico-exit-panel.gdp-mico-guide{padding:18px 18px 16px;}
  .gdp-mico-guide-art{width:84px;height:84px;margin-bottom:8px;}
  .gdp-mico-guide h3{font-size:26px;}
  .gdp-mico-help .gdp-mico-help-body p.gdp-mico-guide-goal{font-size:19px;}
}
@media (orientation:landscape) and (max-height:520px){
  .gdp-mico-bar .gdp-mico-iconbtn.gdp-mico-guidebtn{padding:0;width:36px;}
  .gdp-mico-guidebtn span{display:none;}
  .gdp-mico-help .gdp-mico-exit-panel.gdp-mico-guide{max-width:640px;padding:14px 18px 12px;display:grid;grid-template-columns:90px minmax(0,1fr);column-gap:16px;}
  .gdp-mico-guide-art{width:90px;height:90px;margin:4px 0 0;grid-row:1 / span 4;}
  .gdp-mico-guide > :not(.gdp-mico-guide-art){grid-column:2;}
  .gdp-mico-help .gdp-mico-exit-panel.gdp-mico-guide:has(.gdp-mico-guide-art.is-hidden){display:block;}
  .gdp-mico-guide h3{font-size:22px;margin-bottom:6px;}
  .gdp-mico-help .gdp-mico-help-body p.gdp-mico-guide-goal{font-size:17px;margin-bottom:8px;}
  .gdp-mico-guide-steps li{font-size:13.5px;}
  .gdp-mico-help .gdp-mico-help-body ol.gdp-mico-guide-steps{gap:5px;margin-bottom:8px;}
  .gdp-mico-help .gdp-mico-exit-actions{flex-direction:row;align-items:center;gap:16px;}
  .gdp-mico-help .gdp-mico-exit-actions .gdp-mico-btn{min-height:40px;}
  .gdp-mico-help .gdp-mico-help-body{margin-bottom:10px;}
  .gdp-mico-guide-score{padding:6px 10px;}
  .gdp-mico-help .gdp-mico-help-body .gdp-mico-guide-score p{font-size:12.5px;line-height:1.35;}
  .gdp-mico-guide-steps li{line-height:1.35;padding-left:32px;}
  .gdp-mico-guide-steps li::before{width:22px;height:22px;font-size:12px;}
  .gdp-mico-guide-eyebrow{font-size:11px;}
}
/* The start screen checkbox: guide on or off for this game. */
.gdp-mico-guidecheck{display:inline-flex;align-items:center;gap:10px;margin:0 0 14px;cursor:pointer;font-family:var(--gdp-font-note);font-size:14.5px;color:#c7ced3;}
.gdp-mico-guidecheck input{width:18px;height:18px;margin:0;accent-color:#FFA400;cursor:pointer;}

/* ---------- Crown Judgement: Recent sessions, one session ----------
   A row opens the session (a chevron and a hover show it); the mm of the
   Scolia darts sits under the section score. */
.gdp-mico-st-table.is-recent tr.is-link{cursor:pointer;transition:background .15s ease;}
.gdp-mico-st-table.is-recent tr.is-link:hover,.gdp-mico-st-table.is-recent tr.is-link:focus-visible{background:rgba(255,164,0,.06);outline:none;}
.gdp-mico-st-table.is-recent tr.is-link:focus-visible td{box-shadow:inset 0 1px 0 rgba(255,164,0,.5),inset 0 -1px 0 rgba(255,164,0,.5);}
.gdp-mico-st-table.is-recent tr.is-link td.is-date i{margin-left:8px;font-size:10px;color:#FFA400;opacity:.7;}
.gdp-mico-st-cellmm{display:block;font-family:var(--mico-mono);font-size:11px;color:#FFA400;opacity:.85;line-height:1.2;}
@media (max-width:600px){
  .gdp-mico-st-table.is-recent tr.is-link{border-color:rgba(255,164,0,.3);}
}

.gdp-mico-sd{display:grid;gap:16px;}
.gdp-mico-sd-back{justify-self:start;display:inline-flex;align-items:center;gap:8px;}
.gdp-mico-sd-back i{font-size:11px;}
.gdp-mico-sd-head h3{margin:2px 0 10px;font-family:var(--gdp-font);font-size:30px;color:#fff;}
.gdp-mico-sd-chips{display:flex;flex-wrap:wrap;gap:8px;}
.gdp-mico-sd-chips span{display:flex;flex-direction:column;gap:2px;min-width:86px;padding:8px 12px;border-radius:10px;border:1px solid var(--mico-line);background:rgba(199,206,211,.03);}
.gdp-mico-sd-chips em{font-style:normal;font-family:var(--gdp-font);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mico-steel-2);}
.gdp-mico-sd-chips b{font-family:var(--mico-mono);font-size:22px;color:#fff;font-weight:600;}
.gdp-mico-sd-note{margin:10px 0 0;font-family:var(--gdp-font-note);font-size:13px;color:var(--mico-steel);}
.gdp-mico-sd-box{padding:16px;border-radius:14px;border:1px solid var(--mico-line);background:rgba(10,12,14,.5);}
.gdp-mico-sd-box h4{margin:0 0 12px;font-family:var(--gdp-font);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:#FFA400;font-weight:400;}
.gdp-mico-sd-secs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;}
.gdp-mico-sd-sec,.gdp-mico-sd-tile{display:flex;flex-direction:column;gap:5px;padding:10px 12px;border-radius:10px;background:rgba(199,206,211,.04);border:1px solid rgba(199,206,211,.08);min-width:0;}
.gdp-mico-sd-sec .n,.gdp-mico-sd-tile .n{font-family:var(--gdp-font);font-size:14px;color:#e6eaed;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gdp-mico-sd-sec .v,.gdp-mico-sd-tile .v{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;}
.gdp-mico-sd-sec .v b{font-family:var(--mico-mono);font-size:26px;color:#fff;font-weight:600;}
.gdp-mico-sd-tile .v b{font-family:var(--mico-mono);font-size:20px;color:#fff;font-weight:600;}
.gdp-mico-sd .v small{font-family:var(--mico-mono);font-size:11.5px;color:var(--mico-steel-2);}
.gdp-mico-sd .s,.gdp-mico-sd .mm{font-family:var(--gdp-font-note);font-size:12.5px;color:var(--mico-steel);display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;}
.gdp-mico-sd .mm{color:#FFA400;font-family:var(--mico-mono);font-size:12px;}
.gdp-mico-sd-bar{display:block;height:4px;border-radius:2px;background:rgba(199,206,211,.1);overflow:hidden;}
.gdp-mico-sd-bar i{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,rgba(255,164,0,.65),#FFA400);}
.gdp-mico-sd-vs{font-family:var(--mico-mono);font-size:11.5px;padding:1px 5px;border-radius:5px;line-height:1.4;}
.gdp-mico-sd-vs.is-up{color:#7fe0a4;background:rgba(53,170,100,.14);}
.gdp-mico-sd-vs.is-down{color:#ff9a94;background:rgba(255,90,82,.12);}
.gdp-mico-sd-vs.is-even{color:var(--mico-steel-2);background:rgba(199,206,211,.07);}
.gdp-mico-sd-row + .gdp-mico-sd-row{margin-top:16px;padding-top:14px;border-top:1px solid rgba(199,206,211,.08);}
.gdp-mico-sd-row h5{margin:0 0 8px;font-family:var(--gdp-font);font-size:17px;color:#fff;font-weight:400;}
.gdp-mico-sd-tiles{display:grid;grid-template-columns:repeat(var(--n,6),minmax(0,1fr));gap:8px;}
.gdp-mico-sd-sub{margin:8px 0 0;font-family:var(--gdp-font-note);font-size:12.5px;color:var(--mico-steel-2);}
.gdp-mico-sd-box > .gdp-mico-sd-sub{margin:-6px 0 12px;}
.gdp-mico-sd-best{display:grid;grid-template-columns:repeat(18,minmax(0,1fr));gap:4px;align-items:end;height:110px;padding-top:16px;}
.gdp-mico-sd-best span{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;}
.gdp-mico-sd-best i{display:block;height:var(--h);min-height:2px;border-radius:3px 3px 0 0;background:rgba(199,206,211,.35);}
.gdp-mico-sd-best span.is-best i{background:#FFA400;}
.gdp-mico-sd-best em{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--h) + 3px);font-style:normal;font-family:var(--mico-mono);font-size:10px;color:var(--mico-steel-2);white-space:nowrap;}
.gdp-mico-sd-best span.is-best em{color:#FFA400;}
.gdp-mico-sd-pair{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:10px;font-family:var(--gdp-font-note);font-size:13.5px;color:var(--mico-steel);}
.gdp-mico-sd-pair span{display:inline-flex;align-items:baseline;gap:6px;}
.gdp-mico-sd-pair b{font-family:var(--mico-mono);font-size:17px;color:#fff;}
.gdp-mico-sd-plots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.gdp-mico-sd-plot{margin:0;display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;align-items:center;}
.gdp-mico-sd-plot svg{width:200px;height:200px;display:block;border-radius:12px;border:1px solid rgba(199,206,211,.14);}
.gdp-mico-sd-plot .off{fill:#070808;}
.gdp-mico-sd-plot .board{fill:#14171a;}
.gdp-mico-sd-plot .seg{fill:#1d2125;}
.gdp-mico-sd-plot .ring{fill:rgba(199,206,211,.06);}
.gdp-mico-sd-plot .bed{fill:rgba(255,164,0,.2);stroke:rgba(255,164,0,.8);stroke-width:.5;}
.gdp-mico-sd-plot .wire{fill:none;stroke:rgba(199,206,211,.28);stroke-width:.35;}
.gdp-mico-sd-plot .lab{fill:rgba(199,206,211,.5);font-family:var(--gdp-font);font-size:4.2px;letter-spacing:.12em;text-transform:uppercase;text-anchor:middle;}
.gdp-mico-sd-plot .scale{stroke:rgba(199,206,211,.6);stroke-width:.6;}
.gdp-mico-sd-plot .sc{fill:rgba(199,206,211,.6);font-family:var(--mico-mono);font-size:3.4px;text-anchor:middle;}
.gdp-mico-sd-plot .d{fill:rgba(199,206,211,.55);}
.gdp-mico-sd-plot .d.hit{fill:#FFA400;}
.gdp-mico-sd-plot .m{stroke:#fff;stroke-width:1.2;stroke-linecap:round;}
.gdp-mico-sd-plot figcaption{display:flex;flex-direction:column;gap:5px;font-family:var(--gdp-font-note);font-size:13px;color:var(--mico-steel);}
.gdp-mico-sd-plot figcaption b{font-family:var(--gdp-font);font-size:16px;color:#fff;font-weight:400;}
.gdp-mico-sd-plot figcaption span{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;}
@media (max-width:900px){
  .gdp-mico-sd-secs{grid-template-columns:repeat(3,minmax(0,1fr));}
  .gdp-mico-sd-tiles{grid-template-columns:repeat(3,minmax(0,1fr));}
  .gdp-mico-sd-plots{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:600px){
  .gdp-mico-sd-box{padding:12px;}
  .gdp-mico-sd-head h3{font-size:24px;}
  .gdp-mico-sd-chips span{min-width:0;flex:1 1 40%;}
  .gdp-mico-sd-secs{grid-template-columns:repeat(2,minmax(0,1fr));}
  .gdp-mico-sd-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}
  .gdp-mico-sd-tile{padding:8px;}
  .gdp-mico-sd-tile .v b{font-size:17px;}
  .gdp-mico-sd-best{gap:2px;height:96px;}
  .gdp-mico-sd-best em{display:none;}
  .gdp-mico-sd-best span.is-best em{display:block;}
  .gdp-mico-sd-plot{grid-template-columns:150px minmax(0,1fr);gap:12px;}
  .gdp-mico-sd-plot svg{width:150px;height:150px;}
}

/* ---------- Shooting Gallery with a board ----------
   The score left counts down in the ring after every dart: a pulse of the
   ring and the points of the dart floating up. A finish turns the ring
   green with a check, a bust red; "Remove your darts" shows over the game
   until the darts are out of the board. */
.gdp-mico-now{position:relative;}
.gdp-mico-num.is-tick{animation:gdpGalTick .5s cubic-bezier(.2,.7,.3,1);}
@keyframes gdpGalTick{
  0%{box-shadow:0 0 0 0 rgba(255,164,0,.55);transform:scale(1);}
  35%{transform:scale(1.035);}
  100%{box-shadow:0 0 0 18px rgba(255,164,0,0);transform:scale(1);}
}
.gdp-mico-gal-float{position:absolute;z-index:3;transform:translate(-50%,0);pointer-events:none;
  font-family:var(--mico-mono);font-weight:600;font-size:clamp(20px,2.4vw,30px);color:#FFA400;text-shadow:0 2px 10px rgba(0,0,0,.6);
  animation:gdpGalFloat 1.25s cubic-bezier(.2,.7,.3,1) forwards;}
.gdp-mico-gal-float.is-up{color:#ff8a84;}
@keyframes gdpGalFloat{
  0%{opacity:0;transform:translate(-50%,10px) scale(.85);}
  18%{opacity:1;transform:translate(-50%,-6px) scale(1);}
  100%{opacity:0;transform:translate(-50%,-56px) scale(1);}
}
.gdp-mico.is-gal-done .gdp-mico-num{color:#7fe0a4;border-color:rgba(53,170,100,.85);box-shadow:0 0 0 6px rgba(53,170,100,.12),0 0 40px rgba(53,170,100,.25);transition:color .3s,border-color .3s,box-shadow .3s;}
.gdp-mico.is-gal-done .gdp-mico-q{color:#7fe0a4;}
.gdp-mico.is-gal-bust .gdp-mico-num{color:#ff8a84;border-color:rgba(255,90,82,.7);transition:color .3s,border-color .3s;}
.gdp-mico.is-gal-bust .gdp-mico-q{color:#ff8a84;}
.gdp-mico-gal-toast{position:absolute;left:50%;top:58px;z-index:30;display:flex;white-space:nowrap;align-items:center;gap:12px;
  padding:12px 22px 12px 16px;border-radius:999px;background:rgba(14,16,18,.94);border:1px solid rgba(255,164,0,.6);
  box-shadow:0 14px 40px rgba(0,0,0,.55);color:#fff;font-family:var(--gdp-font);font-size:20px;letter-spacing:.08em;text-transform:uppercase;
  opacity:0;transform:translate(-50%,-14px) scale(.96);pointer-events:none;transition:opacity .25s ease,transform .35s cubic-bezier(.2,.7,.3,1);}
.gdp-mico-gal-toast.is-on{opacity:1;transform:translate(-50%,0) scale(1);}
.gdp-mico-gal-toast i{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;font-size:15px;background:rgba(255,164,0,.16);color:#FFA400;}
.gdp-mico-gal-toast.is-done{border-color:rgba(53,170,100,.8);}
.gdp-mico-gal-toast.is-done i{background:rgba(53,170,100,.2);color:#7fe0a4;}
.gdp-mico-gal-toast.is-bust{border-color:rgba(255,90,82,.75);}
.gdp-mico-gal-toast.is-bust i{background:rgba(255,90,82,.16);color:#ff8a84;}
@media (max-width:600px), (orientation:landscape) and (max-height:520px){
  /* On a phone: at the bottom of the screen, always in view. */
  .gdp-mico-gal-toast{position:fixed;top:auto;bottom:calc(18px + env(safe-area-inset-bottom, 0px));font-size:16px;padding:10px 18px 10px 12px;gap:9px;transform:translate(-50%,14px) scale(.96);}
  .gdp-mico-gal-toast.is-on{transform:translate(-50%,0) scale(1);}
  .gdp-mico-gal-toast i{width:24px;height:24px;font-size:12px;}
}
@media (prefers-reduced-motion: reduce){
  .gdp-mico-num.is-tick,.gdp-mico-gal-float{animation:none;}
  .gdp-mico-gal-float{display:none;}
  .gdp-mico-gal-toast{transition:none;}
}

/* Shooting Gallery: the checkout suggestion, the big line of the screen,
   between the score and the row of checkouts, readable from the oche:
   the darts in Anton, the label in Oswald under them. */
.gdp-mico-stage.has-sug{grid-template-rows:auto 1fr auto auto;grid-template-areas:"now pad" "sug pad" "total pad" "strip strip";}
.gdp-mico-galsug{grid-area:sug;align-self:center;justify-self:center;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 0;text-align:center;}
.gdp-mico-galsug.is-empty{visibility:hidden;}
.gdp-mico-galsug-r{display:flex;align-items:baseline;justify-content:center;gap:.32em;font-family:"Anton",var(--gdp-font),sans-serif;font-weight:400;
  font-size:clamp(64px,10vw,150px);line-height:1;letter-spacing:.005em;color:#fff;}
.gdp-mico-galsug-r b{font-weight:400;animation:gdpSugIn .4s cubic-bezier(.2,.7,.3,1) both;}
.gdp-mico-galsug-r b.is-dbl{color:#FFA400;}
.gdp-mico-galsug-r b:nth-child(2){animation-delay:.06s;}
.gdp-mico-galsug-r b:nth-child(3){animation-delay:.12s;}
.gdp-mico-galsug-l{font-family:var(--gdp-font);font-weight:500;font-size:clamp(18px,2.7vw,42px);letter-spacing:.1em;text-transform:uppercase;color:#fff;}
@keyframes gdpSugIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-galsug-r{font-size:150px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-galsug-l{font-size:42px;}
/* One column (phone, tablet upright): under the keys or the dart boxes. */
@media (max-width:860px){
  .gdp-mico-stage.has-sug{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto auto;grid-template-areas:"now" "pad" "sug" "total" "strip";}
  .gdp-mico-galsug-r{font-size:clamp(48px,12vw,96px);}
  .gdp-mico-galsug-l{font-size:clamp(14px,2.8vw,26px);}
}
@media (max-width:600px){
  .gdp-mico-galsug{padding:0;gap:2px;}
  .gdp-mico-galsug-r{font-size:clamp(44px,13vw,64px);}
}
/* A phone on its side: in the left column, under the score. */
@media (orientation:landscape) and (max-height:520px){
  .gdp-mico-stage.has-sug{grid-template-columns:minmax(0,1fr) minmax(0,40%);grid-template-rows:auto 1fr auto auto;grid-template-areas:"now pad" "sug pad" "total pad" "strip pad";}
  .gdp-mico-galsug{padding:0;gap:0;}
  .gdp-mico-galsug-r{font-size:min(56px,13svh);}
  .gdp-mico-galsug-l{font-size:13px;}
}
@media (prefers-reduced-motion: reduce){ .gdp-mico-galsug-r b{animation:none;} }

/* Playing: the frame is at least as tall as the screen, so the row of
   numbers and results stays at the bottom of the screen, with room under
   it, and does not move when a line above it changes. Full screen has its
   own height. */
html:not(.gdp-fs) .gdp .gdp-wrap.gdp-mico.is-playing{min-height:calc(100svh - 8px);}
.gdp-mico.is-playing .gdp-mico-play{padding-bottom:max(18px, env(safe-area-inset-bottom, 0px));}
/* Lines that change while playing keep their height (two lines). */
@media (max-width:860px), (orientation:landscape) and (max-height:520px){
  .gdp-mico.is-playing .gdp-mico-q{display:block;line-height:1.25;min-height:2.5em;}
  .gdp-mico.is-playing .gdp-mico-eq-r{display:block;line-height:1.3;min-height:2.6em;}
}

/* ---------- large screens (a maximised window, full screen) ----------
   With a board, what the player throws with takes the middle of the
   screen: the three dart boxes large across the frame, under the score
   (and the checkout suggestion beside it). Typed in, a wider keypad with
   large keys. */
/* With a board, on any computer or landscape tablet screen with room in
   height: the three dart boxes large across the middle. */
@media (min-width:861px) and (min-height:600px){
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 1fr auto auto;
    grid-template-areas:"now now" "pad pad" "total total" "strip strip";row-gap:24px;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage.has-sug{grid-template-areas:"now sug" "pad pad" "total total" "strip strip";}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage.has-sug .gdp-mico-galsug-r{font-size:clamp(72px,6.6vw,128px);}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage.has-sug .gdp-mico-galsug-l{font-size:clamp(18px,1.6vw,30px);}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-pad{align-self:center;justify-self:center;width:min(100%,1080px);max-width:none;gap:14px;align-items:center;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-padhead{align-self:stretch;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-padhead .gdp-mico-tracked{font-size:14px;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-dartslot{align-self:stretch;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-field{display:none;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-padhead .gdp-mico-label{display:none;}
  .gdp-mico.is-scolia:not(.is-keys) .dart-detail-wrapper{padding:0 9px !important;}
  .gdp-mico.is-scolia:not(.is-keys) .dart-detail{padding:clamp(18px,3.4svh,44px) 8px !important;border-radius:18px !important;}
  .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-score{font-size:clamp(54px,7.6svh,92px) !important;line-height:1 !important;}
  .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-hit{font-size:clamp(18px,2.4svh,26px) !important;margin-top:6px;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-keytoggle{align-self:center;font-size:15px;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-undo{width:min(100%,440px);height:54px;font-size:16px;}
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-save{align-self:center;}
}
/* Typed in, on a large screen: a wider keypad with large keys. */
@media (min-width:1300px) and (min-height:940px){
  .gdp-mico:not(.is-scolia) .gdp-mico-stage,.gdp-mico.is-keys .gdp-mico-stage{grid-template-columns:minmax(0,1fr) 480px;}
  .gdp-mico:not(.is-scolia) .gdp-mico-pad,.gdp-mico.is-keys .gdp-mico-pad{gap:12px;}
  .gdp-mico:not(.is-scolia) .gdp-mico-field,.gdp-mico.is-keys .gdp-mico-field{height:clamp(64px,8svh,84px);font-size:clamp(40px,5.2svh,56px);}
  .gdp-mico:not(.is-scolia) .gdp-mico-keys,.gdp-mico.is-keys .gdp-mico-keys{gap:12px;}
  .gdp-mico:not(.is-scolia) .gdp-mico-key,.gdp-mico.is-keys .gdp-mico-key{height:clamp(64px,8.6svh,96px);font-size:clamp(28px,3.8svh,40px);border-radius:14px;}
  .gdp-mico:not(.is-scolia) .gdp-mico-undo,.gdp-mico.is-keys .gdp-mico-undo{height:54px;font-size:16px;}
}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 1fr auto auto;
  grid-template-areas:"now now" "pad pad" "total total" "strip strip";row-gap:24px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage.has-sug{grid-template-areas:"now sug" "pad pad" "total total" "strip strip";}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage.has-sug .gdp-mico-galsug-r{font-size:clamp(72px,6.6vw,128px);}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage.has-sug .gdp-mico-galsug-l{font-size:clamp(18px,1.6vw,30px);}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-pad{align-self:center;justify-self:center;width:min(100%,1440px);max-width:none;gap:14px;align-items:center;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-padhead{align-self:stretch;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-padhead .gdp-mico-tracked{font-size:14px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-dartslot{align-self:stretch;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-field{display:none;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-padhead .gdp-mico-label{display:none;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .dart-detail-wrapper{padding:0 9px !important;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .dart-detail{padding:clamp(18px,3.4svh,44px) 8px !important;border-radius:18px !important;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-score{font-size:clamp(54px,7.6svh,92px) !important;line-height:1 !important;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-hit{font-size:clamp(18px,2.4svh,26px) !important;margin-top:6px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-keytoggle{align-self:center;font-size:15px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-undo{width:min(100%,440px);height:54px;font-size:16px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-save{align-self:center;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-stage,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-stage{grid-template-columns:minmax(0,1fr) 480px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-pad,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-pad{gap:12px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-field,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-field{height:clamp(64px,8svh,84px);font-size:clamp(40px,5.2svh,56px);}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-keys,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-keys{gap:12px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-key,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-key{height:clamp(64px,8.6svh,96px);font-size:clamp(28px,3.8svh,40px);border-radius:14px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-undo,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-undo{height:54px;font-size:16px;}

/* 10-20: "NOW SCORE!" and the bonus, on one line. */
.gdp-mico-galsug.is-text .gdp-mico-galsug-r{white-space:nowrap;}
.gdp-mico .gdp-mico-stage .gdp-mico-galsug.is-text .gdp-mico-galsug-r{font-size:clamp(44px,4.4vw,92px);}
@media (max-width:600px){ .gdp-mico .gdp-mico-stage .gdp-mico-galsug.is-text .gdp-mico-galsug-r{font-size:clamp(40px,12vw,60px);} }
/* With a board and the buttons hidden, the typed-value field repeats what
   the line by the score already shows: left out. */
.gdp-mico.is-scolia:not(.is-keys) .gdp-mico-field{display:none;}

/* Full screen: the game screen uses the width of the screen (up to a
   comfortable reading width) instead of a narrow column. The wrap is a
   column flexbox while playing, where the shared auto side margins would
   shrink the screen to its content, so it gets its width here. The play
   screen is laid out for the screen, not scaled up from the page size. */
html.gdp-fs:not(.gdp-fs-plain) .gdp .gdp-wrap.gdp-mico > section.gdp-mico-screen:not(.gdp-closed){width:100%;max-width:1128px;}
html.gdp-fs:not(.gdp-fs-plain) .gdp .gdp-wrap.gdp-mico.is-playing > section.gdp-mico-play{max-width:min(100%,1720px);}
/* Full screen on a short screen (a laptop, 768 to 900 px high): the same
   wide layout, tighter in height, so the row of numbers stays on screen. */
@media (max-height:900px){
  html.gdp-fs:not(.gdp-fs-plain) .gdp .gdp-wrap.gdp-mico.is-playing{padding-top:22px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-playing .gdp-mico-eq-h{font-size:58px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-playing .gdp-mico-total{font-size:36px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-playing .gdp-mico-stage{row-gap:12px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-num{width:124px;height:124px;font-size:80px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-galsug-r{font-size:104px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-galsug-l{font-size:30px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage.has-sug .gdp-mico-galsug-r{font-size:clamp(64px,12svh,104px);}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-pad{gap:8px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .dart-detail{padding:clamp(12px,2svh,22px) 8px !important;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-score{font-size:clamp(44px,6.2svh,60px) !important;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-playing .gdp-mico-pad .gdp-mico-undo{height:44px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-pad,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-pad{gap:8px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-keys,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-keys{gap:8px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-key,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-key{height:clamp(50px,7svh,64px);}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico:not(.is-scolia) .gdp-mico-field,html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-keys .gdp-mico-field{height:clamp(54px,7svh,64px);}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-playing .gdp-mico-stage.gdp-mico-stage{row-gap:12px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-strip li{height:74px;gap:4px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-strip span{font-size:17px;min-height:20px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico-strip b{font-size:36px;}
}
/* Full screen on a very large screen (1440p and up): wider still. */
@media (min-width:2200px) and (min-height:1300px){
  html.gdp-fs:not(.gdp-fs-plain) .gdp .gdp-wrap.gdp-mico.is-playing > section.gdp-mico-play{max-width:min(100%,2160px);}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-pad{width:min(100%,1800px);}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-score{font-size:clamp(80px,8svh,120px) !important;}
}
/* With a board, page view on a screen up to 900 px high (a laptop, a
   landscape tablet): the dart boxes stay large in the middle and the rest
   is tighter in height, so the row of numbers stays on screen. */
@media (min-width:861px) and (min-height:600px) and (max-height:900px){
  html:not(.gdp-fs) .gdp .gdp-wrap.gdp-mico.is-scolia:not(.is-keys).is-playing{padding-top:22px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys).is-playing .gdp-mico-stage.gdp-mico-stage{row-gap:12px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-num{width:124px;height:124px;font-size:80px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys).is-playing .gdp-mico-eq-h{font-size:58px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys).is-playing .gdp-mico-total{font-size:36px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-stage.has-sug .gdp-mico-galsug-r{font-size:clamp(64px,12svh,104px);}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-pad{gap:8px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys) .dart-detail{padding:clamp(12px,2svh,22px) 8px !important;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys) .js-dart-detail-score{font-size:clamp(44px,6.2svh,60px) !important;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys).is-playing .gdp-mico-pad .gdp-mico-undo{height:44px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-strip li{height:74px;gap:4px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-strip b{font-size:36px;}
  html:not(.gdp-fs) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-strip span{font-size:17px;min-height:20px;}
}

/* Bundles (Exponential 23, Pivot 24, 11-19 Big Bundle 27, Cricket 43): the
   game's own name is the accent, "Bundle" is white. */
.gdp-mico:is([data-app="23"],[data-app="24"],[data-app="27"],[data-app="43"]) .gdp-mico-title{color:var(--gdp-accent);}
.gdp-mico:is([data-app="23"],[data-app="24"],[data-app="27"],[data-app="43"]) .gdp-mico-title span{color:#fff;}

/* Three Stooges with a board: the three targets over the dart boxes, one
   over each box, in throwing order. */
.gdp-mico-dtargets{list-style:none;margin:0 0 2px;padding:0;display:none;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:8px;align-self:stretch;}
.gdp-mico.is-scolia:not(.is-keys) .gdp-mico-dtargets:not(.is-hidden){display:grid;}
.gdp-mico-dtarget{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 4px 8px;position:relative;text-align:center;}
.gdp-mico-dtarget::after{content:"";position:absolute;left:22%;right:22%;bottom:0;height:3px;border-radius:2px;background:transparent;transition:background .2s;}
.gdp-mico-dtarget-d{font-family:var(--gdp-font);font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--mico-steel-2);}
.gdp-mico-dtarget-t{font-family:"Anton",var(--gdp-font);font-weight:400;font-size:clamp(34px,3.6vw,56px);line-height:1;color:#fff;letter-spacing:.02em;transition:color .2s;}
.gdp-mico-dtarget-s{font-family:var(--gdp-font);font-size:13px;letter-spacing:.14em;text-transform:uppercase;min-height:1.2em;}
.gdp-mico-dtarget.is-now .gdp-mico-dtarget-t{color:var(--mico-gold);}
.gdp-mico-dtarget.is-now .gdp-mico-dtarget-d{color:var(--mico-gold);}
.gdp-mico-dtarget.is-now::after{background:var(--gdp-accent);}
.gdp-mico-dtarget.is-hit .gdp-mico-dtarget-t,.gdp-mico-dtarget.is-hit .gdp-mico-dtarget-s{color:#3ddc84;}
.gdp-mico-dtarget.is-miss .gdp-mico-dtarget-t{color:#6b7277;}
.gdp-mico-dtarget.is-miss .gdp-mico-dtarget-s{color:#ff8a84;}
@media (min-width:861px) and (min-height:600px){
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-dtargets{column-gap:18px;padding:0 5px;}
}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-dtargets{column-gap:18px;padding:0 5px;}
@media (max-width:600px){
  .gdp-mico-dtarget{padding:2px 2px 6px;}
  .gdp-mico-dtarget-t{font-size:28px;}
  .gdp-mico-dtarget-d,.gdp-mico-dtarget-s{font-size:11px;letter-spacing:.1em;}
}
@media (max-width:600px) and (max-height:740px){
  .gdp-mico-dtarget-d,.gdp-mico-dtarget-s{display:none;}
  .gdp-mico-dtarget{padding:0 2px 5px;}
  .gdp-mico-dtarget-t{font-size:24px;}
}
@media (max-width:600px) and (max-height:740px){
  .gdp-mico.has-dtargets.is-scolia:not(.is-keys) .gdp-mico-padhead{display:none;}
}
/* A very short phone screen (under 600 px high): no room for the row; the
   ring still names the three targets. */
@media (max-width:600px) and (max-height:600px){
  .gdp-mico.is-scolia:not(.is-keys) .gdp-mico-dtargets:not(.is-hidden){display:none;}
}
/* The row of targets takes some height: the boxes are a little lower. */
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.has-dtargets.is-scolia:not(.is-keys) .dart-detail{padding:clamp(12px,2.2svh,30px) 8px !important;}
html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.has-dtargets.is-scolia:not(.is-keys) .gdp-mico-pad{gap:8px;}
@media (max-height:900px){
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.has-dtargets.is-scolia:not(.is-keys) .gdp-mico-dtarget{padding:2px 4px 6px;gap:0;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.has-dtargets.is-scolia:not(.is-keys) .gdp-mico-dtarget-s{display:none;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.has-dtargets.is-scolia:not(.is-keys) .gdp-mico-dtarget-t{font-size:30px;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.has-dtargets.is-scolia:not(.is-keys) .dart-detail{padding:8px !important;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.has-dtargets.is-scolia:not(.is-keys) .js-dart-detail-score{font-size:clamp(38px,5.2svh,52px) !important;}
  html.gdp-fs:not(.gdp-fs-plain) .gdp-mico.has-dtargets .gdp-mico-strip li{height:70px;}
}