:root{--max-width: 720px;--board-size: min(90vw, 600px);--field-size: calc(var(--board-size) / 4);--color-background: #f0f0f0;--color-text: #333;--color-field-bg: white;--color-board-bg: transparent;--color-modal-bg: #fefefe;--color-modal-overlay: rgba(240, 240, 240, .85);--color-stat-text: #a0a0a0;--color-countdown-overlay: rgba(0, 0, 0, .8);--main-color: #CC5500;--highlight-color: #CC5500;--match-color-light: #CC5500;--dot-color-active: #CC5500;--border-color: #a0a0a0;--timer-bg-color: #e0e0e0;--control-font-size: 1.5rem;--gap-size: clamp(4px, 1.5vw, 8px);--selected-bg-color: #CC55001A;--matched-field-bg-dark: #1e1e1e;--reset-button-size-factor: .65;--drag-border-width: 3px;--dot-size-header: clamp(2px, 4.5vw, 6px);--pixel-gap-size-header: calc(var(--dot-size-header) * .25);--letter-gap-size-header: calc(var(--dot-size-header) * 1.5);--letter-width-header: calc(5 * var(--dot-size-header) + 4 * var(--pixel-gap-size-header));--dot-size-overlay: clamp(3px, 4vw, 6px);--pixel-gap-size-overlay: calc(var(--dot-size-overlay) / 3);--button-fixed-width: 50px;--buttons-total-width: 100px;--padding-total-width: 40px;--control-element-size: 50px}html.dark-mode{--color-background: #222;--color-text: #f0f0f0;--color-field-bg: #111;--color-board-bg: transparent;--color-modal-bg: #1c1c1c;--color-modal-overlay: rgba(18, 18, 18, .85);--color-stat-text: #777;--color-countdown-overlay: rgba(18, 18, 18, .9);--border-color: #777;--dark-mode-dot-base: #777777;--highlight-color: #FF8800;--main-color: #FF8800;--match-color-light: #FF8800;--dot-color-active: #FF8800;--selected-bg-color: #FF88001A;--matched-field-bg-dark: #663500;--matched-field-shadow-dark: rgba(255, 136, 0, .7);--timer-bg-color: #444}html{transition:background-color .3s}@keyframes shake{0%,to{transform:translate(0) translateY(0)}15%,45%,75%{transform:translate(-2px) translateY(0)}30%,60%,90%{transform:translate(2px) translateY(0)}}.field.shake{animation:shake .3s cubic-bezier(.36,.07,.19,.97) both;box-shadow:none!important;border-color:transparent!important;z-index:50;transition:none!important;opacity:1!important;transform:translateZ(0);backface-visibility:hidden;pointer-events:none}*{box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;margin:0;padding:0;width:100%;overflow-x:hidden;background-color:var(--color-background);color:var(--color-stat-text);overscroll-behavior:none;-webkit-overflow-scrolling:touch}#menu-overlay hr{display:none!important}#game-container{width:100%;max-width:var(--max-width);display:flex;flex-direction:column;align-items:center;flex-grow:1;margin:0 auto 20px}#top-bar{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:var(--max-width);padding:0 1rem;margin:20px auto 15px;min-height:70px;height:70px;overflow:hidden}.top-bar-button{font-family:Ubuntu,sans-serif;font-size:clamp(1.8rem,calc(1.8rem + (3 - 1.8) * ((100vw - 300px) / (720 - 300))),3rem);font-weight:700;background:none;border:none;color:var(--border-color);cursor:pointer;padding:5px 0;line-height:.8;transition:color .2s,transform .2s;flex-shrink:0;z-index:5;width:var(--button-fixed-width);text-align:center;display:flex;align-items:center;justify-content:center}#menu-button{justify-content:flex-start}#info-button{justify-content:flex-end}.top-bar-button:hover{color:var(--main-color);transform:scale(1.1)}#game-title{flex-grow:1;flex-shrink:1;flex-basis:0;font-size:0;line-height:0;text-align:center;overflow:hidden;min-width:0;display:flex;align-items:center;justify-content:center;position:relative;padding:0;height:100%;max-width:100%}#pixel-title{display:flex;gap:var(--letter-gap-size-header);width:max-content;height:auto;flex-shrink:1;transform:none;transform-origin:center center;max-width:100%}.pixel-letter{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(7,1fr);width:var(--letter-width-header);height:calc(7 * var(--dot-size-header) + 6 * var(--pixel-gap-size-header));gap:var(--pixel-gap-size-header);line-height:0;font-size:0;flex-shrink:0}.pixel-dot{width:var(--dot-size-header);height:var(--dot-size-header);background-color:transparent;opacity:0;visibility:hidden;border-radius:20%;flex-shrink:0}#overlay-title-container,#win-title-container{display:flex;gap:calc(var(--dot-size-overlay) * 1.5);width:max-content;max-width:100%;height:auto;transform-origin:center center;margin-bottom:40px;justify-content:center;flex-wrap:nowrap;white-space:nowrap}.pixel-title-overlay .pixel-letter{--pixel-gap-size-overlay: calc(var(--dot-size-overlay) / 3);--letter-width-ideal: calc(5 * var(--dot-size-overlay) + 4 * var(--pixel-gap-size-overlay));width:var(--letter-width-ideal);height:calc(7 * var(--dot-size-overlay) + 6 * var(--pixel-gap-size-overlay));gap:var(--pixel-gap-size-overlay)}.pixel-title-overlay .pixel-dot{width:var(--dot-size-overlay);height:var(--dot-size-overlay);border-radius:20%}.pixel-title-overlay{gap:calc(var(--dot-size-overlay) * 1.5)!important}#control-bar{display:flex;align-items:center;justify-content:center;margin-bottom:20px;gap:40px;height:50px}.counter-group{display:flex;align-items:center;gap:15px}#moves-count-text{font-family:Ubuntu,sans-serif;font-weight:700;font-size:1.2rem;text-transform:uppercase;color:var(--color-stat-text);margin:0;white-space:nowrap}#moves-count-number{font-weight:700;color:var(--main-color);position:relative;z-index:1;font-size:1.2rem;will-change:opacity}#moves-count-number.infinity{font-size:1.6rem;top:-2px}#reset-button{font-family:Ubuntu,sans-serif;font-size:1.6rem;line-height:1;text-transform:uppercase;margin-top:0;cursor:pointer;background-color:transparent;color:var(--main-color);border:4px solid var(--main-color);font-weight:900;border-radius:50%;width:var(--control-element-size);height:var(--control-element-size);padding:0;display:flex;align-items:center;justify-content:center;transition:all .2s ease;align-self:center}.reset-button-moved{position:relative;top:-2px}#reset-button:hover{background-color:transparent;border-color:var(--main-color);color:var(--main-color)}#game-board{display:grid;grid-template-columns:repeat(5,1fr);aspect-ratio:5 / 4;width:calc(var(--board-size) + 2 * var(--gap-size));height:calc(var(--board-size) + 2 * var(--gap-size));border:none;border-radius:0;overflow:hidden;background-color:transparent;box-shadow:none;gap:var(--gap-size);padding:var(--gap-size);transition:none}.field{position:relative;cursor:pointer;transition:transform .2s ease,box-shadow .3s,border-color .3s,background-color .3s,opacity .2s;background-color:var(--color-field-bg);border-radius:0;box-shadow:none;border:var(--drag-border-width) dashed transparent;aspect-ratio:auto;height:100%;touch-action:none}.field.dragging{opacity:.4;transform:scale(.9)}.drag-ghost{position:fixed;pointer-events:none;z-index:9999;opacity:.9;box-shadow:0 10px 20px #0000004d;margin:0;padding:0;transform-origin:center center;background-color:var(--color-field-bg);border:2px solid var(--main-color)}.field.drag-over{border-color:var(--highlight-color);background-color:var(--selected-bg-color);animation:none;box-shadow:none}.field.selected{outline:none;box-shadow:0 0 0 2px var(--highlight-color);background-color:var(--selected-bg-color)}.field.touch-selected{background-color:var(--selected-bg-color);box-shadow:0 0 0 2px var(--highlight-color),0 0 10px var(--highlight-color)}.field.matched{outline:none;background-color:var(--match-color-light);box-shadow:none;border-color:transparent}.dot-layer{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(7,1fr);width:90%;height:90%;gap:1.5%;align-items:center;justify-items:center}.dot{width:100%;height:100%;border-radius:10%;margin:0;transition:opacity .2s;visibility:hidden;opacity:0}.dot.visible{visibility:visible;opacity:1}.bottom-layer .dot{border:none;background-color:var(--border-color)}html.dark-mode .bottom-layer .dot{background-color:var(--dark-mode-dot-base)}.top-layer .dot{background-color:var(--border-color);border:none;box-shadow:none}.top-layer .dot.matched-dot{background-color:var(--dot-color-active);box-shadow:0 0 5px var(--dot-color-active)}.field.blocked-field{cursor:default!important;background-color:transparent!important;border-color:transparent!important;opacity:.3;pointer-events:none}.field.blocked-field .dot-layer{display:none}#global-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;z-index:100;display:none;opacity:0;transition:opacity .3s ease-out}#global-overlay.open{display:block;opacity:1}.slide-overlay{position:fixed;top:0;height:100%;width:280px;max-width:80%;background-color:var(--color-modal-bg);box-shadow:0 0 20px #0000004d;z-index:101;transition:transform .3s ease-out;display:flex;flex-direction:column}.slide-overlay.left{left:0;transform:translate(-100%)}.slide-overlay.right{right:0;transform:translate(100%)}.slide-overlay.open{transform:translate(0)}.close-overlay-button{position:absolute;top:10px;right:15px;font-size:2rem;font-weight:300;color:var(--color-stat-text);background:none;border:none;cursor:pointer;line-height:1}.close-overlay-button:hover{color:var(--main-color)}#menu-overlay ul{list-style:none;padding:60px 0 0;margin:0}#menu-overlay li button{font-family:Ubuntu,sans-serif;font-size:1.1rem;color:var(--color-text);background:none;border:none;border-bottom:1px solid var(--border-color);padding:20px;width:100%;text-align:left;cursor:pointer;transition:background-color .2s,color .2s}#menu-overlay li button:hover{background-color:var(--selected-bg-color);color:var(--main-color)}.modal-content-inner{padding:60px 25px 25px;font-family:Ubuntu,sans-serif;color:var(--color-text);overflow-y:auto}.modal-content-inner h2{color:var(--main-color);font-size:clamp(1.8rem,5vw,2.5rem);margin-top:0;margin-bottom:10px;text-align:left}.modal-content-inner p,.modal-content-inner li{font-size:clamp(1rem,2.5vw,1.3rem);color:var(--color-text);margin-bottom:15px;line-height:1.5}.modal-content-inner ul{text-align:left;padding-left:20px;margin:15px 0}.modal{display:none;position:fixed;z-index:100;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:var(--color-modal-overlay);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);justify-content:center;align-items:center;padding:20px;box-sizing:border-box;transition:background-color .3s}.modal-content{background-color:var(--color-modal-bg);padding:30px 10px;border:1px solid var(--border-color);width:100%;max-width:450px;border-radius:0;box-shadow:0 8px 20px #0000004d;font-family:Ubuntu,sans-serif;text-align:center;position:relative;color:var(--color-text);transition:background-color .3s,border-color .3s,color .3s}.modal-content h2{color:var(--main-color);font-size:clamp(1.8rem,5vw,2.5rem);margin-top:0;margin-bottom:10px}.modal-content p{font-size:clamp(1rem,2.5vw,1.3rem);color:var(--color-text);margin-bottom:25px;transition:color .3s}#star-rating{font-size:2.5rem;color:var(--highlight-color);margin-bottom:20px;letter-spacing:5px;line-height:1}#win-modal-buttons{display:flex;justify-content:space-around;gap:15px;margin-top:25px}#overlay-reset-button,#overlay-resume-button{font-size:1.1rem;padding:10px 15px;border-radius:5px;border:none;cursor:pointer;transition:background-color .2s,box-shadow .2s;flex-grow:1;max-width:50%}#overlay-resume-button{background-color:var(--border-color);color:var(--color-text)}#overlay-resume-button:hover{background-color:var(--color-stat-text)}#overlay-reset-button{background-color:var(--main-color);color:#fff}#overlay-reset-button:hover{background-color:#a34400}html.dark-mode #reset-button{background-color:transparent;color:var(--main-color);border-color:var(--main-color)}html.dark-mode #reset-button:hover{background-color:#663500;color:var(--main-color);border-color:var(--main-color)}html.dark-mode .field{box-shadow:none;background-color:var(--color-field-bg)}html.dark-mode .field.selected{box-shadow:0 0 0 2px var(--highlight-color),0 0 10px var(--highlight-color);background-color:var(--selected-bg-color)}html.dark-mode .field.touch-selected{background-color:var(--selected-bg-color);box-shadow:0 0 0 2px var(--highlight-color),0 0 10px var(--highlight-color)}html.dark-mode .field.matched{background-color:var(--matched-field-bg-dark);box-shadow:none}#start-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:20000;background-color:var(--color-modal-overlay);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);display:flex;flex-direction:column;justify-content:center;align-items:center;pointer-events:auto}.mode-button{font-family:Ubuntu,sans-serif;font-size:1.2rem;padding:15px 20px;background-color:var(--color-field-bg);color:var(--color-text);border:2px solid var(--border-color);border-radius:8px;cursor:pointer;font-weight:700;transition:all .2s;min-width:140px;text-transform:uppercase}.mode-button:hover{border-color:var(--main-color);color:var(--main-color);transform:scale(1.05)}.mode-button.disabled{opacity:.5;cursor:not-allowed;filter:grayscale(1)}.mode-button.disabled:hover{transform:none;border-color:var(--border-color);color:var(--color-text)}.hidden{visibility:hidden}#start-screen-info{display:flex;flex-direction:column;align-items:center;gap:30px;margin-top:20px;max-width:90%;text-align:center;margin-left:auto;margin-right:auto}.start-text{font-family:Ubuntu,sans-serif;font-size:clamp(1rem,2.5vw,1.3rem);color:var(--color-text);line-height:1.5}.timer-container{position:relative;display:flex;justify-content:center;align-items:center;width:var(--control-element-size);height:var(--control-element-size)}.timer-ring{position:absolute;top:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.timer-ring-bg{fill:none;stroke:var(--timer-bg-color);stroke-width:4px}.timer-ring-progress{fill:none;stroke:var(--main-color);stroke-width:4px;stroke-linecap:round;stroke-dasharray:144.51;stroke-dashoffset:0;will-change:stroke-dashoffset}main.svelte-12qhfyh{flex-grow:1;display:flex;flex-direction:column;width:100%;max-width:100%;margin:0;padding:0}#top-bar.svelte-12qhfyh{display:flex;justify-content:space-between;align-items:center;height:auto;min-height:70px;padding:10px var(--gap-size, 8px);margin-bottom:15px;width:100%;max-width:calc(var(--board-size) + 2 * var(--gap-size, 8px));margin-left:auto;margin-right:auto;box-sizing:border-box;flex-shrink:0}#game-title.svelte-12qhfyh{display:flex;justify-content:center;align-items:center;flex-grow:1;overflow:visible;--dot-size: clamp(2px, 4.5vw, 6px)}@media(max-width:360px){#game-title.svelte-12qhfyh{--dot-size: clamp(1.5px, 4vw, 5px)}}button.disabled.svelte-12qhfyh{opacity:.5;pointer-events:none;background-color:transparent;color:var(--color-text);font-style:italic}