
  :root{
    --ink: #0B1026;
    --ink-2: #141B3C;
    --ink-3: #1D2650;
    --star: #E9ECFF;
    --star-dim: #8B93C4;
    --paper: #F3ECDA;
    --paper-2: #EBE1C8;
    --paper-line: #D8C9A3;
    --amber: #E8A33D;
    --amber-deep: #C97F1E;
    --ok: #6FCF97;
    --bad: #E0637A;

    --c-mercury: #9C9691;
    --c-venus: #E4C15C;
    --c-earth: #4C8CE0;
    --c-mars: #C1502E;
    --c-jupiter: #C68B59;
    --c-saturn: #DCC08C;
    --c-uranus: #7FD8CE;
    --c-neptune: #3E63C9;
  }

  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  html{ height:100%; }
  body{
    background: radial-gradient(ellipse at 20% -10%, #1a2456 0%, var(--ink) 55%, #060812 100%);
    color: var(--star);
    font-family: 'Noto Sans KR', sans-serif;
    height: 100%;
    min-height: 100vh;
    overflow-x: hidden;
  }
  body::before{
    content:"";
    position:fixed; inset:0;
    background-image:
      radial-gradient(1.5px 1.5px at 10% 20%, rgba(255,255,255,.5) 50%, transparent 50%),
      radial-gradient(1.5px 1.5px at 80% 10%, rgba(255,255,255,.4) 50%, transparent 50%),
      radial-gradient(1px 1px at 60% 70%, rgba(255,255,255,.35) 50%, transparent 50%),
      radial-gradient(1.5px 1.5px at 30% 85%, rgba(255,255,255,.4) 50%, transparent 50%),
      radial-gradient(1px 1px at 90% 60%, rgba(255,255,255,.3) 50%, transparent 50%),
      radial-gradient(1.5px 1.5px at 45% 40%, rgba(255,255,255,.3) 50%, transparent 50%);
    background-size: 600px 600px;
    pointer-events:none;
    z-index:0;
  }
  .font-display{ font-family:'Jua', sans-serif; }

  .app{
    position:relative; z-index:1;
    max-width: 1380px;
    height: 100vh;
    margin: 0 auto;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
  }

  /* ===== Header ===== */
  .masthead{
    display:flex; align-items:flex-end; justify-content:space-between;
    gap: 16px; margin-bottom: 12px; flex-wrap: wrap; flex: none;
    border-bottom: 1px solid rgba(233,236,255,.14);
    padding-bottom: 10px;
  }
  .masthead h1{
    font-family:'Jua', sans-serif;
    font-size: clamp(19px, 2.4vw, 25px);
    margin: 0 0 3px;
    letter-spacing: .5px;
  }
  .masthead p{ margin:0; color: var(--star-dim); font-size: 12px; }
  .badge-log-no{
    font-size: 10px; letter-spacing: 1px; color: var(--star-dim);
    border: 1px solid rgba(233,236,255,.2); border-radius: 999px;
    padding: 3px 10px;
  }
  .masthead-actions{ display:flex; align-items:center; gap:8px; }
  .sound-toggle{
    width:36px; height:36px; border-radius:50%; border:1px solid rgba(233,236,255,.24);
    background:rgba(233,236,255,.08); color:var(--star); font-size:18px;
    display:grid; place-items:center; cursor:pointer;
  }
  .sound-toggle:hover{ background:rgba(233,236,255,.15); }
  .sound-toggle.muted{ color:var(--star-dim); opacity:.7; }

  /* ===== Layout: tablet-landscape first ===== */
  .layout{
    display:grid;
    grid-template-columns: 286px minmax(0,1fr);
    gap: 14px;
    align-items: stretch;
    flex: 1;
    min-height: 0;
  }
  @media (max-width: 880px){
    .app{ height: auto; min-height: 100vh; }
    .layout{ grid-template-columns: 1fr; }
  }

  .side-panel{
    display:flex;
    flex-direction: column;
    gap: 12px;
    min-height: 0;
  }

  /* ===== Player rail ===== */
  .rail{
    display:flex;
    flex-direction: column;
    gap:9px;
    min-height: 0;
    overflow-y: auto;
    max-height: 39vh;
  }
  @media (max-width: 880px){
    .side-panel{ min-height:auto; }
    .rail{ flex-direction: row; flex-wrap: wrap; }
    .rail .player-card{ flex: 1 1 45%; }
  }
  .player-card{
    background: linear-gradient(180deg, var(--ink-3), var(--ink-2));
    border: 1px solid rgba(233,236,255,.1);
    border-radius: 12px;
    padding: 10px 12px;
    position: relative;
    flex: none;
    transition: box-shadow .25s ease, border-color .25s ease;
  }
  .player-card.active{
    border-color: var(--player-color, var(--amber));
    box-shadow: 0 0 0 1px var(--player-color, var(--amber)), 0 8px 24px -8px var(--player-color, var(--amber));
  }
  .player-card.bankrupt{ opacity:.4; filter: grayscale(1); }
  .player-top{ display:flex; align-items:center; gap:8px; margin-bottom:5px;}
  .player-dot{ width:12px; height:12px; border-radius:50%; background:var(--player-color); flex:none; box-shadow: 0 0 10px var(--player-color);}
  .player-name{ font-weight:700; font-size:14.5px; flex:1; }
  .player-turn-tag{
    font-size:9.5px; color: var(--ink); background: var(--amber);
    padding: 2px 7px; border-radius: 999px; font-weight:700; display:none;
  }
  .player-card.active .player-turn-tag{ display:inline-block; }
  .player-finance{
    display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:6px;
    margin:7px 0 8px;
  }
  .finance-part{
    min-width:0; padding:6px 8px; border:1px solid rgba(233,236,255,.1);
    border-radius:6px; background:rgba(255,255,255,.045);
  }
  .finance-label{ display:block; color:var(--star-dim); font-size:10.5px; margin-bottom:2px; }
  .finance-rate{ color:var(--amber); font-size:9.5px; font-weight:700; }
  .finance-value{
    display:block; font-family:'Jua'; font-size:17px; color:var(--star);
    white-space:nowrap;
  }
  .finance-total{
    grid-column:1 / -1; display:flex; align-items:baseline; justify-content:space-between;
    gap:8px; padding:7px 9px; border:1px solid rgba(232,163,61,.42);
    border-radius:6px; background:rgba(232,163,61,.12);
  }
  .finance-total .finance-label{ margin:0; color:#FFE29B; font-size:13px; font-weight:700; }
  .finance-total .finance-value{ color:var(--amber); font-size:22px; }
  .player-owned{ display:flex; flex-wrap:wrap; gap:4px; min-height: 16px;}
  .owned-chip{
    font-size: 10.8px; padding: 2px 6px; border-radius: 999px;
    background: rgba(255,255,255,.08); color: var(--star);
    border: 1px solid rgba(255,255,255,.1);
  }
  .player-status{ font-size: 10.5px; color: var(--bad); margin-top:4px; min-height:13px;}

  .setup-box{
    background: rgba(255,255,255,.03);
    border: 1px dashed rgba(233,236,255,.25);
    border-radius: 14px; padding: 16px;
  }
  .setup-box h3{ margin:0 0 10px; font-family:'Jua'; font-size:15px;}
  .setup-row{ display:flex; align-items:center; gap:8px; margin-bottom:8px;}
  .setup-row input[type=text]{
    flex:1; background: #fff; border: 1px solid var(--paper-line);
    border-radius: 8px; padding: 8px 11px; color: #2A2110; font-size:13.5px;
  }
  .setup-row input[type=text]::placeholder{ color: #9c8f68; }
  .setup-row input[type=text]:focus{ outline: 2px solid var(--amber); outline-offset: 1px; }
  .setup-row .swatch{ width:22px;height:22px;border-radius:50%; flex:none; border: 2px solid rgba(42,33,16,.3);}
  .remove-player{
    width:34px; height:34px; flex:none; border:1px solid rgba(42,33,16,.28);
    border-radius:50%; background:rgba(42,33,16,.07); color:#6b6046;
    font-size:20px; line-height:1; cursor:pointer;
  }
  .remove-player:hover{ background:#F4D2D9; color:#9E2840; }
  .btn{
    font-family:'Jua'; cursor:pointer; border:none; border-radius: 10px;
    padding: 10px 16px; font-size: 14px; transition: transform .12s ease, filter .12s ease;
  }
  .btn:active{ transform: scale(.96); }
  .btn:disabled{ opacity:.4; cursor:not-allowed; }
  .btn-amber{ background: linear-gradient(180deg, var(--amber), var(--amber-deep)); color: #2B1A00; }
  .btn-amber:hover:not(:disabled){ filter:brightness(1.08); }
  .btn-ghost{ background: rgba(42,33,16,.08); color:#2A2110; border: 1px solid rgba(42,33,16,.28); }
  .btn-ghost:hover{ background: rgba(42,33,16,.15); }
  .btn-block{ width:100%; }

  /* ===== Board ===== */
  .board-wrap{
    background: radial-gradient(ellipse at center, #0E1740 0%, #070B1E 100%);
    border: 1px solid rgba(233,236,255,.12);
    border-radius: 16px;
    padding: 8px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
  }
  .board{
    display:grid;
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 4px;
    aspect-ratio: 3/2;
    position: relative;
    max-width: 100%;
    max-height: 100%;
  }
  .tile{
    border-radius: 7px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(233,236,255,.08);
    position: relative;
    display:flex; flex-direction:column;
    align-items:center; justify-content:center;
    padding: 2px;
    overflow:hidden;
    cursor: default;
  }
  .tile .tk{ font-size: 10.5px; font-weight:700; text-align:center; line-height:1.16; color: var(--star); }
  .tile .ti{ font-size: 17px; margin-bottom:1px; }
  .tile.planet{ border-bottom: 3px solid var(--planet-color); }
  .tile.planet .tk{ color: #fff; }
  .tile.body{ background: rgba(111,207,151,.1); border-color: rgba(111,207,151,.35); }
  .tile.quiz{ background: rgba(232,163,61,.1); border-color: rgba(232,163,61,.35); }
  .tile.mission{ background: rgba(224,99,122,.12); border-color: rgba(224,99,122,.36); }
  .tile.corner{ background: rgba(255,255,255,.06); }
  .tile .owner-flag{
    position:absolute; top:3px; right:3px; width:11px; height:11px; border-radius:50%;
    box-shadow: 0 0 4px rgba(0,0,0,.6);
  }
  .tile .stage-badge{
    position:absolute; top:2px; left:3px;
    font-size: 8.5px; font-weight:900; color:#fff;
    text-shadow: 0 1px 2px rgba(0,0,0,.7);
  }
  .tile.planet .tk{
    position:absolute; left:3px; bottom:3px; z-index:2;
    padding:2px 4px; border-radius:4px; background:rgba(5,8,22,.84);
    text-shadow:0 1px 2px #000;
  }
  .tile .price-tag{
    position:absolute; right:3px; bottom:3px; z-index:2;
    padding:2px 4px; border-radius:4px; background:rgba(232,163,61,.92);
    color:#241600; font-size:9.5px; font-weight:900; line-height:1.15;
    box-shadow:0 1px 4px rgba(0,0,0,.45);
  }
  .planet-photo{
    display:block; width:min(54px, 84%); height:calc(100% - 12px); max-height:52px;
    margin-bottom:10px;
    object-fit:contain; filter:drop-shadow(0 2px 5px rgba(0,0,0,.72));
  }
  .planet-photo.saturn{ width:min(64px, 96%); }
  .body-photo{
    display:block; width:min(52px, 84%); height:46px; margin-bottom:2px;
    object-fit:contain; filter:drop-shadow(0 2px 5px rgba(0,0,0,.72));
  }
  .body-photo.sun{ filter:drop-shadow(0 0 7px rgba(255,224,139,.5)); }
  .modal-planet-photo{
    width:42px; height:42px; object-fit:contain; vertical-align:middle;
    margin-right:5px; filter:drop-shadow(0 3px 6px rgba(0,0,0,.5));
  }
  .choice-planet-photo{
    width:32px; height:32px; object-fit:contain; vertical-align:middle;
    margin-right:8px; filter:drop-shadow(0 2px 4px rgba(0,0,0,.35));
  }
  .board-center{
    grid-column: 2 / 9; grid-row: 2 / 6;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap: 14px;
    background: radial-gradient(circle, rgba(232,163,61,.06), transparent 70%);
    border-radius: 12px;
  }
  .center-title{ font-family:'Jua'; font-size: clamp(16px,2vw,22px); color: var(--star-dim); text-align:center; letter-spacing:1px;}
  .dice-row{ display:flex; gap:18px; }
  .die{
    width: 70px; height:70px; border-radius: 14px;
    background: linear-gradient(160deg,#fff,#dcdcec);
    box-shadow: 0 6px 16px rgba(0,0,0,.4);
    display:grid;
    grid-template-columns: repeat(3,1fr);
    grid-template-rows: repeat(3,1fr);
    grid-template-areas:
      "tl .  tr"
      "ml mc mr"
      "bl .  br";
    gap: 2px;
    padding: 11px;
  }
  .die.rolling{ animation: dieShake .11s linear infinite; }
  @keyframes dieShake{
    0%{ transform: rotate(0deg) scale(1); }
    50%{ transform: rotate(10deg) scale(1.06); }
    100%{ transform: rotate(-10deg) scale(1); }
  }
  .pip{
    width: 11px; height:11px; border-radius:50%;
    background:#1E2333; align-self:center; justify-self:center;
    opacity:0; transform: scale(.4); transition: opacity .08s ease, transform .08s ease;
  }
  .pip.on{ opacity:1; transform: scale(1); }
  .pip-tl{ grid-area: tl; } .pip-tr{ grid-area: tr; }
  .pip-ml{ grid-area: ml; } .pip-mc{ grid-area: mc; } .pip-mr{ grid-area: mr; }
  .pip-bl{ grid-area: bl; } .pip-br{ grid-area: br; }
  #turnPrompt{ width:100%; text-align:center; }
  #rollBtn{
    min-width: 250px;
    padding: 14px 24px;
    font-size: 20px;
    box-shadow: 0 7px 16px rgba(0,0,0,.28);
  }
  .turn-log{
    width: 100%;
    background: rgba(0,0,0,.3);
    border-radius: 10px; padding: 10px 12px;
    font-size: 13.5px; color: var(--star-dim);
    max-height: 230px; overflow-y:auto;
    border: 1px solid rgba(233,236,255,.08);
  }
  .turn-log div{ margin-bottom:3px; }
  .turn-log div:first-child{ color: var(--star); }

  .token{
    position:absolute; width: 18px; height:18px; border-radius:50%;
    border: 2px solid rgba(255,255,255,.85);
    transition: top .34s ease, left .34s ease, transform .22s ease;
    box-shadow: 0 2px 6px rgba(0,0,0,.5);
    z-index: 5;
  }
  .token.moving{
    transform: scale(1.25);
    box-shadow: 0 0 0 4px rgba(255,255,255,.14), 0 4px 13px rgba(0,0,0,.55);
  }

  /* ===== Side tool panel ===== */
  .journal{
    background: linear-gradient(180deg, rgba(29,38,80,.96), rgba(20,27,60,.96));
    color: var(--star);
    border-radius: 14px;
    padding: 16px;
    box-shadow: 0 14px 30px -14px rgba(0,0,0,.6);
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: hidden;
    display:flex;
    flex-direction:column;
    gap: 12px;
  }
  .journal-tab{
    font-family:'Jua'; font-size: 11px; letter-spacing:2px; color: var(--amber);
    margin-bottom: 6px;
  }
  .journal h2{ font-family:'Jua'; margin: 0; font-size: 21px; color:var(--star); }
  .journal-empty{ font-size: 13px; color:var(--star-dim); line-height:1.7; }
  .planet-visual{
    display:block; width:min(260px, 86%); height:150px; margin:6px auto 16px;
    object-fit:contain; filter:drop-shadow(0 8px 14px rgba(0,0,0,.45));
  }
  .body-visual{
    display:block; width:min(240px, 82%); height:138px; margin:6px auto 16px;
    object-fit:contain; filter:drop-shadow(0 8px 14px rgba(0,0,0,.45));
  }
  .card-field{ margin-bottom: 10px; }
  .card-field .lb{ font-size: 12px; color:#8a7c52; font-weight:700; margin-bottom:2px;}
  .card-field .vl{ font-size: 15.5px; line-height:1.55; }
  .card-divider{ border:none; border-top:1px dashed var(--paper-line); margin: 12px 0; }
  .quiz-opt{
    display:block; width:100%; text-align:left; background: rgba(255,255,255,.5);
    border: 1px solid var(--paper-line); border-radius: 8px; padding: 9px 12px;
    margin-bottom: 7px; font-size: 13.5px; cursor:pointer; color:#2A2110;
    font-family:'Noto Sans KR';
  }
  .quiz-opt:hover{ background: #fff; }
  .quiz-opt.correct{ background:#CDEBD6; border-color:#6FCF97; }
  .quiz-opt.wrong{ background:#F4D2D9; border-color:#E0637A; }
  .answer-box{
    background: rgba(255,255,255,.55);
    border: 1px dashed var(--paper-line);
    border-radius: 10px;
    padding: 10px 12px;
    margin: 10px 0 12px;
    font-size: 14px;
    line-height: 1.6;
    text-align: left;
  }
  .golden-key-card{
    background: linear-gradient(160deg, #FFF3A3, #E8A33D 58%, #B86C17);
    border: 2px solid #8f5314;
    border-radius: 14px;
    padding: 18px;
    margin: 10px 0 16px;
    color:#2B1A00;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 10px 24px rgba(0,0,0,.22);
  }
  .golden-choice-grid{
    display:grid; grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px; margin:14px 0 18px; perspective:900px;
  }
  .golden-choice{
    min-width:0; height:176px; border:0; padding:0; background:transparent;
    cursor:pointer; perspective:900px;
  }
  .golden-choice:disabled{ cursor:default; opacity:.62; }
  .golden-choice.flipped{ opacity:1; }
  .golden-choice-inner{
    position:relative; display:block; width:100%; height:100%;
    transform-style:preserve-3d; transition:transform .65s ease;
  }
  .golden-choice.flipped .golden-choice-inner{ transform:rotateY(180deg); }
  .golden-choice-face{
    position:absolute; inset:0; display:flex; flex-direction:column;
    align-items:center; justify-content:center; padding:12px;
    border:2px solid #8f5314; border-radius:10px;
    backface-visibility:hidden; box-shadow:0 9px 20px rgba(0,0,0,.2);
  }
  .golden-choice-back{
    background:linear-gradient(145deg, #36200D, #9B5C18 55%, #3C210C);
    color:#FFE58D;
  }
  .golden-choice-back .key-mark{ font-size:42px; margin-bottom:8px; }
  .golden-choice-back b{ font-family:'Jua'; font-size:15px; }
  .golden-choice-front{
    transform:rotateY(180deg);
    background:linear-gradient(160deg, #FFF3A3, #E8A33D 58%, #B86C17);
    color:#2B1A00; font-size:12.5px; line-height:1.45;
  }
  .golden-choice-front b{ font-family:'Jua'; font-size:16px; margin-bottom:8px; }
  .choice-grid{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 8px 0 14px;
  }
  .choice-grid.three{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .choice-grid.order-grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px;
    margin: 6px 0 10px;
  }
  .record-choice{
    border: 1px solid var(--paper-line);
    background: rgba(255,255,255,.55);
    color:#2A2110;
    border-radius: 10px;
    padding: 10px 8px;
    font-family:'Jua';
    font-size: 14px;
    cursor:pointer;
  }
  .order-grid .record-choice{
    padding: 8px 4px;
    border-radius: 8px;
    font-size: 13px;
  }
  .record-choice.selected{
    background: linear-gradient(180deg, var(--amber), var(--amber-deep));
    border-color: #8f5314;
    color:#2B1A00;
    box-shadow: 0 0 0 2px rgba(232,163,61,.2);
  }
  .record-choice.correct{
    background:#CDEBD6;
    border-color:#6FCF97;
  }
  .record-choice.wrong{
    background:#F4D2D9;
    border-color:#E0637A;
  }
  .journal-record{
    text-align:left;
    background: rgba(255,255,255,.58);
    border:1px solid var(--paper-line);
    border-radius: 10px;
    padding: 10px 12px;
    margin-bottom: 8px;
    font-size:14px;
    line-height:1.55;
  }

  /* ===== Modal ===== */
  .modal-backdrop{
    position:fixed; inset:0; background: rgba(4,6,20,.72);
    display:flex; align-items:center; justify-content:center;
    z-index: 80; padding: 20px;
  }
  .modal-card{
    background: var(--paper);
    background-image: repeating-linear-gradient(var(--paper) 0px, var(--paper) 27px, var(--paper-line) 28px);
    color:#2A2110; border-radius: 16px; padding: 26px;
    width: 100%; max-width: 540px; max-height:calc(100vh - 40px); overflow-y:auto;
    box-shadow: 0 24px 60px -18px rgba(0,0,0,.7);
    text-align:center;
  }
  .modal-card h3{ font-family:'Jua'; font-size:22px; margin:4px 0 10px;}
  .modal-card p{ font-size: 15.5px; line-height:1.6; margin: 0 0 16px; color:#4a3f22;}
  .modal-amount{ font-family:'Jua'; font-size: 34px; margin: 6px 0 16px;}
  .modal-amount.pos{ color:#2E9E5B; }
  .modal-amount.neg{ color:#C43A55; }

  .setup-gate{
    position:fixed; inset:0; z-index:60; background: var(--ink);
    display:flex; align-items:center; justify-content:center; padding:20px;
  }
  .gate-card{
    background: var(--paper);
    border-radius: 18px; padding: 30px; max-width: 420px; width:100%;
    max-height:calc(100vh - 40px); overflow-y:auto;
    color:#2A2110; box-shadow: 0 24px 60px -14px rgba(0,0,0,.6);
  }
  .gate-card h2{ font-family:'Jua'; margin:0 0 4px; font-size:22px; }
  .gate-card .sub{ font-size:12.5px; color:#7a6c46; margin-bottom:18px;}
  .game-mode-box{ margin:16px 0; padding-top:14px; border-top:1px solid var(--paper-line); }
  .game-mode-label{ font-family:'Jua'; font-size:15px; margin-bottom:8px; }
  .mode-tabs{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:6px; }
  .mode-tab{
    border:1px solid rgba(42,33,16,.25); background:rgba(42,33,16,.06);
    border-radius:8px; padding:9px 5px; font-family:'Jua'; color:#4a3f22; cursor:pointer;
  }
  .mode-tab.selected{ background:var(--amber); border-color:#9B5C18; color:#2B1A00; }
  .mode-config{ display:none; align-items:center; gap:8px; margin-top:9px; }
  .mode-config.active{ display:flex; }
  .mode-config label{ flex:1; font-size:13px; color:#6b6046; }
  .mode-config select{
    width:132px; border:1px solid var(--paper-line); border-radius:8px;
    background:#fffaf0; padding:8px; font-family:'Noto Sans KR'; color:#2A2110;
  }
  .lap-stepper{ display:grid; grid-template-columns:34px 64px 34px; align-items:center; gap:4px; }
  .lap-stepper button{
    width:34px; height:34px; border:1px solid rgba(42,33,16,.25); border-radius:50%;
    background:rgba(42,33,16,.07); color:#2A2110; font-family:'Jua'; font-size:20px; cursor:pointer;
  }
  .lap-stepper button:disabled{ opacity:.35; cursor:not-allowed; }
  .lap-stepper output{ font-family:'Jua'; font-size:15px; text-align:center; color:#2A2110; }
  .game-status{
    min-height:26px; padding:5px 12px; border:1px solid rgba(232,163,61,.4);
    border-radius:8px; color:var(--amber); background:rgba(232,163,61,.08);
    font-family:'Jua'; font-size:14px;
  }
  .result-list{ text-align:left; margin:12px 0 18px; }
  .result-row{
    display:grid; grid-template-columns:34px 1fr auto; align-items:center;
    gap:8px; padding:9px 4px; border-bottom:1px solid var(--paper-line); font-size:14px;
  }
  .result-row:first-child{ font-weight:700; color:#8a5a14; }

  .win-icon{ font-size: 46px; }

  ::-webkit-scrollbar{ width:6px; }
  ::-webkit-scrollbar-thumb{ background: rgba(233,236,255,.2); border-radius:4px;}
