header{color:#fff;background:#0f172a;justify-content:space-between;align-items:center;height:60px;padding:0 20px;display:flex}header .menu-toggle{display:none}header .hamburger{cursor:pointer;flex-direction:column;justify-content:center;gap:3px;height:24px;display:flex}header .hamburger span{background-color:#fff;width:25px;height:3px;transition:all .3s ease-in-out}header nav{background-color:#0f172a;flex-direction:column;transition:transform .3s ease-in-out;display:flex;position:fixed;inset:60px 0 0;transform:translate(-100%)}header nav button{color:#fff;cursor:pointer;background-color:#0000;border:none;font-family:times new roman;font-size:24px;font-weight:100;transition:all .2s ease-in-out}header nav button:hover{color:#cfcfff}header nav ul{text-align:center;background:0 0;flex-direction:column;align-items:center;gap:25px;margin-top:20px;display:flex}header nav ul li{list-style-type:none}header nav ul li a{color:#fff;font-size:1.5rem;text-decoration:none;transition:all .2s ease-in-out}header nav ul li a:hover{color:#cfcfff}header #menu-toggle:checked~nav{transform:translate(0)}header #menu-toggle:checked~label .line1{transform:rotate(-45deg)translate(-4.25px,4.25px)}header #menu-toggle:checked~label .line2{opacity:0}header #menu-toggle:checked~label .line3{transform:rotate(45deg)translate(-4.25px,-4.25px)}@media (width>=950px){header .hamburger{display:none}header nav{position:static;transform:translate(0)}header nav .header-footer{display:none}header nav ul{flex-direction:row;margin-top:0}}main{width:1100px;max-width:95dvw;margin:20px auto}.home-pagina{padding:3rem 1.5rem}.home-pagina__container{grid-template-columns:2fr 1fr;align-items:center;gap:2rem;max-width:1100px;margin:0 auto;display:grid}.home-pagina__content{color:#fff;background:linear-gradient(135deg,#1f2937,#111827);border-radius:1rem;padding:2.5rem;box-shadow:0 10px 25px #0000002e}.home-pagina__bovenregel{text-transform:uppercase;letter-spacing:.08em;color:#cbd5e1;margin:0 0 .75rem;font-size:.95rem;font-weight:600}.home-pagina__titel{margin:0 0 1rem;font-size:2.4rem;line-height:1.2}.home-pagina__tekst{color:#e5e7eb;max-width:650px;margin:0;font-size:1.05rem;line-height:1.7}.home-pagina__knoppen{flex-wrap:wrap;gap:1rem;margin-top:2rem;display:flex}.home-pagina__knop{border-radius:.75rem;padding:.85rem 1.4rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.home-pagina__knop--primair{color:#fff;background-color:#2563eb}.home-pagina__knop--primair:hover{background-color:#1d4ed8}.home-pagina__knop--secundair{color:#111827;background-color:#fff}.home-pagina__knop--secundair:hover{background-color:#e5e7eb}.home-pagina__kaart{background-color:#fff;border:1px solid #e5e7eb;border-radius:1rem;padding:2rem;box-shadow:0 10px 25px #00000014}.home-pagina__kaart-titel{color:#111827;margin-top:0;margin-bottom:1rem;font-size:1.3rem}.home-pagina__lijst{color:#374151;margin:0;padding-left:1.2rem;line-height:1.8}@media (width<=850px){.home-pagina__container{grid-template-columns:1fr}.home-pagina__titel{font-size:2rem}}@media (width<=500px){.home-pagina{padding:2rem 1rem}.home-pagina__content,.home-pagina__kaart{padding:1.5rem}.home-pagina__titel{font-size:1.7rem}}#catalogWrapper{flex-direction:column;gap:24px;display:flex}#catalogWrapper .catalogHero{color:#fff;background:linear-gradient(135deg,#1f2937,#111827);border-radius:18px;flex-direction:column;gap:18px;padding:24px;display:flex}#catalogWrapper .catalogHero h1{margin-bottom:8px;font-size:2rem}#catalogWrapper .catalogHero p{color:#cbd5e1;line-height:1.6}#catalogWrapper .catalogToolbar{flex-direction:column;justify-content:center;gap:12px;display:flex}#catalogWrapper .searchBox{flex-direction:column;gap:6px;width:100%;display:flex}#catalogWrapper .searchBox span{font-weight:700}#catalogWrapper .searchBox input{border:1px solid #d1d5db;border-radius:10px;width:100%;padding:13px 15px;font-size:1rem}#catalogWrapper .catalogCount{color:#374151;font-weight:700}#catalogWrapper .game-list{grid-template-columns:1fr;gap:22px;display:grid}#catalogWrapper .game-card{background-color:#fff;border:1px solid #e5e7eb;border-radius:16px;width:95%;margin:0 auto;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out;overflow:hidden;box-shadow:0 8px 22px #00000014}#catalogWrapper .game-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px #0000001f}#catalogWrapper .game-card img{aspect-ratio:16/10;object-fit:cover;border-bottom:1px solid #e5e7eb;width:100%}#catalogWrapper .game-card-content{flex-direction:column;gap:12px;padding:16px;display:flex}#catalogWrapper .game-card-content h2{font-size:1.15rem}#catalogWrapper .game-card-content p{color:#4b5563;line-height:1.5}#catalogWrapper .tagList{flex-wrap:wrap;gap:8px;display:flex}#catalogWrapper .tagList span{background-color:#f8fafc;border:1px solid #d1d5db;border-radius:999px;padding:5px 9px;font-size:.85rem}#catalogWrapper .game-card-actions{flex-direction:column;gap:10px;margin-top:auto;display:flex}#catalogWrapper .primaryButton,#catalogWrapper .secondaryButton,#catalogWrapper .filterButton{cursor:pointer;border-radius:10px;justify-content:center;align-items:center;width:max-content;padding:11px 16px;font-weight:700;text-decoration:none;transition:all .2s ease-in-out;display:inline-flex}#catalogWrapper .primaryButton{color:#fff;background-color:#4f46e5;border:1px solid #4f46e5}#catalogWrapper .primaryButton:hover{background-color:#4338ca}#catalogWrapper .secondaryButton,#catalogWrapper .filterButton{color:#111827;background-color:#fff;border:1px solid #d1d5db}#catalogWrapper .secondaryButton:hover,#catalogWrapper .filterButton:hover{background-color:#f3f4f6}#catalogWrapper .textButton{color:#4f46e5;font-weight:700;text-decoration:none}#catalogWrapper .textButton:hover{text-decoration:underline}#catalogWrapper .emptyState{text-align:center;background-color:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:30px}@media (width>=700px){#catalogWrapper .catalogHero{flex-direction:row;justify-content:space-between;align-items:center}#catalogWrapper .catalogToolbar{flex-direction:row;align-items:end}#catalogWrapper .searchBox{max-width:600px}#catalogWrapper .game-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1100px){#catalogWrapper .game-list{grid-template-columns:repeat(3,minmax(0,1fr))}}#CatalogGameWrapper{flex-direction:column;gap:24px;display:flex}#CatalogGameWrapper .catalogGameOptions{justify-content:space-between;align-items:center;gap:12px;display:flex}#CatalogGameWrapper .catalogGameOptions a{color:#111827;font-weight:700;text-decoration:none}#CatalogGameWrapper .catalogGameOptions a:hover{text-decoration:underline}#CatalogGameWrapper .catalogGameOptions form{margin:0}#CatalogGameWrapper .catalogGameOptions button{color:#fff;cursor:pointer;background-color:#dc3545;border:1px solid #dc3545;border-radius:10px;padding:10px 16px;font-weight:700}#CatalogGameWrapper .catalogGameOptions button:hover{background-color:#c82333}#CatalogGameWrapper #catalogGameList{grid-template-columns:1fr;gap:18px;display:grid}#CatalogGameWrapper #catalogGameList .catalogGameGroup{background-color:#fff;border:1px solid #e5e7eb;border-radius:16px;flex-direction:column;gap:12px;padding:18px;display:flex;box-shadow:0 8px 22px #00000014}#CatalogGameWrapper #catalogGameList .catalogGameGroup h2{color:#111827;font-size:1.35rem}#CatalogGameWrapper #catalogGameList .catalogGameGroup p{color:#4b5563;line-height:1.6}#CatalogGameWrapper #catalogGameList .catalogGameGroup ul{flex-wrap:wrap;gap:8px;padding:0;display:flex}#CatalogGameWrapper #catalogGameList .catalogGameGroup ul li{background-color:#f8fafc;border:1px solid #d1d5db;border-radius:999px;padding:6px 10px;font-size:.9rem;list-style:none}#CatalogGameWrapper #catalogGameList img{object-fit:cover;border-radius:12px;width:100%;max-height:420px}@media (width>=768px){#CatalogGameWrapper #catalogGameList{grid-template-columns:1.2fr 1fr}}#AddCatalogGameWrapper,form{flex-direction:column;gap:24px;display:flex}#AddCatalogGameWrapper .formHeader,form .formHeader{color:#fff;background:linear-gradient(135deg,#1f2937,#111827);border-radius:18px;padding:24px}#AddCatalogGameWrapper .formHeader h1,form .formHeader h1{margin-bottom:8px;font-size:2rem}#AddCatalogGameWrapper .formHeader p,form .formHeader p{color:#cbd5e1;line-height:1.6}#AddCatalogGameWrapper .gameForm,form .gameForm{background-color:#fff;border:1px solid #e5e7eb;border-radius:16px;flex-direction:column;gap:22px;padding:18px;display:flex;box-shadow:0 8px 22px #00000014}#AddCatalogGameWrapper .formError,form .formError{color:#dc3545;background-color:#fff5f5;border:1px solid #dc3545;border-radius:10px;padding:12px 14px;font-weight:700}#AddCatalogGameWrapper .fieldErrors,form .fieldErrors{color:#dc3545;margin-top:8px;font-weight:700}#AddCatalogGameWrapper .formGroup,form .formGroup{flex-direction:column;gap:8px;display:flex}#AddCatalogGameWrapper .formGroup label,form .formGroup label{font-weight:700}#AddCatalogGameWrapper .formGroup input,#AddCatalogGameWrapper .formGroup textarea,form .formGroup input,form .formGroup textarea{border:1px solid #d1d5db;border-radius:10px;width:100%;padding:12px 14px;font-size:1rem}#AddCatalogGameWrapper .formGroup textarea,form .formGroup textarea{resize:vertical;min-height:130px}#AddCatalogGameWrapper .formSection,form .formSection{flex-direction:column;gap:12px;display:flex}#AddCatalogGameWrapper .formSection h2,form .formSection h2{font-size:1.25rem}#AddCatalogGameWrapper .choiceGrid,form .choiceGrid{grid-template-columns:1fr;gap:10px;display:grid}#AddCatalogGameWrapper .choiceCard,form .choiceCard{cursor:pointer;border:1px solid #d1d5db;border-radius:12px;align-items:center;gap:10px;padding:12px;transition:all .2s ease-in-out;display:flex}#AddCatalogGameWrapper .choiceCard:hover,form .choiceCard:hover{background-color:#f3f4f6}#AddCatalogGameWrapper .choiceCard input,form .choiceCard input{width:auto}#AddCatalogGameWrapper .choiceCard span,form .choiceCard span{font-weight:600}#AddCatalogGameWrapper .formActions,form .formActions{flex-direction:column-reverse;align-items:stretch;gap:12px;display:flex}#AddCatalogGameWrapper .formActions .customButton,form .formActions .customButton{text-align:center}@media (width>=700px){#AddCatalogGameWrapper .gameForm{padding:24px}#AddCatalogGameWrapper .choiceGrid{grid-template-columns:repeat(2,minmax(0,1fr))}#AddCatalogGameWrapper .formActions{flex-direction:row;justify-content:flex-end}}@media (width>=1100px){#AddCatalogGameWrapper .choiceGrid{grid-template-columns:repeat(3,minmax(0,1fr))}}#AddGameToCollectionWrapper{flex-direction:column;gap:20px;display:flex}#AddGameToCollectionWrapper .gameInformation{flex-direction:column;gap:10px;display:flex}#AddGameToCollectionWrapper .gameInformation .tagList{flex-wrap:wrap;gap:8px;display:flex}#AddGameToCollectionWrapper .gameInformation .tagList span{background-color:#f8fafc;border:1px solid #d1d5db;border-radius:999px;padding:5px 9px;font-size:.85rem}#AddGameToCollectionWrapper .gameInformation .platforms,#AddGameToCollectionWrapper .gameInformation .genres{gap:10px;display:flex}#AddGameToCollectionWrapper .chooseCollections{flex-direction:column;gap:10px;display:flex}#AddGameToCollectionWrapper .chooseCollections .collections{gap:10px;display:flex}#AddGameToCollectionWrapper .chooseCollections .collections .collection{border:1px solid #000;align-items:center;gap:10px;padding:10px;display:flex}#AddGameToCollectionWrapper .chooseCollections .collections .collectionButtons{flex-direction:column-reverse;justify-content:center;align-items:center;gap:10px;display:flex}@media (width>=950px){#AddGameToCollectionWrapper .chooseCollections{width:80%;margin:0 auto}}#loginRegisterWrapper{border:1px solid #000;border-radius:10px;margin-top:20px;padding:20px}#loginRegisterWrapper form{max-width:95%;margin:auto}@media (width>=768px){#loginRegisterWrapper form{max-width:70%}}#CollectionWrapper{gap:20px;display:grid}#CollectionWrapper .collections{flex-direction:column;gap:10px;height:fit-content;display:flex}#CollectionWrapper .collections .collection{color:#000;border:1px solid #000;border-radius:5px;justify-content:space-between;align-items:center;padding:10px;text-decoration:none;transition:all .3s ease-in-out;display:flex}#CollectionWrapper .collections .collection .collectieEigenaar{text-align:center;border:1px solid #000;min-width:100px;padding:5px}#CollectionWrapper .collectionGames{flex-direction:column;gap:20px;display:flex}#CollectionWrapper .collectionGames .collectionGame{border-bottom:1px solid #000;justify-content:space-between;align-items:center;padding:10px;display:flex}#CollectionWrapper .collectionGames .collectionGame .gameInformation{align-items:center;gap:15px;display:flex}#CollectionWrapper .collectionGames .collectionGame:last-child{border-bottom:none}#CollectionWrapper .collectionGames .collectionGame img{width:100px;height:auto}#CollectionWrapper .collectionGames .collectionGame a{color:#000;border:1px solid #000;border-radius:5px;padding:5px;text-decoration:none;transition:all .25s ease-in-out}#CollectionWrapper .collectionGames .collectionGame a:hover{color:#fff;background-color:#616161}@media (width>=950px){#CollectionWrapper{grid-template-columns:2fr 3fr}}#ProfileWrapper{flex-direction:column;gap:20px;display:flex}#ProfileWrapper .profileHero{color:#fff;background:linear-gradient(135deg,#1f2937,#111827);flex-direction:column;gap:20px;padding:25px;display:flex}#ProfileWrapper .profileAvatar{color:#0f172a;background-color:#fff;border-radius:50%;justify-content:center;align-items:center;width:90px;height:90px;font-size:2.5rem;font-weight:700;display:flex}#ProfileWrapper .profileInfo{flex-direction:column;gap:8px;display:flex}#ProfileWrapper .profileLabel{text-transform:uppercase;letter-spacing:.08em;color:#cbd5e1;font-weight:700}#ProfileWrapper .profileRole{border:1px solid #fff;border-radius:999px;width:max-content;padding:6px 12px;font-weight:700}#ProfileWrapper .profileGrid{grid-template-columns:1fr;gap:20px;display:grid}#ProfileWrapper .profileAction{color:#000;flex-direction:column;gap:10px;text-decoration:none;transition:all .25s ease-in-out;display:flex}#ProfileWrapper .profileAction span{font-weight:700}#ProfileWrapper .profileAction:hover{color:#fff;background-color:#616161}@media (width>=768px){#ProfileWrapper .profileHero{flex-direction:row;align-items:center}#ProfileWrapper .profileGrid{grid-template-columns:repeat(3,1fr)}}#GenrePlatformWrapper{grid-template-columns:1fr;gap:20px;display:grid}#GenrePlatformWrapper .genrePlatforms,#GenrePlatformWrapper .genrePlatformContent{flex-direction:column;gap:16px;display:flex}#GenrePlatformWrapper .genrePlatforms{max-height:420px;overflow:hidden}#GenrePlatformWrapper .genrePlatformHeader{border-bottom:1px solid #e5e7eb;flex-direction:column;gap:10px;padding-bottom:12px;display:flex}#GenrePlatformWrapper .genrePlatformList{flex-direction:column;gap:10px;padding-right:6px;display:flex;overflow-y:auto}#GenrePlatformWrapper .genrePlatformList::-webkit-scrollbar{width:8px}#GenrePlatformWrapper .genrePlatformList::-webkit-scrollbar-track{background:#f1f5f9;border-radius:999px}#GenrePlatformWrapper .genrePlatformList::-webkit-scrollbar-thumb{background:#94a3b8;border-radius:999px}#GenrePlatformWrapper .genrePlatform{background-color:#fff;border:1px solid #d1d5db;border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:12px;display:flex}#GenrePlatformWrapper .genrePlatform p{word-break:break-word;font-weight:700}#GenrePlatformWrapper .customButtonSmall{white-space:nowrap;padding:7px 10px;font-size:.9rem}@media (width>=950px){#GenrePlatformWrapper{grid-template-columns:2fr 3fr;align-items:start}#GenrePlatformWrapper .genrePlatforms{max-height:calc(100dvh - 200px);position:sticky;top:80px}}*{box-sizing:border-box;margin:0;padding:0}body{flex-direction:column;min-height:100dvh;display:flex}header,footer{background-color:#0f172a}footer{color:#fff;margin-top:auto;padding:10px}.card{border:1px solid #000;border-radius:10px;padding:10px;box-shadow:3px 8px 10px #0000001a}.box{border:1px solid #000;border-radius:5px;padding:5px}ul li{list-style-position:inside}.customButton{cursor:pointer;color:#111827;background-color:#fff;border:1px solid #d1d5db;border-radius:10px;justify-content:center;align-items:center;width:max-content;padding:11px 16px;font-weight:700;text-decoration:none;transition:all .2s ease-in-out;display:inline-flex}.customButton:hover{background-color:#f3f4f6}.deleteForm{margin-top:20px}.customButtonDanger{color:#fff;cursor:pointer;background-color:#dc3545;border:1px solid #dc3545;border-radius:10px;padding:10px 20px;font-weight:700;transition:all .2s ease-in-out}.customButtonDanger:hover{background-color:#c82333;border-color:#bd2130}.formError{color:#dc3545;font-weight:700}.formHelp{color:#4b5563;margin-top:6px;font-size:.9rem;line-height:1.4}.visibilityGroup{flex-direction:column;gap:10px;display:flex}.visibilityGroup p{font-weight:700}.choiceCard{cursor:pointer;border:1px solid #d1d5db;border-radius:10px;align-items:flex-start;gap:10px;padding:12px;display:flex}.choiceCard span{flex-direction:column;gap:4px;display:flex}