*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter,system-ui,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}:root{--radius: .5rem;--background: 220 20% 10%;--foreground: 40 20% 90%;--card: 220 15% 15%;--card-foreground: 40 20% 90%;--popover: 220 15% 12%;--popover-foreground: 40 20% 90%;--primary: 40 65% 50%;--primary-foreground: 220 20% 10%;--secondary: 220 10% 25%;--secondary-foreground: 40 20% 90%;--muted: 220 10% 20%;--muted-foreground: 40 10% 60%;--accent: 40 65% 50%;--accent-foreground: 220 20% 10%;--destructive: 0 60% 50%;--destructive-foreground: 40 20% 90%;--border: 220 10% 25%;--input: 220 10% 25%;--ring: 40 65% 50%;--animation-duration: .3s;--animation-easing: cubic-bezier(.4, 0, .2, 1);--dice-animation-duration: .5s;--board-max-width: 900px;--board-aspect-ratio: 1.6;--frame-height: 24px;--bar-width: 60px;--tray-width: 56px}body[data-animation-level=minimal]{--animation-duration: .15s;--animation-easing: ease-out;--dice-animation-duration: .2s}body[data-animation-level=rich]{--animation-duration: .5s;--animation-easing: cubic-bezier(.34, 1.56, .64, 1);--dice-animation-duration: .8s}*{border-color:hsl(var(--border))}body{background-color:hsl(var(--background));color:hsl(var(--foreground));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"rlig" 1,"calt" 1}html{scroll-behavior:smooth}:focus-visible{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000);--tw-ring-opacity: 1;--tw-ring-color: rgb(212 175 55 / var(--tw-ring-opacity, 1));--tw-ring-offset-width: 2px;--tw-ring-offset-color: hsl(var(--background))}.btn-premium{position:relative;overflow:hidden;border-radius:var(--radius);padding:.75rem 1.5rem;font-weight:600;background-image:linear-gradient(to right,var(--tw-gradient-stops));--tw-gradient-from: #d4af37 var(--tw-gradient-from-position);--tw-gradient-to: rgb(212 175 55 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);--tw-gradient-to: #b8962e var(--tw-gradient-to-position);--tw-text-opacity: 1;color:rgb(77 58 46 / var(--tw-text-opacity, 1));--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.btn-premium:hover{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.btn-premium:active{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.btn-premium:before{content:"";position:absolute;inset:0;background-image:linear-gradient(to right,var(--tw-gradient-stops));--tw-gradient-from: transparent var(--tw-gradient-from-position);--tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);--tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), rgb(255 255 255 / .2) var(--tw-gradient-via-position), var(--tw-gradient-to);--tw-gradient-to: transparent var(--tw-gradient-to-position);--tw-translate-x: -100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.5s}.btn-premium:hover:before{--tw-translate-x: 100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.board-container{position:relative;margin-left:auto;margin-right:auto;width:100%;max-width:56rem;overflow:hidden;border-radius:.75rem;--tw-shadow: 0 20px 60px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .1);--tw-shadow-colored: 0 20px 60px var(--tw-shadow-color), inset 0 1px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);aspect-ratio:var(--board-aspect-ratio)}.dice-container{display:flex;align-items:center;justify-content:center;gap:1rem;border-radius:var(--radius);background-color:#0003;padding:1rem;--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.\!dice,.dice{height:3rem;width:3rem;border-radius:var(--radius)}.\!dice,.dice{--tw-bg-opacity: 1;background-color:rgb(255 254 248 / var(--tw-bg-opacity, 1));--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.\!dice,.dice{display:flex;align-items:center;justify-content:center}.\!dice,.dice{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.\!dice.rolling{animation:diceRoll .5s ease-out}@keyframes diceRoll{0%{transform:rotateX(0) rotateY(0)}50%{transform:rotateX(360deg) rotateY(180deg)}to{transform:rotateX(720deg) rotateY(360deg)}}.dice.rolling{animation:diceRoll .5s ease-out}.\!dice.played,.dice.played{--tw-scale-x: .9;--tw-scale-y: .9;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:.4}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.visible{visibility:visible}.invisible{visibility:hidden}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.-bottom-8{bottom:-2rem}.-right-1{right:-.25rem}.-top-1{top:-.25rem}.bottom-1{bottom:.25rem}.bottom-2{bottom:.5rem}.left-1\/2{left:50%}.left-2{left:.5rem}.right-1{right:.25rem}.top-1\/2{top:50%}.top-2{top:.5rem}.block{display:block}.flex{display:flex}.grid{display:grid}.h-5{height:1.25rem}.h-full{height:100%}.w-5{width:1.25rem}.w-full{width:100%}.-translate-x-1\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.resize{resize:both}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.items-center{align-items:center}.justify-center{justify-content:center}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-4{gap:1rem}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:var(--radius)}.rounded-sm{border-radius:calc(var(--radius) - 4px)}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.bg-amber-600{--tw-bg-opacity: 1;background-color:rgb(217 119 6 / var(--tw-bg-opacity, 1))}.bg-black\/30{background-color:#0000004d}.bg-black\/60{background-color:#0009}.bg-red-600{--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity, 1))}.px-2{padding-left:.5rem;padding-right:.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.tracking-wider{letter-spacing:.05em}.text-amber-400{--tw-text-opacity: 1;color:rgb(251 191 36 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.text-white\/50{color:#ffffff80}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ring{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow{--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / .1)) drop-shadow(0 1px 1px rgb(0 0 0 / .06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-lg{--tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / .04)) drop-shadow(0 4px 3px rgb(0 0 0 / .1));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-xl{--tw-drop-shadow: drop-shadow(0 20px 13px rgb(0 0 0 / .03)) drop-shadow(0 8px 5px rgb(0 0 0 / .08));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}:root{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{margin:0;padding:0;min-height:100vh}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.game-board:has(.piece-selected) .point.valid-target{filter:brightness(1.2)}.point.valid-target:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,215,0,.3) 0%,transparent 70%);animation:target-pulse 1.5s ease-in-out infinite;pointer-events:none}@keyframes target-pulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.game-board[data-current-player=white] .piece.white:not(.on-bar){cursor:grab}.game-board[data-current-player=black] .piece.black:not(.on-bar){cursor:grab}.game-board[data-my-turn=true][data-current-player=white] .piece.black,.game-board[data-my-turn=true][data-current-player=black] .piece.white{opacity:.7;filter:saturate(.8)}.game-board:not([data-my-turn=true]) .piece{cursor:default;pointer-events:none}.point.hit-target:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(239,68,68,.4) 0%,transparent 70%);animation:hit-pulse 1s ease-in-out infinite;pointer-events:none}@keyframes hit-pulse{0%,to{opacity:.5}50%{opacity:1}}.piece.dragging{cursor:grabbing!important;z-index:1000!important;filter:drop-shadow(0 10px 20px rgba(0,0,0,.4));transform:scale(1.15)}.piece-ghost{opacity:.4;pointer-events:none;filter:grayscale(.5)}@keyframes invalid-shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-5px)}40%,80%{transform:translate(5px)}}.invalid-drop{animation:invalid-shake .3s ease-in-out}@keyframes turn-pulse{0%{box-shadow:inset 0 0 #ffd70000}50%{box-shadow:inset 0 0 30px 5px #ffd70026}to{box-shadow:inset 0 0 #ffd70000}}.game-board.turn-changed{animation:turn-pulse .8s ease-out}.game-board[data-my-turn=true]:before{content:"";position:absolute;inset:-2px;border-radius:inherit;background:linear-gradient(45deg,transparent,rgba(255,215,0,.1),transparent);z-index:-1;animation:turn-glow 3s ease-in-out infinite}@keyframes turn-glow{0%,to{opacity:.3}50%{opacity:.6}}.dice-premium{background:linear-gradient(145deg,#ffffffe6,#f0f0f0);border-radius:12%;box-shadow:3px 3px #c8c8c8,4px 4px #b4b4b4,5px 5px 10px #0000004d,inset -2px -2px 4px #0000001a,inset 2px 2px 4px #fffc}.dice-pip{background:radial-gradient(circle at 30% 30%,#444,#111);border-radius:50%;box-shadow:inset 1px 1px 2px #fff3}.dice-container.doubles:after{content:"";position:absolute;inset:-10px;border:2px solid rgba(255,215,0,.6);border-radius:16px;animation:doubles-glow 1s ease-out forwards}@keyframes doubles-glow{0%{opacity:1;transform:scale(.95)}to{opacity:0;transform:scale(1.1)}}.game-board:focus{outline:none}.game-board:focus-visible{outline:2px solid rgba(59,130,246,.8);outline-offset:4px}.game-board.keyboard-navigating{outline:2px dashed rgba(59,130,246,.6);outline-offset:2px}.game-board:focus-visible:after{content:"Use arrow keys to navigate, Enter to select";position:absolute;bottom:-30px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:4px 12px;border-radius:4px;font-size:12px;white-space:nowrap;opacity:0;animation:hint-fade 3s ease-out forwards;pointer-events:none}@keyframes hint-fade{0%,10%{opacity:1}to{opacity:0}}.skip-link{position:absolute;top:-40px;left:0;background:#3b82f6;color:#fff;padding:8px 16px;z-index:1000;transition:top .3s}.skip-link:focus{top:0}.landing-page{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;overflow:hidden}.landing-page:before{content:"";position:absolute;top:50%;left:50%;width:600px;height:600px;background:radial-gradient(circle,rgba(102,126,234,.15) 0%,transparent 70%);transform:translate(-50%,-50%);animation:ambientPulse 4s ease-in-out infinite}@keyframes ambientPulse{0%,to{opacity:.5;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}.floating-dice{position:absolute;width:60px;height:60px;opacity:.15;pointer-events:none;animation:floatDice 6s ease-in-out infinite}.floating-dice svg{width:100%;height:100%}.dice-1{top:15%;left:10%;color:#667eea;animation-delay:0s}.dice-2{top:20%;right:12%;color:#e94560;animation-delay:-2s;width:50px;height:50px}.dice-3{bottom:20%;left:15%;color:#764ba2;animation-delay:-4s;width:45px;height:45px}@keyframes floatDice{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-15px) rotate(5deg)}50%{transform:translateY(-5px) rotate(-3deg)}75%{transform:translateY(-20px) rotate(3deg)}}.landing-content{text-align:center;max-width:500px;position:relative;z-index:1}.title{font-size:64px;font-weight:800;margin:0 0 8px;letter-spacing:-2px;line-height:1}.title-cube{background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.title-clash{background:linear-gradient(135deg,#e94560,#c73659);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.subtitle{font-size:18px;font-weight:700;letter-spacing:12px;color:#ffffffe6;margin:0 0 8px;text-indent:12px}.tagline{font-size:14px;color:#ffffff80;margin:0 0 48px;font-style:italic}.connecting,.waiting{padding:48px}.connecting p,.waiting p{color:#888;margin:0}.actions{display:flex;flex-direction:column;gap:16px;align-items:center}.btn-premium{display:flex;align-items:center;justify-content:center;gap:10px;min-width:200px;padding:16px 32px;font-size:16px;font-weight:600;border-radius:12px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.btn-premium:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.btn-premium:hover:before{left:100%}.btn-premium.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 8px 24px #667eea66;border:none}.btn-premium.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 32px #667eea80}.btn-premium.btn-secondary{background:#ffffff1a;border:2px solid rgba(255,255,255,.2);box-shadow:0 4px 16px #0003}.btn-premium.btn-secondary:hover{transform:translateY(-3px);background:#ffffff26;border-color:#ffffff4d;box-shadow:0 8px 24px #0000004d}.btn-icon{display:flex;align-items:center;justify-content:center}.copyright{margin-top:64px;font-size:12px;color:#ffffff4d;letter-spacing:1px}.modal-overlay{position:fixed;inset:0;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#1a1a2e;border-radius:16px;padding:32px;min-width:320px;max-width:400px;box-shadow:0 20px 60px #00000080,0 0 0 1px #ffffff1a}.modal-content h2{margin:0 0 24px;text-align:center;font-size:24px;color:#fff}.difficulty-options{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}.difficulty-option{display:flex;align-items:center;gap:12px;padding:16px;background:#ffffff0d;border-radius:12px;cursor:pointer;transition:all .2s;border:2px solid transparent}.difficulty-option:hover{background:#ffffff1a}.difficulty-option:has(input:checked){border-color:#667eea;background:#667eea1a}.difficulty-option input[type=radio]{width:20px;height:20px;accent-color:#667eea}.difficulty-info{display:flex;flex-direction:column;gap:4px}.difficulty-label{font-size:16px;font-weight:600;color:#fff}.difficulty-desc{font-size:13px;color:#888}.modal-actions{display:flex;gap:12px;justify-content:center}.modal-actions .btn{flex:1}@media(max-width:768px){.landing-page{padding:16px}.landing-page:before{width:400px;height:400px}.floating-dice{display:none}.title{font-size:52px}.subtitle{font-size:16px;letter-spacing:10px;text-indent:10px}.tagline{margin-bottom:32px}.modal-content{min-width:280px;max-width:90vw;padding:24px}.copyright{margin-top:48px}}@media(max-width:480px){.landing-page{padding:12px}.landing-page:before{width:300px;height:300px}.landing-content{max-width:100%}.title{font-size:42px;letter-spacing:-1px}.subtitle{font-size:14px;letter-spacing:8px;text-indent:8px}.tagline{font-size:13px;margin-bottom:24px}.actions{gap:12px;width:100%}.btn-premium{width:100%;min-width:auto;padding:14px 24px}.connecting,.waiting{padding:32px 16px}.copyright{margin-top:32px;font-size:11px}.modal-overlay{padding:16px}.modal-content{min-width:auto;width:100%;max-width:100%;padding:20px;border-radius:12px}.modal-content h2{font-size:20px;margin-bottom:16px}.difficulty-options{gap:8px;margin-bottom:16px}.difficulty-option{padding:12px}.difficulty-label{font-size:14px}.difficulty-desc{font-size:12px}.modal-actions{flex-direction:column;gap:8px}.modal-actions .btn{width:100%}}@media(max-width:400px){.title{font-size:36px}.subtitle{font-size:12px;letter-spacing:6px;text-indent:6px}.tagline{font-size:12px}}.action-panel{display:flex;justify-content:center;align-items:center;gap:16px;padding:24px;flex-wrap:wrap}.move-counter{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#ffffff14;border-radius:8px;font-family:SF Mono,Monaco,Consolas,monospace}.move-counter-label{color:#fff9;font-size:12px;text-transform:uppercase;letter-spacing:.5px}.move-counter-value{color:gold;font-size:18px;font-weight:700}.doubles-badge{background:linear-gradient(135deg,gold,#ff8c00);color:#000;font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;text-transform:uppercase;animation:doubles-pulse 1s ease-in-out infinite}@keyframes doubles-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.btn{position:relative;display:flex;align-items:center;justify-content:center;gap:8px}.btn-icon{font-weight:800;font-size:14px}.keyboard-hint{position:absolute;top:-8px;right:-8px;background:#ffffff26;color:#ffffffb3;font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px;font-family:SF Mono,Monaco,Consolas,monospace;border:1px solid rgba(255,255,255,.2)}.btn-roll{min-width:140px}.btn-confirm{min-width:120px}.btn-undo{min-width:100px}.btn-double{min-width:100px;background:linear-gradient(135deg,gold,#fa0);color:#333;border:none;font-weight:600;box-shadow:0 4px 12px #ffd7004d}.btn-double:hover{transform:translateY(-2px);box-shadow:0 6px 16px #ffd70066}.move-hint{display:flex;align-items:center;gap:12px;padding:12px 20px;background:#ffffff14;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.dice-display{display:flex;gap:6px}.dice-pip{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:linear-gradient(145deg,#fff,#e8e8e8);color:#1a1a2e;font-weight:700;font-size:14px;border-radius:6px;box-shadow:0 2px 4px #0003}.hint-text{color:#ffffffb3;font-size:13px}.waiting-turn{padding:12px 24px;background:#ffffff14;border-radius:12px;color:#888;font-style:italic;border:1px solid rgba(255,255,255,.05)}.ai-thinking{display:flex;align-items:center;gap:8px;color:#667eea}.thinking-dots{display:flex;gap:4px}.thinking-dots:before,.thinking-dots:after{content:"";width:6px;height:6px;background:#667eea;border-radius:50%;animation:thinking-pulse 1.4s infinite ease-in-out}.thinking-dots:before{animation-delay:-.32s}.thinking-dots:after{animation-delay:0s}@keyframes thinking-pulse{0%,80%,to{transform:scale(.6);opacity:.5}40%{transform:scale(1);opacity:1}}@media(max-width:768px){.action-panel{gap:12px;padding:16px}.btn-roll{min-width:120px}.btn-confirm{min-width:100px}.btn-undo{min-width:80px}}@media(max-width:480px){.action-panel{gap:8px;padding:12px}.btn-roll,.btn-confirm,.btn-undo,.btn-double{min-width:auto;flex:1;min-height:44px;padding:12px 14px;font-size:14px}.waiting-turn{padding:12px 16px;min-height:44px;display:flex;align-items:center;font-size:13px}.ai-thinking{font-size:13px;gap:6px;min-height:44px}}@media(max-width:400px){.action-panel{padding:8px;gap:6px}.btn-roll,.btn-confirm,.btn-undo,.btn-double{padding:10px 8px;font-size:12px;min-height:44px}}.scoreboard{position:relative;display:flex;justify-content:center;align-items:center;gap:16px;padding:20px 20px 16px;background:linear-gradient(180deg,#0006,#0003);border-radius:12px;margin-bottom:12px;flex-wrap:wrap;overflow:hidden}.match-progress-bar{position:absolute;top:0;left:0;right:0;height:4px;background:#ffffff1a;display:flex;overflow:hidden}.match-progress-fill{height:100%;transition:width .5s cubic-bezier(.4,0,.2,1)}.match-progress-fill.player-progress{background:linear-gradient(90deg,#38ef7d,#11998e);box-shadow:0 0 8px #38ef7d80}.match-progress-fill.opponent-progress{background:linear-gradient(90deg,#f093fb,#f5576c);margin-left:auto;box-shadow:0 0 8px #f5576c80}.score-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;transition:all var(--animation-duration, .3s) var(--animation-easing, ease)}.score-item.active{background:#667eea26}.turn-indicator-wrapper{width:12px;height:12px;display:flex;align-items:center;justify-content:center}.turn-indicator{width:10px;height:10px;border-radius:50%;background:#38ef7d;box-shadow:0 0 8px #38ef7d,0 0 16px #38ef7d80;animation:turnPulse 1.5s ease-in-out infinite}.turn-indicator.thinking{background:#ffc107;box-shadow:0 0 8px #ffc107,0 0 16px #ffc10780;animation:thinkingPulse .8s ease-in-out infinite}@keyframes turnPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.85)}}@keyframes thinkingPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}.player-badge{width:24px;height:24px;border-radius:50%;flex-shrink:0}.player-badge.white{background:var(--piece-white, linear-gradient(145deg, #f8f9fa, #e9ecef));box-shadow:inset 0 1px 3px #fffc,0 2px 4px #0003}.player-badge.black{background:var(--piece-black, linear-gradient(145deg, #343a40, #212529));box-shadow:inset 0 1px 3px #ffffff1a,0 2px 4px #0000004d}.player-info{display:flex;flex-direction:column;gap:2px}.player-name{font-size:14px;font-weight:600;color:var(--text-primary, #f8f9fa)}.player-color{font-size:10px;color:var(--text-secondary, rgba(255, 255, 255, .5));text-transform:uppercase;letter-spacing:.5px}.pip-count{display:flex;align-items:center;gap:3px;font-size:11px;font-weight:500;color:#fff9;font-family:SF Mono,Monaco,Consolas,monospace}.pip-icon{font-size:8px;opacity:.7}.score{font-size:28px;font-weight:700;background:linear-gradient(135deg,var(--highlight-color, #667eea),#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;min-width:30px;text-align:center;transition:transform .2s ease}.score.score-animating{animation:scorePopIn .3s ease-out}@keyframes scorePopIn{0%{transform:scale(1.3)}50%{transform:scale(.95)}to{transform:scale(1)}}.score-divider{display:flex;flex-direction:column;align-items:center;gap:4px;padding:0 12px}.vs-text{font-size:12px;font-weight:700;color:var(--text-secondary, rgba(255, 255, 255, .4));letter-spacing:2px}.match-progress-text{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--text-secondary, rgba(255, 255, 255, .5))}.crawford-badge{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;background:linear-gradient(135deg,#f5576c,#f093fb);color:#fff;font-size:9px;font-weight:700;border-radius:50%;box-shadow:0 2px 4px #f5576c66}.cube-indicator{display:flex;align-items:center;justify-content:center;margin-top:2px}.cube-value{display:inline-flex;align-items:center;justify-content:center;padding:2px 6px;background:linear-gradient(135deg,gold,#fa0);color:#1a1a2e;font-size:10px;font-weight:700;border-radius:4px;box-shadow:0 2px 4px #ffd7004d}.match-info{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding-left:16px;border-left:1px solid rgba(255,255,255,.1);margin-left:8px}.match-length{font-size:11px;color:var(--text-secondary, rgba(255, 255, 255, .5))}.match-progress-label{color:#ffffff59;font-size:10px}.thinking-text{font-size:10px;color:#ffc107;animation:thinkingText 1s ease-in-out infinite}@keyframes thinkingText{0%,to{opacity:1}50%{opacity:.5}}@media(max-width:768px){.scoreboard{gap:12px;padding:10px 16px}.score-item{gap:8px;padding:6px 10px}.player-badge{width:20px;height:20px}.player-name{font-size:13px}.score{font-size:24px}}@media(max-width:480px){.scoreboard{gap:6px;padding:14px 10px 8px;margin-bottom:8px}.match-progress-bar{height:3px}.score-item{gap:6px;padding:4px 6px}.turn-indicator-wrapper{width:10px;height:10px}.turn-indicator{width:8px;height:8px}.player-badge{width:18px;height:18px}.player-info{display:flex}.player-name{font-size:11px}.pip-count{font-size:9px}.pip-icon{font-size:6px}.score{font-size:20px;min-width:24px}.vs-text{font-size:10px}.match-progress-text{font-size:9px}.crawford-badge{width:14px;height:14px;font-size:8px}.cube-value{font-size:9px;padding:1px 4px}.match-info{padding-left:10px;margin-left:4px}.match-length{font-size:10px}.match-progress-label{display:none}.thinking-text{font-size:9px}}@media(max-width:400px){.scoreboard{padding:12px 8px 6px}.score-item{gap:4px;padding:3px 5px}.player-badge{width:16px;height:16px}.player-info,.pip-count{display:none}.score{font-size:18px}.score-divider{padding:0 6px;gap:2px}.vs-text{font-size:9px;letter-spacing:1px}.cube-indicator,.match-info{display:none}}.settings-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.settings-panel{background:var(--board-bg, #1a1a2e);border-radius:16px;width:90%;max-width:420px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px #00000080,0 0 0 1px #ffffff1a;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.1)}.settings-header h2{margin:0;font-size:1.25rem;font-weight:600;color:var(--text-primary, #f8f9fa)}.settings-close{background:none;border:none;color:var(--text-secondary, rgba(255, 255, 255, .7));cursor:pointer;padding:4px;border-radius:6px;transition:all .2s ease}.settings-close:hover{background:#ffffff1a;color:var(--text-primary, #f8f9fa)}.settings-content{flex:1;overflow-y:auto;padding:20px}.settings-section{margin-bottom:24px}.settings-section:last-child{margin-bottom:0}.settings-section h3{margin:0 0 12px;font-size:.875rem;font-weight:600;color:var(--text-secondary, rgba(255, 255, 255, .7));text-transform:uppercase;letter-spacing:.5px}.settings-options{display:flex;flex-direction:column;gap:8px}.settings-options.horizontal{flex-direction:row}.settings-option{display:flex;align-items:center;gap:12px;padding:12px;background:#ffffff0d;border:2px solid transparent;border-radius:10px;cursor:pointer;transition:all .2s ease;text-align:left}.settings-option:hover{background:#ffffff1a}.settings-option.active{border-color:var(--highlight-color, #667eea);background:#667eea26}.settings-option.compact{flex:1;justify-content:center;padding:10px 16px}.option-preview{width:48px;height:48px;border-radius:8px;overflow:hidden;flex-shrink:0}.theme-preview .preview-board{width:100%;height:100%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:2px;padding:4px;background:#1a1a2e;position:relative}.theme-preview[data-theme=minimalist] .preview-board{background:#1a1a2e}.theme-preview[data-theme=wood] .preview-board{background:#2d1810}.theme-preview[data-theme=elegant] .preview-board{background:#1a2f1a}.theme-preview[data-theme=threed] .preview-board{background:#1a1a2e;transform:perspective(100px) rotateX(5deg);box-shadow:0 4px 8px #0006}.preview-point{border-radius:2px}.theme-preview[data-theme=minimalist] .preview-point.even{background:#e94560}.theme-preview[data-theme=minimalist] .preview-point.odd{background:#0f3460}.theme-preview[data-theme=wood] .preview-point.even{background:#8b4513}.theme-preview[data-theme=wood] .preview-point.odd{background:#d4a574}.theme-preview[data-theme=elegant] .preview-point.even{background:#2d5a2d}.theme-preview[data-theme=elegant] .preview-point.odd{background:#d4af37}.theme-preview[data-theme=threed] .preview-point.even{background:#e94560}.theme-preview[data-theme=threed] .preview-point.odd{background:#1a4a7a}.preview-piece{width:12px;height:12px;border-radius:50%;position:absolute}.preview-piece.white{background:#f8f9fa;bottom:6px;right:6px}.preview-piece.black{background:#343a40;top:6px;left:6px}.option-info{display:flex;flex-direction:column;gap:2px}.option-name{font-size:.9375rem;font-weight:500;color:var(--text-primary, #f8f9fa)}.option-desc{font-size:.75rem;color:var(--text-secondary, rgba(255, 255, 255, .6))}.settings-row{margin-bottom:12px}.settings-row:last-child{margin-bottom:0}.settings-toggle{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:8px 0}.settings-toggle span:first-child{font-size:.9375rem;color:var(--text-primary, #f8f9fa)}.settings-toggle input{display:none}.toggle-slider{width:48px;height:26px;background:#fff3;border-radius:13px;position:relative;transition:background .2s ease}.toggle-slider:after{content:"";position:absolute;width:22px;height:22px;background:#fff;border-radius:50%;top:2px;left:2px;transition:transform .2s ease}.settings-toggle input:checked+.toggle-slider{background:var(--highlight-color, #667eea)}.settings-toggle input:checked+.toggle-slider:after{transform:translate(22px)}.settings-slider{display:flex;align-items:center;gap:12px}.settings-slider span:first-child{font-size:.9375rem;color:var(--text-primary, #f8f9fa);min-width:60px}.settings-slider input[type=range]{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff3;border-radius:3px;cursor:pointer}.settings-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:var(--highlight-color, #667eea);border-radius:50%;cursor:pointer;-webkit-transition:transform .2s ease;transition:transform .2s ease}.settings-slider input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.1)}.slider-value{font-size:.875rem;color:var(--text-secondary, rgba(255, 255, 255, .7));min-width:40px;text-align:right}.settings-footer{padding:12px 20px;border-top:1px solid rgba(255,255,255,.1);text-align:center}.settings-note{margin:0;font-size:.75rem;color:var(--text-secondary, rgba(255, 255, 255, .5))}.match-points-selector{margin-top:16px;padding:16px;background:#ffffff08;border-radius:10px}.match-points-presets{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.preset-btn{min-width:40px;padding:8px 12px;background:#ffffff1a;border:1px solid rgba(255,255,255,.1);border-radius:6px;color:var(--text-primary, #f8f9fa);cursor:pointer;transition:all .2s;font-size:14px;font-weight:600}.preset-btn:hover{background:#ffffff26}.preset-btn.active{background:var(--highlight-color, #667eea);border-color:var(--highlight-color, #667eea)}@media(max-width:480px){.settings-panel{width:95%;max-height:90vh}.settings-content{padding:16px}.settings-options.horizontal{flex-wrap:wrap}.settings-option.compact{flex:1 1 calc(50% - 4px);min-width:calc(50% - 4px)}}.move-history{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:40;display:flex;transition:transform .3s ease}.move-history.collapsed{transform:translateY(-50%) translate(-100%)}.move-history.collapsed .move-history-toggle{transform:translate(100%)}.move-history-toggle{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;background:var(--board-bg, #1a1a2e);border:1px solid rgba(255,255,255,.1);border-left:none;border-radius:0 8px 8px 0;color:var(--text-secondary, rgba(255, 255, 255, .7));cursor:pointer;transition:all .2s ease}.move-history-toggle:hover{background:#ffffff1a;color:var(--text-primary, #f8f9fa)}.toggle-icon{font-size:12px;font-weight:700}.toggle-label{writing-mode:vertical-rl;text-orientation:mixed;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px}.move-count{background:var(--highlight-color, #667eea);color:#fff;font-size:10px;font-weight:700;padding:2px 6px;border-radius:10px;min-width:20px;text-align:center}.move-history-content{width:160px;max-height:300px;overflow-y:auto;background:var(--board-bg, #1a1a2e);border:1px solid rgba(255,255,255,.1);border-radius:0 8px 8px 0;padding:8px}.move-list{display:flex;flex-direction:column;gap:4px}.move-item{display:flex;align-items:center;gap:6px;padding:6px 8px;background:#ffffff08;border-radius:4px;font-size:12px;font-family:SF Mono,Monaco,Consolas,monospace}.move-item:last-child{background:#667eea26}.move-number{color:var(--text-secondary, rgba(255, 255, 255, .5));min-width:20px}.move-player{width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}.move-player.white{background:var(--piece-white, #f8f9fa);color:#1a1a2e}.move-player.black{background:var(--piece-black, #343a40);color:#f8f9fa}.move-notation{color:var(--text-primary, #f8f9fa);flex:1}.move-dice{color:var(--text-secondary, rgba(255, 255, 255, .5));font-size:10px}.move-history-content::-webkit-scrollbar{width:4px}.move-history-content::-webkit-scrollbar-track{background:transparent}.move-history-content::-webkit-scrollbar-thumb{background:#fff3;border-radius:2px}.move-history-content::-webkit-scrollbar-thumb:hover{background:#ffffff4d}@media(max-width:768px){.move-history{top:auto;bottom:120px;transform:translateY(0)}.move-history.collapsed{transform:translate(-100%)}.move-history-content{width:140px;max-height:200px}}@media(max-width:480px){.move-history{bottom:100px}.move-history-content{width:120px;max-height:150px}.move-item{padding:4px 6px;font-size:11px}.move-player{width:16px;height:16px;font-size:9px}}.game-over-overlay{position:fixed;inset:0;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:200;animation:fadeIn .3s ease-out}.game-over-modal{background:linear-gradient(180deg,#1e1e36,#1a1a2e);border-radius:20px;width:90%;max-width:380px;padding:32px 24px;box-shadow:0 20px 60px #00000080,0 0 0 1px #ffffff1a;animation:slideUp .4s cubic-bezier(.34,1.56,.64,1);text-align:center}@keyframes slideUp{0%{opacity:0;transform:translateY(40px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.game-over-header{margin-bottom:24px}.result-icon{width:72px;height:72px;margin:0 auto 16px;animation:iconBounce .6s cubic-bezier(.34,1.56,.64,1) .2s both}@keyframes iconBounce{0%{opacity:0;transform:scale(0)}50%{transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.victory .result-icon{color:gold;filter:drop-shadow(0 0 12px rgba(255,215,0,.5));animation:iconBounce .6s cubic-bezier(.34,1.56,.64,1) .2s both,iconGlow 1.5s ease-in-out infinite .8s}@keyframes iconGlow{0%,to{filter:drop-shadow(0 0 12px rgba(255,215,0,.5))}50%{filter:drop-shadow(0 0 24px rgba(255,215,0,.8))}}.defeat .result-icon{color:#888}.victory:before,.victory:after{content:"";position:absolute;width:10px;height:10px;background:gold}.game-over-modal.victory{overflow:visible}.game-over-modal.victory:before{content:"";position:absolute;top:-60px;left:50%;transform:translate(-50%);width:200%;height:300px;background-image:radial-gradient(circle,#ffd700 2px,transparent 2px),radial-gradient(circle,#ff6b6b 2px,transparent 2px),radial-gradient(circle,#667eea 2px,transparent 2px),radial-gradient(circle,#38ef7d 2px,transparent 2px),radial-gradient(circle,#ff9500 2px,transparent 2px),radial-gradient(circle,#764ba2 2px,transparent 2px);background-size:40px 50px,60px 70px,50px 60px,70px 80px,45px 55px,55px 65px;background-position:0 0,20px 30px,40px 10px,10px 50px,60px 20px,30px 40px;animation:confettiFall 3s linear infinite;opacity:.8;pointer-events:none;z-index:-1}@keyframes confettiFall{0%{transform:translate(-50%) translateY(-100%)}to{transform:translate(-50%) translateY(100%)}}.victory .result-title{background:linear-gradient(135deg,gold,#fff6c5,gold,#fff6c5,#fa0);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 2s linear infinite}@keyframes shimmer{0%{background-position:200% center}to{background-position:-200% center}}.result-icon svg{width:100%;height:100%}.result-title{margin:0;font-size:32px;font-weight:700}.victory .result-title{background:linear-gradient(135deg,gold,#fa0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.defeat .result-title{color:#ffffffb3}.match-over-text{margin:8px 0 0;font-size:14px;color:#667eea;font-weight:600;letter-spacing:1px;text-transform:uppercase}.score-section{margin-bottom:24px;padding:16px;background:#ffffff0d;border-radius:12px}.points-earned{display:flex;flex-direction:column;gap:4px;margin-bottom:16px}.points-label{font-size:12px;color:#ffffff80;text-transform:uppercase;letter-spacing:1px}.points-value{font-size:36px;font-weight:700}.victory .points-value{color:#38ef7d}.defeat .points-value{color:#fff6}.match-progress{margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}.progress-labels{display:flex;justify-content:space-between;font-size:12px;color:#fff9;margin-bottom:8px}.progress-bar{height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:4px;transition:width .5s cubic-bezier(.4,0,.2,1)}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:24px}.stat-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;background:#ffffff0d;border-radius:10px}.stat-icon-small{width:20px;height:20px;color:var(--highlight-color, #667eea);opacity:.8}.stat-icon-small svg{width:100%;height:100%}.stat-value-modal{font-size:20px;font-weight:700;color:#fffffff2}.stat-label{font-size:11px;color:#ffffff80;text-transform:uppercase;letter-spacing:.5px}.game-over-btn{width:100%;padding:16px 24px;font-size:16px;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 16px #667eea4d}.game-over-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #667eea66}.game-over-btn:active{transform:translateY(0)}@media(max-width:480px){.game-over-modal{width:95%;padding:24px 16px;border-radius:16px}.result-icon{width:60px;height:60px;margin-bottom:12px}.result-title{font-size:28px}.points-value{font-size:32px}.stats-grid{gap:8px}.stat-card{padding:10px 6px}.stat-value-modal{font-size:18px}.stat-label{font-size:10px}}.doubling-cube{position:absolute;right:-50px;z-index:30;transition:all .4s cubic-bezier(.34,1.56,.64,1)}.doubling-cube.cube-center{top:50%;transform:translateY(-50%)}.doubling-cube.cube-player{bottom:60px}.doubling-cube.cube-opponent{top:60px}.cube-face{width:40px;height:40px;background:linear-gradient(145deg,#f0f0f0,#d0d0d0);border-radius:6px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0000004d,inset 0 1px #fffc,inset 0 -1px #0000001a;position:relative}.cube-value{font-size:18px;font-weight:800;color:#333;text-shadow:0 1px 0 rgba(255,255,255,.5)}.crawford-indicator{position:absolute;top:100%;left:50%;transform:translate(-50%);margin-top:4px;padding:2px 6px;background:#ffc107e6;color:#333;font-size:9px;font-weight:700;border-radius:3px;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}@keyframes cubeFlip{0%{transform:rotateY(0)}50%{transform:rotateY(180deg) scale(1.1)}to{transform:rotateY(360deg)}}.doubling-cube.animating .cube-face{animation:cubeFlip .6s ease-in-out}@media(max-width:768px){.doubling-cube{right:-45px}.cube-face{width:36px;height:36px}.cube-value{font-size:16px}}@media(max-width:480px){.doubling-cube{right:8px}.doubling-cube.cube-center{top:50%}.doubling-cube.cube-player{bottom:50px}.doubling-cube.cube-opponent{top:50px}.cube-face{width:32px;height:32px}.cube-value{font-size:14px}.crawford-indicator{font-size:8px;padding:1px 4px}}.double-offer-overlay{position:fixed;inset:0;background:#000c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:300;animation:fadeIn .2s ease-out}.double-offer-modal{background:linear-gradient(180deg,#1e1e36,#1a1a2e);border-radius:16px;padding:32px;max-width:380px;width:90%;text-align:center;box-shadow:0 20px 60px #00000080,0 0 0 1px #ffffff1a;animation:scaleIn .3s cubic-bezier(.34,1.56,.64,1)}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.double-offer-header{margin-bottom:24px}.double-offer-cube{width:64px;height:64px;background:linear-gradient(145deg,gold,#fa0);border-radius:10px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 8px 24px #ffd70066,inset 0 1px #ffffff80;animation:cubeGlow 1.5s ease-in-out infinite alternate}@keyframes cubeGlow{0%{box-shadow:0 8px 24px #ffd70066,inset 0 1px #ffffff80}to{box-shadow:0 8px 32px #ffd70099,inset 0 1px #ffffff80}}.double-offer-cube span{font-size:28px;font-weight:800;color:#333;text-shadow:0 1px 0 rgba(255,255,255,.5)}.double-offer-header h2{margin:0;font-size:24px;font-weight:700;color:#fff}.double-offer-text{font-size:16px;color:#ffffffe6;margin:0 0 16px;line-height:1.5}.double-offer-text strong{color:gold}.double-offer-info{font-size:13px;color:#fff9;margin:0 0 24px;line-height:1.6;padding:12px;background:#ffffff0d;border-radius:8px}.double-offer-actions{display:flex;gap:12px}.double-offer-actions .btn{flex:1;padding:14px 24px;font-size:16px;font-weight:600;border-radius:10px;cursor:pointer;transition:all .2s ease;border:none}.btn-accept{background:linear-gradient(135deg,#38ef7d,#11998e);color:#fff;box-shadow:0 4px 16px #38ef7d4d}.btn-accept:hover{transform:translateY(-2px);box-shadow:0 6px 20px #38ef7d66}.btn-reject{background:#ff6b6b33;color:#ff6b6b;border:2px solid rgba(255,107,107,.4)}.btn-reject:hover{background:#ff6b6b4d;transform:translateY(-2px)}@media(max-width:480px){.double-offer-modal{padding:24px 20px}.double-offer-cube{width:56px;height:56px}.double-offer-cube span{font-size:24px}.double-offer-header h2{font-size:20px}.double-offer-text{font-size:14px}.double-offer-info{font-size:12px;padding:10px}.double-offer-actions{flex-direction:column;gap:8px}.double-offer-actions .btn{padding:12px 20px}}.game-view{flex:1;display:flex;flex-direction:column;padding:16px;position:relative}.board-container{position:relative;display:flex;justify-content:center}.settings-btn{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;background:#ffffff1a;border:none;color:var(--text-secondary, rgba(255, 255, 255, .7));cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:50}.settings-btn:hover{background:#fff3;color:var(--text-primary, #f8f9fa)}.settings-btn:active{transform:scale(.95)}.game-result-overlay{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.result-content{text-align:center;padding:48px;background:#ffffff0d;border-radius:16px;animation:scaleIn .3s ease}@keyframes scaleIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.result-content.won .result-message{color:#38ef7d}.result-content.lost .result-message{color:#ff6b6b}.result-message{font-size:48px;font-weight:700;margin-bottom:16px}.match-over{font-size:24px;color:#667eea;margin-bottom:16px}.score-update{font-size:20px;color:#38ef7d;margin-bottom:8px}.current-score{font-size:18px;color:#888;margin-bottom:24px}.status-banner{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-radius:8px;margin-bottom:12px;animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.status-banner.error{background:#ff6b6b33;border:1px solid rgba(255,107,107,.4);color:#ff6b6b}.status-banner.warning{background:#ffc10733;border:1px solid rgba(255,193,7,.4);color:#ffc107}.status-message{flex:1;font-size:14px}.status-dismiss{background:none;border:none;color:inherit;font-size:20px;cursor:pointer;padding:0 0 0 12px;opacity:.7;transition:opacity .2s}.status-dismiss:hover{opacity:1}@media(max-width:768px){.game-view{padding:12px}.result-content{padding:36px}.result-message{font-size:40px}.match-over{font-size:20px}.score-update{font-size:18px}.current-score{font-size:16px}}@media(max-width:480px){.game-view{padding:8px}.status-banner{padding:10px 12px;margin-bottom:8px}.status-message{font-size:12px}.result-content{padding:24px 16px;border-radius:12px;margin:16px;max-width:calc(100vw - 32px)}.result-message{font-size:32px;margin-bottom:12px}.match-over{font-size:18px;margin-bottom:12px}.score-update{font-size:16px;margin-bottom:6px}.current-score{font-size:14px;margin-bottom:16px}}@media(max-width:400px){.game-view{padding:4px}.result-message{font-size:28px}}*{box-sizing:border-box}body{margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);min-height:100vh;color:#fff}#root{min-height:100vh}.app{min-height:100vh;display:flex;flex-direction:column}.btn{padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.btn:active{transform:translateY(0)}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover{background:linear-gradient(135deg,#764ba2,#667eea)}.btn-success{background:linear-gradient(135deg,#11998e,#38ef7d);color:#fff}.btn-secondary{background:#4a5568;color:#fff}.btn-lg{padding:16px 32px;font-size:18px}.loader{width:40px;height:40px;border:4px solid rgba(255,255,255,.3);border-top-color:#667eea;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 16px}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){.btn{padding:10px 20px;font-size:15px}.btn-lg{padding:14px 28px;font-size:16px}}@media(max-width:480px){.btn{padding:10px 16px;font-size:14px;min-width:auto}.btn-lg{padding:12px 24px;font-size:15px;width:100%}.loader{width:32px;height:32px;border-width:3px}}