@font-face{font-family:Almarai;src:url(/fonts/almarai/Almarai-Light.ttf) format("truetype");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:Almarai;src:url(/fonts/almarai/Almarai-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Almarai;src:url(/fonts/almarai/Almarai-Bold.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Almarai;src:url(/fonts/almarai/Almarai-ExtraBold.ttf) format("truetype");font-weight:800;font-style:normal;font-display:swap}@font-face{font-family:Red Rose;src:url(/fonts/red-rose/RedRose-Light.ttf) format("truetype");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:Red Rose;src:url(/fonts/red-rose/RedRose-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Red Rose;src:url(/fonts/red-rose/RedRose-Medium.ttf) format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Red Rose;src:url(/fonts/red-rose/RedRose-SemiBold.ttf) format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Red Rose;src:url(/fonts/red-rose/RedRose-Bold.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Figtree;src:url(/fonts/Figtree/Figtree-VariableFont_wght.ttf) format("truetype");font-weight:300 900;font-style:normal;font-display:swap}@font-face{font-family:Orbitron;src:url(/fonts/Orbitron/Orbitron-VariableFont_wght.ttf) format("truetype");font-weight:400 900;font-style:normal;font-display:swap}@font-face{font-family:Klee One;src:url(/fonts/Klee_One/KleeOne-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Klee One;src:url(/fonts/Klee_One/KleeOne-SemiBold.ttf) format("truetype");font-weight:600;font-style:normal;font-display:swap}:root{--color-blue: #3B82F6;--color-orange: #F97316;--color-yellow: #EAB308;--color-white: #ffffff;--color-dark: #2A2D30;--font-base: "Almarai", system-ui, -apple-system, sans-serif;--font-headline: "Red Rose", system-ui, -apple-system, sans-serif;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--transition: .3s ease-in-out;--card-transition: .4s ease-in-out}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%;font-size:clamp(11.38px,1.1111111111vw,28.44px)}body{height:100%}body{font-family:var(--font-base);-webkit-font-smoothing:antialiased}#app{height:100%;animation:fadeIn .2s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}h1,h2,h3{font-family:var(--font-headline)}button{cursor:pointer;font-family:var(--font-headline);border:none;outline:none}fieldset{border:none}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;border-radius:var(--radius-md);transition:opacity var(--transition),transform var(--transition)}.btn:hover{opacity:.88;transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn--back{padding:1rem 1.5rem;font-size:1.25rem;border-radius:var(--radius-md)}.btn--secondary{padding:.625rem 1.25rem;font-size:1.25rem;border-radius:var(--radius-md);white-space:nowrap}.btn--danger{padding:.625rem 1.25rem;font-size:1.5rem;border-radius:var(--radius-md);white-space:nowrap}.btn__icon{width:20px;height:20px}.btn__arrow{font-size:1.1rem}.scorebar__dot{display:inline-block;width:12px;height:12px;border-radius:50%;flex-shrink:0}.scorebar__dot--blue{background:var(--color-blue)}.scorebar__dot--orange{background:var(--color-orange)}.home{height:100%;background:var(--color-dark);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.home__bg-controller{position:absolute;bottom:-60px;left:-60px;width:500px;height:500px;color:#ffffff0a;pointer-events:none;-webkit-user-select:none;user-select:none;animation:controllerFloat 5s ease-in-out infinite}.home__bg-controller svg{width:100%;height:100%}.home__content{position:relative;z-index:1;text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:20px}.home__subtitle{color:#fff9;font-size:3rem;font-weight:400;letter-spacing:.02em}.home__title{color:var(--color-white);font-size:8.75rem;font-weight:800;line-height:1.1;letter-spacing:-.02em}.play-btn{display:inline-flex;background:none;border:none;padding:0;cursor:pointer}.play-btn__icon{height:98px;width:auto}@keyframes controllerFloat{0%,to{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-24px) rotate(-8deg)}}.settings{min-height:100%;background:#fff}.settings__inner{max-width:1440px;margin-inline:auto;width:100%;padding:48px 64px 0;display:flex;flex-direction:column;min-height:100vh}.settings__title{font-size:3.375rem;font-weight:800;color:#1a1a1a;margin-bottom:20px;position:relative;display:inline-block}.settings__title:before{content:"";position:absolute;bottom:-8px;left:0;width:10px;height:10px;background:var(--color-yellow);transform:rotate(45deg)}.settings__title:after{content:"";position:absolute;bottom:-5px;left:14px;width:100px;height:4px;background:var(--color-yellow);border-radius:2px}.settings__body{display:flex;gap:64px;align-items:flex-start;margin-top:40px;flex:1}.settings__form{display:flex;flex-direction:column;gap:32px;flex:1}.settings__group{display:flex;flex-direction:column;gap:10px}.settings__group-legend{display:flex;align-items:center;gap:8px;font-size:1.5rem;font-weight:700;color:#1a1a1a;margin-bottom:4px}.settings__group-icon{width:20px;height:20px;object-fit:contain}.settings__radio-list{list-style:none;display:flex;flex-direction:column;gap:10px;margin-left:28px}.settings__radio-label{display:flex;align-items:center;gap:12px;cursor:pointer;font-size:1.25rem;font-weight:500;color:#444;padding:2px 0;transition:color var(--transition),font-weight var(--transition)}.settings__radio-label:hover .settings__radio-custom{border-color:#999}.settings__radio-label:has(.settings__radio-input:checked){color:#1a1a1a;font-weight:700}.settings__radio-input{display:none}.settings__radio-input:checked+.settings__radio-custom{border-color:#1a1a1a;background:#1a1a1a}.settings__radio-input:checked+.settings__radio-custom:after{opacity:1;transform:scale(1)}.settings__radio-custom{width:18px;height:18px;border:2px solid #ccc;border-radius:50%;flex-shrink:0;position:relative;transition:border-color var(--transition),background var(--transition)}.settings__radio-custom:after{content:"";position:absolute;inset:3px;background:#fff;border-radius:50%;opacity:0;transform:scale(.5);transition:opacity var(--transition),transform var(--transition)}.settings__radio-flourish{display:flex;align-items:center;width:0;opacity:0;transition:width var(--transition),opacity var(--transition)}.settings__radio-flourish:before{content:"";width:100%;height:2px;background:var(--color-yellow);flex-shrink:0}.settings__radio-flourish:after{content:"";width:7px;height:7px;background:var(--color-yellow);transform:rotate(45deg);flex-shrink:0;margin-left:-1px}.settings__radio-input:checked~.settings__radio-flourish{width:48px;opacity:1}.settings__preview-column{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:16px}.settings__preview-area{width:460px;height:412px}.settings__preview-figure{margin:0}.settings__preview-img{display:block;width:460px;height:412px}.settings__bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 20px;background:#f2f2f0;border-radius:var(--radius-md);white-space:nowrap}.settings__bar-steps{display:flex;align-items:center;gap:12px;list-style:none}.settings__bar-step{display:flex;align-items:center;gap:12px;font-size:1.25rem;font-weight:600;color:#1a1a1a;white-space:nowrap}.settings__bar-step:not(:first-child):before{content:"";width:3px;height:20px;background:var(--color-yellow);transform:skew(-20deg);border-radius:1px}.settings__bar-step--pending{color:#a3a1a1}.settings__bar-step--pending:not(:first-child):before{background:#dbdbd6}.btn--start{display:inline-flex;border:none;padding:0;background:none;cursor:pointer;transition:opacity var(--transition),transform var(--transition)}.btn--start img{display:block}.btn--start:hover{opacity:.88;transform:translateY(-1px)}.btn--start:active{transform:translateY(0)}.btn--start:disabled{cursor:not-allowed}.btn--start:disabled:hover{opacity:1;transform:none}.game{min-height:100%;display:flex;flex-direction:column;align-items:center;font-family:var(--font-headline);transition:background var(--transition)}.scorebar{width:100%;max-width:1440px;margin-inline:auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px 28px;flex-shrink:0}.scorebar__scores{display:flex;align-items:center;justify-self:start;gap:20px;padding:12px 20px;border-radius:var(--radius-md)}.scorebar__score-entry{display:flex;align-items:center;gap:8px}.scorebar__score-text{font-size:1.5rem;font-weight:700}.scorebar__score-text--blue{color:var(--color-blue)}.scorebar__score-text--orange{color:var(--color-orange)}.scorebar__current{display:flex;align-items:center;justify-self:center;gap:8px;font-size:1.625rem;font-weight:500}.scorebar__tag{display:block;width:16px;height:13px;flex-shrink:0;-webkit-mask-image:var(--mask-src);mask-image:var(--mask-src);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}.scorebar__tag--blue{background-color:var(--color-blue)}.scorebar__tag--orange{background-color:var(--color-orange)}.scorebar__exit-btn{display:flex;align-items:center;justify-self:end;gap:6px;background:transparent;border:1.5px solid;padding:8px 16px;border-radius:var(--radius-sm);font-size:1.5rem;font-weight:600;transition:opacity var(--transition),transform var(--transition)}.scorebar__exit-btn:hover{opacity:.7;transform:translateY(-1px)}.scorebar__exit-icon{display:block;width:16px;height:16px;flex-shrink:0;background-color:currentColor;-webkit-mask-image:var(--mask-src);mask-image:var(--mask-src);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}.field{display:grid;gap:10px;padding:24px;flex:1;align-content:center;justify-content:center;justify-items:center;width:100%;max-width:800px}.card{aspect-ratio:1;width:100%;max-width:110px;background:transparent;border:none;padding:0;perspective:800px;cursor:pointer}.card:disabled{cursor:default}.card__inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform var(--card-transition)}.card__face{position:absolute;inset:0;border-radius:var(--radius-md);backface-visibility:hidden;display:flex;align-items:center;justify-content:center;overflow:hidden;border:var(--card-border-width, 2px) solid var(--card-border-color, transparent)}.card__face--revealed{background:#fff;transform:rotateY(180deg);box-shadow:inset 0 0 0 2px #0000000d}.card__back-image{width:100%;height:100%;object-fit:cover}.card.is-flipped .card__inner{transform:rotateY(180deg)}.card.is-matched .card__face--revealed{box-shadow:inset 0 0 0 2.5px #fff9,0 0 12px #ffffff26}.card__emoji{font-size:clamp(1.4rem,3vw,2rem);line-height:1}.card__badge{font-size:clamp(.55rem,1.2vw,.75rem);font-weight:800;padding:5px 7px;border-radius:5px;letter-spacing:.03em}.card__image{width:60%;height:60%;object-fit:contain}.game[data-theme=code-vibes] .card.is-matched .card__face{--card-border-width: 3px;--card-border-color: #45B7AC;box-shadow:0 0 10px #45b7ac66}.game[data-theme=gaming] .card.is-matched .card__face{--card-border-width: 3px;--card-border-color: #E91E8C;box-shadow:0 0 10px #e91e8c66}.game[data-theme=da-projects] .card.is-matched .card__face{--card-border-width: 2px;--card-border-color: #2B7FBF}.game[data-theme=food] .card.is-matched .card__face{--card-border-width: 3px;--card-border-color: #F5921B}.modal{position:fixed;inset:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .15s ease-in-out}.modal[hidden]{display:none}.modal__box{background:#fff;border-radius:var(--radius-xl);padding:2.5rem;width:min(33.75rem,90%);display:flex;flex-direction:column;justify-content:center;gap:3.375rem;text-align:center;box-shadow:0 20px 60px #00000040}.modal__text{font-size:2.5rem;font-weight:600;color:#1a1a1a;line-height:1.4}.modal__actions{display:flex;gap:.75rem;justify-content:center}.gameover{--reveal-delay: 5s;position:relative;overflow:hidden;min-height:100%;font-family:var(--font-headline);transition:background var(--transition)}.gameover__stage1{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:40px 24px;text-align:center;opacity:0;animation:stage1FadeIn .3s ease-out .1s forwards}.gameover__stage2{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:40px 24px;transform:translateY(-100%);animation:stage2SlideDown .65s cubic-bezier(.16,1,.3,1) var(--reveal-delay) forwards}.gameover__title{width:100%;font-size:8.125rem;letter-spacing:-.02em;text-align:center}.gameover__title--upper{text-transform:uppercase}.gameover__final-label{font-size:1.625rem;font-weight:500;opacity:.75}.gameover__result{display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center;opacity:0;animation:resultDropIn .4s ease-out calc(var(--reveal-delay) + .35s) forwards}.gameover__result--winner{position:relative}.gameover__confetti{width:min(760px,100%);height:auto;margin-bottom:4px}.gameover__icon{display:block;background-color:currentColor;-webkit-mask-image:var(--mask-src);mask-image:var(--mask-src);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;opacity:0;animation:iconPop .4s cubic-bezier(.34,1.56,.64,1) calc(var(--reveal-delay) + .6s) both}.gameover__icon--pawn{width:150px;height:150px}.gameover__icon--scale{width:180px;height:144px}.gameover__label{font-size:2.5rem;font-weight:500;opacity:.75}.gameover__winner-name{font-size:3.75rem;font-weight:800;letter-spacing:-.01em;text-transform:uppercase}.gameover__draw-text{font-size:8.125rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}.gameover__scores{display:flex;align-items:center;gap:20px;padding:10px 22px;border-radius:var(--radius-lg);font-size:2rem;font-weight:700}.gameover__scores--labeled{gap:16px}.gameover__score-entry{display:flex;align-items:center;gap:8px}.gameover__score-icon{display:block;background-color:currentColor;-webkit-mask-image:var(--mask-src);mask-image:var(--mask-src);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}.gameover__score-icon--tag{width:15px;height:12px}.gameover__score-icon--pawn{width:17px;height:17px}@keyframes stage1FadeIn{0%{transform:translateY(4px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes stage2SlideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes resultDropIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes iconPop{0%{transform:scale(0) rotate(-10deg);opacity:0}to{transform:scale(1) rotate(0);opacity:.9}}