.hero{padding:var(--space-sm) var(--space-md);background-color:var(--card-bg);border-bottom:1px solid var(--border);height:min(100dvh,500px);display:grid;place-content:center;font-size:1.5rem}.hero .circle{aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;padding:var(--space-lg);border-radius:100%;background-color:var(--button-primary-bg);color:var(--button-primary-color);width:fit-content;margin:0 auto;margin-bottom:var(--space-lg)}.hero svg{width:4rem;height:4rem}.hero h1{margin:0;font-size:3rem}.hero .button-container{text-align:center}.hero button+button{margin-left:var(--space-sm)}.hero p{color:var(--muted);margin-top:var(--space-sm);margin-bottom:var(--space-md)}h2:is(#how-to-play,#play){scroll-margin-top:var(--space-lg);margin-top:var(--space-lg)}.card.steps{flex-direction:column;max-width:70ch;width:100%;margin:0 auto;margin-bottom:var(--space-md)}.card.steps .header{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:var(--space-sm)}.card.steps .circle{aspect-ratio:1 / 1;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:var(--space-sm);border-radius:100%;background-color:var(--button-primary-bg);color:var(--button-primary-color);font-size:1.2rem;font-weight:700}.card.steps h3{margin:0}.card.steps>p{color:var(--muted);margin:0;line-height:1.5;text-align:left;width:100%}.card.steps .difficulty-container{display:flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:var(--space-md)}.card.steps .difficulty-container .card{flex-direction:column}.card.steps .difficulty-container p,.card.steps .difficulty-container h4{margin:0}*{box-sizing:border-box}:root{--radius: 4px;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem}:root{--bg: #fff;--color: #3c3c43;--muted: #67676c;--border: #e2e2e3;--border-hover: #18794e;--card-bg: #f6f6f7;--warning-color: #3c3c43;--success-color: #3c3c43;--error-color: #3c3c43;--warning-bg: rgba(234, 179, 8, .14);--success-bg: rgba(16, 185, 129, .14);--error-bg: rgba(244, 63, 94, .14);--button-primary-bg: #f7d436;--button-primary-border: #ecb732;--button-primary-color: #111827;--button-primary-hover-bg: #ffd859;--button-primary-hover-border: #ecb732;--button-primary-hover-color: #0d121b;--button-secondary-bg: #ebebef;--button-secondary-border: transparent;--button-secondary-color: #3c3c43;--button-secondary-hover-bg: #e4e4e9;--button-secondary-hover-border: transparent;--button-secondary-hover-color: #3c3c43;--button-plain-bg: var(--bg);--button-plain-border: var(--bg);--button-plain-color: var(--color);--button-plain-hover-bg: #f8f8f8;--button-plain-hover-border: #18794e;--button-plain-hover-color: var(--color);--input-bg: #f6f6f7}@media(prefers-color-scheme:dark){:root{--bg: #111827;--color: #d9e6eb;--muted: #98989f;--border: #2e2e32;--border-hover: #ffd859;--card-bg: #161f32;--warning-color: #d9e6eb;--success-color: #d9e6eb;--error-color: #d9e6eb;--warning-bg: rgba(234, 179, 8, .16);--success-bg: rgba(16, 185, 129, .16);--error-bg: rgba(244, 63, 94, .16);--button-primary-bg: #f7d436;--button-primary-border: #ecb732;--button-primary-color: #111827;--button-primary-hover-bg: #f7d336;--button-primary-hover-border: #f7d336;--button-primary-hover-color: #0d121b;--button-secondary-bg: #32363f;--button-secondary-border: transparent;--button-secondary-color: #d9e6eb;--button-secondary-hover-bg: #414853;--button-secondary-hover-border: transparent;--button-secondary-hover-color: #d9e6eb;--button-plain-bg: var(--bg);--button-plain-border: var(--bg);--button-plain-color: var(--color);--button-plain-hover-bg: #161f32;--button-plain-hover-border: #ffd859;--button-plain-hover-color: var(--color);--input-bg: #0d121b}}body{font-family:Inter,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;color:var(--color);background-color:var(--bg)}main{padding:var(--space-lg);max-width:900px;margin:0 auto}button,a.button{border-radius:20px;padding:0 20px;line-height:38px;font-size:14px;font-weight:700;cursor:pointer;display:inline-block;text-decoration:none;--button-color: var(--button-plain-color);--button-border: var(--button-plain-border);--button-bg: var(--button-plain-bg);color:var(--button-color);border:1px solid var(--button-border);background-color:var(--button-bg);transition:.2s ease}:is(button,a.button):hover{--button-color: var(--button-plain-hover-color);--button-border: var(--button-plain-hover-border);--button-bg: var(--button-plain-hover-bg)}:is(button,a.button).primary{--button-color: var(--button-primary-color);--button-border: var(--button-primary-border);--button-bg: var(--button-primary-bg)}:is(button,a.button).primary:hover{--button-color: var(--button-primary-hover-color);--button-border: var(--button-primary-hover-border);--button-bg: var(--button-primary-hover-bg)}:is(button,a.button).secondary{--button-color: var(--button-secondary-color);--button-border: var(--button-secondary-border);--button-bg: var(--button-secondary-bg)}:is(button,a.button).secondary:hover{--button-color: var(--button-secondary-hover-color);--button-border: var(--button-secondary-hover-border);--button-bg: var(--button-secondary-hover-bg)}:is(button,a.button):disabled{cursor:not-allowed}.card{background-color:var(--card-bg);border-radius:var(--radius);width:fit-content;padding:var(--space-md);display:flex;gap:var(--space-sm);justify-content:center;align-items:center}.card.success{--card-bg: var(--success-bg);color:var(--success-color)}.card.warning{--card-bg: var(--warning-bg);color:var(--warning-color)}.card.error{--card-bg: var(--error-bg);color:var(--error-color)}h1,h2{text-align:center;margin-top:0}input{color:var(--muted);background-color:var(--input-bg);border-radius:var(--radius);border:1px solid var(--border-hover);padding:var(--space-sm);outline:none}.not-found-main{min-height:85vh;text-align:center}.distorted-image{max-width:min(50vh,50vw);transform:skew(40deg) skewY(20deg)}.the-footer{padding:var(--space-lg) var(--space-md);background-color:var(--card-bg);border-top:1px solid var(--border)}.the-footer p{text-align:center;max-width:900px;margin:0 auto;color:var(--muted);font-size:.875rem;line-height:1.5}.the-footer svg{width:.8rem;height:.8rem;display:inline;vertical-align:middle;margin-left:var(--space-sm)}.the-footer a{color:var(--color);text-decoration-color:var(--card-bg);transition:.2s ease}.the-footer a:hover{text-decoration-color:var(--color)}header.nav{padding:var(--space-sm) var(--space-md);background-color:var(--card-bg);border-bottom:1px solid var(--border)}header.nav .wrapper{display:flex;justify-content:space-between;align-items:center;gap:var(--space-md);max-width:900px;margin:0 auto}header.nav .title-logo{text-decoration:none;color:inherit;display:flex;align-items:center;justify-content:center;gap:var(--space-sm)}header.nav .circle{aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;padding:var(--space-sm);border-radius:100%;background-color:var(--button-primary-bg);color:var(--button-primary-color)}header.nav svg{width:1.5rem;height:1.5rem}header.nav .title{font-weight:700;margin:0;font-size:1.5rem}header.nav a+a{margin-left:var(--space-sm)}@media(max-width:350px){header.nav .about-button{display:none}}