*{box-sizing:border-box} :root{color-scheme:light;--ink:#14364a;--red:#bb2425;--paper:#f4e6c8}body{margin:0;background:#ad7546;background-image:repeating-linear-gradient(3deg,#0000 0 14px,#6f3c2222 15px 17px);color:var(--ink);font-family:"Noto Serif TC","Songti TC",Georgia,serif;font-weight:600}button,select{font:inherit;cursor:pointer;color:inherit}button{min-height:40px;border:1px solid #836544;border-radius:8px;background:#f5e6c7;padding:7px 12px;touch-action:manipulation}button:hover{filter:brightness(1.07)}button:focus-visible,select:focus-visible{outline:3px solid #097fab;outline-offset:3px}button:disabled{opacity:.55;cursor:wait} .game{max-width:620px;margin:auto;min-height:100svh;background-color:var(--paper);background-image:radial-gradient(#764c2820 .65px,transparent .9px);background-size:4px 4px;padding:10px 14px 18px;box-shadow:0 0 60px #3a201b80}header .brand{height:auto;aspect-ratio:5.25;background-image:url(reference.png);background-size:100% auto;background-position:top;border-bottom:2px solid #b32523}nav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0}nav span{font-size:13px;letter-spacing:2px}nav button{font-size:14px;background:transparent;border:0;padding:5px}.turnbar{border:2px solid var(--ink);border-radius:9px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:6px;background:#fff3d9;box-shadow:2px 3px 0 #b9956b;margin-top:10px;font-size:14px}.turnbar strong{color:var(--red);font-size:17px}.turnbar button{font-size:13px;min-height:32px;padding:4px 7px}.board-stage{perspective:1100px;padding:12px 0 0}.board{position:relative;transform:rotateX(12deg);transform-origin:50% 70%;border:3px solid #356666;border-radius:5px;box-shadow:0 7px 0 #31534c,0 13px 13px #583b4570;background:#eee0bc}.board>img{width:100%;display:block;border-radius:2px}.grid{position:absolute;left:2.4%;right:2.4%;top:2.4%;bottom:5.6%;display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr)}.cell{padding:0;min-height:0;border:0;border-radius:0;background:transparent;position:relative;font-family:system-ui;font-size:12px}.cell:hover{background:#fff7;outline:2px solid #fff}.cell span{display:none;background:#fffa;color:#98211e;position:absolute;bottom:0;right:0;padding:0 2px}.show-numbers .cell span{display:block}.cell.lit{background:#ffd23950;box-shadow:inset 0 0 0 2px #fff98f,0 0 12px #ffda22}.pieces{display:block;pointer-events:none}.pawn{position:absolute;font-family:Georgia,serif;font-size:clamp(23px,6.8vw,42px);line-height:1;transform:translate(-50%,-76%);color:var(--color);text-shadow:1px 1px 0 #ffeb9e,2px 3px 0 #56291d,3px 5px 3px #0008;transition:left .2s ease,top .2s ease;filter:drop-shadow(0 2px 2px #422)}.pawn.active{filter:drop-shadow(0 0 4px #fff200)}.pawn.jump{animation:hop .22s ease}.boardtools{display:flex;align-items:center;justify-content:space-between;margin:12px 0 6px;font:12px system-ui;gap:6px}.boardtools button{font-size:12px;min-height:32px}.console{display:flex;align-items:center;gap:15px;border-top:3px double #8e6240;padding:14px 3px 10px}.tray{padding:13px 17px;background:repeating-linear-gradient(8deg,#865532,#986846 8px,#8a573c 10px);border:5px solid #be8c56;box-shadow:inset 0 3px 7px #34271e99,0 3px 0 #6b452c;border-radius:18px}.die{width:62px;height:62px;display:grid;place-items:center;background:#fff1cb;color:#31281e;border-radius:13px;box-shadow:3px 5px 0 #bea574,5px 8px 5px #4228;font:60px/1 Georgia;transform:rotate(-7deg)}.die.rolling{animation:shake .16s infinite}.controls{flex:1;min-width:0}.controls p{font-size:15px;min-height:40px;margin:0 0 8px;line-height:1.45}.primary{border:3px solid #862220;background:radial-gradient(#fff2 .7px,transparent 1px),#bd2928;background-size:4px 4px;color:#fff3cf;box-shadow:0 4px 0 #752c24,inset 0 0 0 2px #edb575;border-radius:18px;width:100%;font-size:25px;letter-spacing:2px;padding:9px 15px;min-height:53px;text-shadow:1px 2px #792319}.primary span{float:right}.players{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;padding:12px 0 4px}.player{text-align:center;border:1px solid #b89e77;background:#fff3d5;border-radius:8px;padding:5px 3px;font-size:14px}.player.current{outline:2px solid var(--color);background:#fff7de;box-shadow:0 0 14px #e7bd6480}.player .token{font:35px Georgia;color:var(--color);text-shadow:1px 2px #582919}.player small{display:block;font-size:12px;margin-top:2px}footer{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;margin-top:14px}footer button{font-size:13px;min-height:34px}dialog{width:min(90vw,430px);border:5px double #ba2827;border-radius:19px;padding:22px;background:var(--paper);color:var(--ink);box-shadow:9px 14px 0 #472b3255;max-height:85svh;overflow:auto}dialog::backdrop{background:#14272a99;backdrop-filter:blur(2px)}dialog h2{color:#b22424;font-size:28px;margin:0 0 14px}dialog p{line-height:1.7}dialog .primary{font-size:20px;margin-top:15px}.event-art{height:145px;background-image:url(board.png);background-size:250%;border:3px solid #d3b775;border-radius:10px;margin:10px 0}.event-route{font-size:35px;color:#b22424;text-align:center;margin:10px}.configrow{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px dashed #b7a17f}.configrow select{padding:8px;background:#fff6dd;border:1px solid #997451;border-radius:6px;max-width:65%}.rulelist{font-size:16px;line-height:1.7;padding-left:22px}.note{font-size:13px;color:#66574a}#confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:5}#confetti i{position:absolute;width:8px;height:17px;top:-25px;animation:fall 3s linear forwards}@keyframes fall{to{transform:translateY(110vh) rotate(600deg)}}@keyframes hop{50%{transform:translate(-50%,-115%)}}@keyframes shake{50%{transform:rotate(18deg) translateY(-5px)}}@media(min-width:800px){.game{margin:20px auto;border-radius:12px;padding:14px 22px}.board-stage{padding-top:10px}}@media(max-width:370px){.game{padding:6px 8px}.turnbar{font-size:12px}.turnbar strong{font-size:14px}nav span{display:none}.tray{padding:11px}.controls p{font-size:14px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.board{transform:none}}
