@import"https://fonts.bunny.net/css?family=londrina-solid:300,400,900";*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0;font:inherit}body{min-height:100svh;position:relative}ul,li{list-style:none}input,textarea,select,button{display:block;box-sizing:border-box;border-radius:0;outline:none;border:none;background:none;color:inherit}input:-webkit-autofill,input:-webkit-autofill-selected{background:transparent}input:focus,textarea:focus,button:focus{outline:none}input[type=submit]:hover,button:hover{cursor:pointer}a{display:block;color:inherit;text-decoration:none}img,picture,svg,video{display:block;max-width:100%}:root{--layout-max-width: 81.25rem;--content-max-width: 71.875rem;--header-height: 4rem;--border-size: 2px;--white: #fff;--black: #000;--primary: #635FC7;--secondary: #D7E4FF;--tertiary: #E4EBFA;--accent: #FF865B;--success: #AEDFAE;--error: #EA5555;--info: #89E0EB;--existing: #FFD700;--pastille: #FF0000FF;--bg-light: #F2F2F2;--text-light: oklch(21% .006 285.885);--border-light: var(--secondary);--hover-light: var(--tertiary);--case-light: #828FA3;--focus-light: #F4F7FD;--bg-modal-light: rgba(255, 255, 255, .6);--icon-light: var(--primary);--bg-switch-light: var(--tertiary);--bg-dark: #1E1E2F;--text-dark: oklch(92% .01 285);--border-dark: #3C3F58;--hover-dark: #3A3E5C;--case-dark: #A0A8C0;--focus-dark: #2F334C;--bg-modal-dark: rgba(30, 30, 47, .6);--icon-dark: var(--info);--bg-switch-dark: var(--background-color)}[data-theme=light]{--background-color: var(--bg-light);--background-content: var(--white);--background-case: var(--case-light);--border: var(--border-light);--text: var(--text-light);--hover: var(--hover-light);--focus: var(--focus-light);--bg-modal: var(--bg-modal-light);--icon-color: var(--icon-light);--bg-switch: var(--bg-switch-light)}[data-theme=dark]{--background-color: var(--bg-dark);--background-content: #2B2D42;--background-case: var(--case-dark);--border: var(--border-dark);--text: var(--text-dark);--hover: var(--hover-dark);--focus: var(--focus-dark);--bg-modal: var(--bg-modal-dark);--icon-color: var(--icon-dark);--bg-switch: var(--bg-switch-dark)}:root{font-family:Londrina Solid,serif,display}html{scroll-behavior:smooth;scroll-padding:5rem}body{background-color:var(--background-color);transition:background-color .3s ease-in-out;color:var(--text);display:flex;flex-direction:column}main{flex-grow:.8}.wrapper{width:min(100% - 3rem,var(--layout-max-width));margin-inline:auto}@media (min-width: 87.5rem){.wrapper{width:min(100% - 2rem,var(--layout-max-width))}}.btn{cursor:pointer;border-radius:.625rem;letter-spacing:1px;transition:all .2s ease-in-out}.btn-primary{background-color:var(--primary);color:var(--white);padding:.625rem 1.25rem;font-size:1.25rem}.btn-primary:hover{opacity:.8;cursor:pointer}.btn-secondary{padding:.5rem;background-color:transparent}.btn-secondary:hover{background-color:var(--hover)}.tooltip{position:relative;display:inline-block;cursor:pointer}.tooltip:hover .tooltip-text{visibility:visible;opacity:1}.tooltip-text{visibility:hidden;background-color:var(--background-content);color:var(--text);text-align:center;padding:.375rem .625rem;border-radius:.375rem;font-weight:400;font-size:.875rem;white-space:nowrap;position:absolute;opacity:0;transition:opacity .2s ease-in-out;z-index:100}.pastille{position:absolute;top:.125rem;right:.125rem;width:.375rem;height:.375rem;border-radius:50%;background-color:var(--pastille)}.message-error{color:red;font-weight:700}.header{padding:1.25rem 0;position:relative}.header .header-nav{display:flex;align-items:center;justify-content:space-between}.header .logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.header-actions{display:flex;gap:.625rem}.header svg{color:var(--icon-color)}.header .tooltip-text{bottom:-2rem;left:50%;transform:translate(-50%)}.header .btn-rules{display:flex;align-items:center;gap:.875rem}.header .btn-rules span{background-color:var(--background-content);color:var(--text);text-align:center;padding:.375rem .625rem;border-radius:.375rem;font-weight:400;font-size:.875rem}.footer{padding:1.25rem 0}@media (max-width: 48rem){.footer{display:none}}.footer .wrapper{display:flex;justify-content:flex-end}.footer .wrapper .tooltip-text{top:2.8125rem;right:0}.footer svg{color:var(--icon-color)}.home .logo{display:flex;justify-content:center;margin-bottom:2.75rem}.wordle-form{display:flex;flex-direction:column}@media (min-width: 48rem){.wordle-form{flex-direction:row;position:relative;min-height:18.75rem}}.wordle-form .wordle-input-wrapper{margin:1.25rem auto;width:100%;max-width:25rem}.wordle-form .wordle-input-wrapper .message-error{margin:.625rem 0 0 1.25rem}.wordle-form .wordle-input{border:var(--border-size) solid var(--border);background-color:var(--background-content);border-radius:1.25rem;padding:1.5625rem 1.875rem;width:100%;color:var(--text);box-shadow:0 4px 6px #364e7e1a;transition:all .2s ease-in-out}.wordle-form .wordle-input::placeholder{color:var(--text)}.wordle-form .wordle-input:hover{border-color:var(--icon-color)}.wordle-form .wordle-input:focus-visible,.wordle-form .wordle-input:focus{border-color:var(--icon-color)}.wordle-form .wordle-btn{text-align:center;padding:.625rem 1.875rem;margin:1.875rem auto 0;font-size:1.0625rem;background-color:var(--hover)}.wordle-form .wordle-btn:hover{background-color:var(--primary);color:var(--white)}@media (min-width: 48rem){.wordle-guess{position:absolute;left:0;max-width:14.875rem;width:100%}}.wordle-guess-wrapper{border:var(--border-size) solid var(--border);border-radius:1.25rem;margin-top:1.25rem;background-color:var(--background-content);font-size:1.25rem;box-shadow:0 4px 6px #364e7e1a}.wordle-guess-wrapper .wordle-guess-header{border-bottom:var(--border-size) solid var(--border);padding:1.875rem 1.25rem 1.25rem;display:flex;align-items:center;justify-content:space-between}.wordle-guess-wrapper .wordle-guess-header .tooltip-text{bottom:0rem;left:3.75rem}.wordle-guess-wrapper .wordle-list{display:flex;flex-direction:column;gap:.625rem;padding:1.25rem}.wordle-guess-wrapper .wordle-list-item{display:flex;justify-content:space-between;align-items:center;position:relative;list-style:circle;background-color:transparent;border-radius:.5rem;padding:.125rem .25rem;transition:background-color .2s ease-in-out}.wordle-guess-wrapper .wordle-list-item:hover{background-color:var(--hover)}.wordle-guess-wrapper .wordle-list-item:before{content:"";position:absolute;width:.25rem;height:.25rem;top:50%;transform:translateY(-50%);background-color:var(--text);left:.25rem}.wordle-guess-wrapper .wordle-list-item span{text-indent:.875rem}.wordle-guess-wrapper .wordle-list-delete{display:flex;justify-content:center;text-align:center;margin-bottom:.625rem}.wordle-guess-wrapper .wordle-list-delete .btn{padding:.625rem 1.25rem}.wordle-guess-wrapper.in-game{position:absolute;top:1.25rem;left:0}.wordle-guess-wrapper.in-game .wordle-guess-header{gap:1.25rem}.hidden-list{position:fixed;top:10rem;left:0;z-index:2;padding:1.25rem 1.25rem 1.25rem 1.875rem;background-color:var(--primary);color:var(--white);border-radius:0 .75rem .75rem 0;display:flex;align-items:center;justify-content:center;box-shadow:2px 2px 6px #0003;transform:translate(-10px);cursor:pointer;transition:transform .2s ease}.hidden-list:hover{transform:translate(0)}.wordle-link{position:absolute;bottom:0;left:50%;transform:translate(-50%)}.wordle-link .btn{z-index:2}.game{display:flex;flex-direction:column;align-items:center;gap:1.25rem;position:relative;margin-top:6.375rem}@media (min-width: 48rem){.game{margin-top:2.75rem}}.game .logo{position:absolute;top:-10rem}.game .game-grid{display:flex;flex-direction:column;gap:.75rem}@media (max-width: 48rem){.game .hidden-list{top:5.625rem}}.letter-row{display:flex;gap:.5rem}.letter-row .letter-input{width:3.375rem;height:3.375rem;text-align:center;padding:.3125rem;text-transform:uppercase;border:var(--border-size) solid var(--border);border-radius:.375rem;color:var(--text);box-shadow:0 4px 6px #364e7e1a;font-size:1.875rem}.letter-row .letter-input:is(:focus,:focus-visible){background-color:var(--focus)!important}.keyboard{display:flex;flex-direction:column;align-items:center;width:fit-content;gap:.75rem;margin-top:1rem}@media (max-width: 48rem){.keyboard{display:none}}.keyboard .keyboard-row{display:flex;gap:.5rem}.keyboard .keyboard-button{height:3.125rem;border:1px solid var(--border);background-color:var(--background-content);border-bottom:4px solid var(--border);border-radius:.375rem;text-transform:uppercase;font-size:1.5rem;font-weight:400;transition:all .2s ease-in-out}.keyboard .keyboard-button:hover{transform:translateY(2px);border-bottom:2px solid var(--border)}.keyboard .keyboard-button:has(.backspace){display:flex;justify-content:center;align-items:center}.keyboard .keyboard-button.letter{width:3.125rem}.keyboard .keyboard-button.backspace{width:5rem}.keyboard .keyboard-button.absent{background-color:var(--error);color:var(--text)}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--bg-modal);display:flex;justify-content:center;align-items:center;z-index:10}.modal .modal-wrapper{background-color:var(--background-content);border-radius:1.25rem;padding:2.5rem;box-shadow:0 4px 6px #364e7e1a;min-width:22.5rem}.modal .modal-wrapper .modal-title-wrapper{position:relative}.modal .modal-wrapper .modal-title-wrapper .btn{position:absolute;top:.25rem;right:-.625rem}.modal .modal-wrapper .modal-title{font-size:1.875rem;text-align:center;font-weight:700}.modal .modal-wrapper .modal-title.success{color:green}.modal .modal-wrapper .modal-title.failed{color:red}.modal .modal-wrapper .modal-infos{margin:1.25rem 0 0;font-size:1.375rem}.modal .modal-wrapper .modal-elements{display:flex;flex-direction:column;gap:.75rem;margin:1.25rem 0;font-size:1.25rem}.modal .modal-wrapper .letter-input{display:flex;justify-content:center;align-items:center;background-color:var(--success);margin:1.875rem 0 3.75rem;color:var(--black)}.modal .modal-wrapper .modal-button{margin:auto;background-color:var(--primary);color:var(--white);padding:.625rem 1.875rem;border-radius:.625rem;letter-spacing:1px;font-size:1.25rem;transition:opacity .2s ease-in-out}.modal .modal-wrapper .modal-button:hover{opacity:.8}.settings-modal{pointer-events:none;visibility:hidden;width:100%;max-width:none;height:100%;max-height:none;color:inherit;overscroll-behavior:contain;z-index:999;place-items:center;margin:0;padding:0;display:grid;position:fixed;inset:0;overflow:hidden;border-width:0}.settings-modal::backdrop{display:none}.settings-modal[open],.settings-modal:target{opacity:1;pointer-events:auto;visibility:visible;background-color:var(--bg-modal);backdrop-filter:blur(2px)}.settings-modal[open] .dialog,.settings-modal:target .dialog{opacity:1;translate:0;scale:1}@starting-style{.settings-modal[open],.settings-modal:target{visibility:hidden;opacity:0}}.dialog-backdrop{color:#0000;z-index:-1;grid-row-start:1;grid-column-start:1;place-self:stretch stretch;display:grid}.dialog-backdrop button{cursor:pointer}.dialog{background-color:var(--background-content);border:var(--border-size) solid var(--border);box-shadow:0 4px 6px #364e7e1a;border-radius:.625rem;color:var(--text);overscroll-behavior:contain;grid-row-start:1;grid-column-start:1;width:90%;height:80%;max-width:40.625rem;max-height:37.5rem;overflow-y:auto;opacity:0;transition:scale .3s ease-out,opacity .2s ease-out 50ms,box-shadow .3s ease-out;scale:100%}@media (min-width: 48rem){.dialog{width:60%;height:40%}}@media (max-width: 48rem){.dialog.settings{height:40%}}.dialog-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);margin-bottom:1rem;font-size:1.875rem;padding:1rem 1.25rem;position:sticky;top:0;background:var(--background-content);z-index:2}.dialog-header .btn{transition:none}.dialog-body{padding:0 1.25rem 1rem;display:flex;flex-direction:column;gap:1.25rem}.dialog-body-item{display:flex;align-items:center;justify-content:space-between;padding-bottom:.75rem;border-bottom:1px solid var(--border)}.dialog-body-item.attempts{position:relative}.dialog-body-item.attempts .pastille{top:-.25rem;right:-.25rem}.switch{position:relative;display:inline-block;width:2.625rem;height:1.5em}.switch input{opacity:0;width:0;height:0}.switch input:checked+.slider{background-color:var(--primary);transition:transform .4s ease-in-out,background-color .4s ease-in-out}.switch input:checked+.slider:before{transform:translate(0)}.slider{position:absolute;cursor:pointer;inset:0;background-color:var(--bg-switch);border-radius:.75rem}.slider:before{position:absolute;content:"";top:3px;right:4px;height:1.125rem;width:1.125rem;transition:transform .4s ease-in-out;border-radius:50%;transform:translate(-1rem);background-color:var(--white)}@media (min-width: 48rem){.settings-modal:has(.dialog-body-list) .dialog{height:66%}}.settings-modal:has(.dialog-body-list) .dialog-body{font-weight:300}.settings-modal:has(.dialog-body-list) .dialog-body .text{font-weight:400}.dialog-body-list{display:flex;flex-direction:column;gap:1.25rem;margin:0 0 .625rem;font-weight:400}.dialog-body-list .dialog-body-list-element{display:flex;justify-content:space-between;align-items:center;list-style:circle;position:relative;text-indent:.875rem}.dialog-body-list .dialog-body-list-element:before{content:"";position:absolute;width:.25rem;height:.25rem;top:50%;transform:translateY(-50%);background-color:var(--text);left:.25rem}.dialog-body-example h3{font-size:1.375rem;font-weight:400}.dialog-body-example .content{display:flex;flex-direction:column;gap:1.625rem;margin-top:.625rem}.dialog-body-example .content .letter-input{font-weight:400}.dialog-body-example .content .correct .letter-input:first-child{background-color:var(--success);color:var(--black)}.dialog-body-example .content .present .letter-input:nth-child(2){background-color:var(--existing);color:var(--black)}.dialog-body-example .content .absent .letter-input:last-child{background-color:var(--secondary);color:var(--black)}.dialog-body-example .content .info{margin-top:.625rem}.dialog-body-example .content .info:first-letter{font-size:1.5rem;margin-right:.25rem;font-weight:400}.dialog-body-footer{margin-top:1.875rem;display:flex;flex-direction:column;gap:.375rem;font-size:.9375rem}
