body{background-color:var(--white);box-sizing:border-box;flex-direction:column;width:100%;max-width:1440px;height:100dvh;margin:0 auto;padding:24px 32px 32px;font-family:Almarai,sans-serif;display:flex;overflow:hidden}main{box-sizing:border-box;flex-direction:column;flex:auto;gap:clamp(1rem,2vw,2rem);width:100%;min-width:0;max-width:100%;min-height:0;padding:0;display:flex}h2{margin:0;font-family:Red Rose,sans-serif;font-size:clamp(3rem,2.893rem + .536vw,3.375rem);font-weight:700;line-height:1}h3{margin:0;font-size:clamp(1rem,1.2vw + .75rem,1.5rem);font-weight:700}.settings-title{display:inline-block;position:relative}.settings-title:after{content:"";background:var(--yellow-300);width:100%;height:4px;position:absolute;bottom:-12px;left:0}.settings-title:before{content:"";background:var(--yellow-300);width:20px;height:20px;position:absolute;bottom:-20px;left:0;transform:rotate(45deg)}.title-wrapper{align-items:center;gap:.25em;padding:0 0 .5em;display:flex}.title-wrapper img{flex-shrink:0;height:32px}.settings-content-wrapper{grid-template-columns:260px 1fr;grid-template-areas:"settings preview""settings selection";align-items:start;gap:clamp(1rem,.482rem + 2.589vw,2.813rem) clamp(.375rem,1.887vw - .698rem,1rem);width:100%;min-width:0;max-width:100%;padding-top:clamp(1.25rem,7.407vw - 2.917rem,3.75rem);display:grid}.settings-box{flex-direction:column;flex:0 0 260px;grid-area:settings;justify-content:flex-start;width:260px;margin:0;display:flex}.settings-box .theme-box,.settings-box .player-box,.settings-box .size-box{padding:0 0 clamp(1rem,2vw,2rem)}.settings-box .theme-list,.settings-box .size-list,.settings-box .player-list{flex-direction:column;gap:clamp(.25rem,.741vw - .167rem,.5rem);display:flex}.preview-wrapper{grid-area:preview;justify-content:flex-end;align-items:flex-start;margin:0;display:flex}.preview-wrapper>img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:60vh;display:block}.settings-form{grid-area:selection;justify-self:end;width:auto}.settings-selection{background-color:var(--neutral-100);box-sizing:border-box;grid-template-columns:clamp(9.375rem,3.957rem + 8.936vw,12rem) 4px 120px 4px clamp(5.625rem,1.755rem + 6.383vw,7.5rem) max-content;grid-template-areas:"theme sep1 player sep2 size button";place-items:center;gap:clamp(.75rem,2.553vw - .798rem,1.5rem);padding:12px 20px;display:grid}.settings-selection .separator{background-color:var(--yellow-300);flex-direction:column;flex-shrink:0;justify-content:flex-end;width:8px;height:56px;display:flex;transform:rotate(16deg)}.settings-selection .diamond{border:solid 6px var(--yellow-300);margin-left:-4px;transform:rotate(45deg)}.settings-selection .sep1{grid-area:sep1}.settings-selection .sep2{grid-area:sep2}.settings-selection .separator-small{width:4px}.settings-selection .current-theme{grid-area:theme;width:clamp(9.375rem,3.957rem + 8.936vw,12rem)}.settings-selection .current-player{grid-area:player;width:120px}.settings-selection .current-size{grid-area:size;width:clamp(5.625rem,1.755rem + 6.383vw,7.5rem)}.settings-selection .current-player,.settings-selection .current-size,.settings-selection .current-theme{text-align:center;white-space:nowrap;box-sizing:border-box;font-size:clamp(1.125rem,.867rem + .426vw,1.25rem)}.settings-selection .start-btn{border:unset;grid-area:button;justify-content:center;justify-self:start;align-items:center;gap:.5em;padding:14px 24px;font-family:Red Rose,sans-serif;font-size:clamp(1.125rem,.867rem + .426vw,1.25rem);display:flex}.start-btn-activate{color:#303131;background-color:var(--yellow-300)}.line-wrap-small{align-items:center;display:none}.line-small{background-color:var(--yellow-300);width:41px;height:3px}.diamond-small{background-color:var(--yellow-300);width:12px;height:12px;transform:rotate(45deg)}.list-element input{appearance:none;box-sizing:border-box;background:#fff;border:3px solid #303131;border-radius:50%;flex-shrink:0;width:20px;height:20px;display:inline-block}label{cursor:pointer;align-items:center;gap:10px;display:flex}.list-element:has(input:checked) .line-wrap-small{display:flex}.list-element:has(input:checked) .list-text{font-weight:700}.list-element:has(input:checked) input{background:radial-gradient(#303131 0 25%,#0000 30% 100%);border:2px solid #303131}:is(.theme-list.has-hover .list-element:has(input:checked):not(.is-hovered) .line-wrap-small,.player-list.has-hover .list-element:has(input:checked):not(.is-hovered) .line-wrap-small,.size-list.has-hover .list-element:has(input:checked):not(.is-hovered) .line-wrap-small){display:none}:is(.theme-list.has-hover .list-element:has(input:checked):not(.is-hovered) .list-text,.player-list.has-hover .list-element:has(input:checked):not(.is-hovered) .list-text,.size-list.has-hover .list-element:has(input:checked):not(.is-hovered) .list-text){font-weight:400}:is(.theme-list.has-hover .list-element:has(input:checked):not(.is-hovered) input,.player-list.has-hover .list-element:has(input:checked):not(.is-hovered) input,.size-list.has-hover .list-element:has(input:checked):not(.is-hovered) input){background:#fff;border:3px solid #303131}.theme-list.has-hover .list-element.is-hovered .line-wrap-small,.player-list.has-hover .list-element.is-hovered .line-wrap-small,.size-list.has-hover .list-element.is-hovered .line-wrap-small{display:flex}.theme-list.has-hover .list-element.is-hovered .list-text,.player-list.has-hover .list-element.is-hovered .list-text,.size-list.has-hover .list-element.is-hovered .list-text{font-weight:700}.theme-list.has-hover .list-element.is-hovered input,.player-list.has-hover .list-element.is-hovered input,.size-list.has-hover .list-element.is-hovered input{background:radial-gradient(#303131 0 25%,#0000 30% 100%);border:2px solid #303131}.d-none{display:none}main::-webkit-scrollbar{display:none}main{scrollbar-width:none;-ms-overflow-style:none}@media (width<=900px){body{flex-direction:column;height:100vh;min-height:0;padding:16px 16px 24px;display:flex}main{box-sizing:border-box;flex-direction:column;flex:auto;gap:14px;width:100%;min-height:0;padding-right:4px;display:flex;overflow:hidden auto}.settings-content-wrapper{grid-template-columns:1fr;grid-template-areas:"settings""preview""selection";gap:12px}.settings-box{flex:auto;width:100%}.preview-wrapper{justify-content:center}.preview-wrapper>img{width:80%;height:auto}.settings-form{justify-self:stretch;width:100%}.current-player,.current-size,.current-theme{font-size:14px}.settings-selection{grid-template-columns:1fr 8px 1fr 8px 1fr;place-items:center;gap:12px}.settings-selection .current-theme,.settings-selection .current-player,.settings-selection .current-size{white-space:normal;text-align:center;width:100%;line-height:1.2}.settings-selection .start-btn{justify-self:center;width:fit-content}}@media (width<=550px){.settings-selection{grid-template-areas:"theme sep1 player sep2 size""button button button button button"}}