:root{--color-backlog:#6c757d;--color-playing:#0d6efd;--color-completed:#198754;--color-abandoned:#dc3545;--color-wishlist:#ffc107;font-size:16px}body,html{height:100%;margin:0}#app{min-height:100%}#app,.main-layout{display:flex;flex-direction:column}.main-layout{min-height:100vh}.main-layout>main{flex:1;padding-bottom:2rem;padding-top:1rem}.main-layout>footer{border-top:1px solid var(--pico-muted-border-color);padding:1rem 0;text-align:center}header nav{justify-content:space-between}header nav,header nav ul{align-items:center;display:flex}header nav ul{gap:.5rem;list-style:none;margin:0;padding:0}header nav a{text-decoration:none}header nav a.active{font-weight:700}header nav a.brand{font-size:1.25rem}header nav .username{color:var(--pico-muted-color)}header nav a.logout{cursor:pointer}header nav .theme-selector{background:transparent;border:1px solid var(--pico-muted-border-color);font-size:.875rem;margin:0;min-width:70px;padding:.25rem .5rem;width:auto}.page-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem}.page-header h1{margin:0}.loading-container{padding:3rem;text-align:center}.loading{animation:spin 1s linear infinite;border:3px solid var(--pico-muted-border-color);border-radius:50%;border-top-color:var(--pico-primary);display:inline-block;height:2rem;width:2rem}@keyframes spin{to{transform:rotate(1turn)}}.empty-state{background:var(--pico-card-background-color);border-radius:var(--pico-border-radius);padding:3rem;text-align:center}.empty-state h3{margin-bottom:.5rem}.empty-state p{color:var(--pico-muted-color)}.empty-state button,.empty-state p{margin-bottom:1.5rem}.collection-grid,.games-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin-bottom:1.5rem}.game-card{display:flex;flex-direction:column;overflow:hidden;padding:0}.game-card .game-cover{aspect-ratio:3/4;background:var(--pico-muted-border-color);overflow:hidden;position:relative}.game-card .game-cover img{height:100%;object-fit:cover;width:100%}.game-card .game-cover.clickable{cursor:pointer}.game-card .game-info{flex:1;padding:1rem}.game-card .game-title{font-size:1rem;line-height:1.3;margin:0 0 .25rem}.game-card .game-genres,.game-card .game-platforms,.game-card .game-year{color:var(--pico-muted-color);margin:0}.game-card .game-actions{display:flex;flex-wrap:wrap;gap:.5rem;padding:0 1rem 1rem}.game-card .game-actions button{flex:1;font-size:.875rem;margin:0;padding:.5rem}.local-cover-badge{background-color:rgba(0,0,0,.7);border-radius:4px;bottom:.5rem;color:#fff;cursor:help;font-size:.75rem;line-height:1;opacity:.8;padding:.25rem .4rem;position:absolute;right:.5rem;transition:opacity .2s ease}.local-cover-badge:hover{opacity:1}.collection-info{border-top:1px solid var(--pico-muted-border-color);margin-top:.75rem;padding-top:.75rem}.status-row{align-items:center;display:flex;gap:.5rem;margin-bottom:.5rem}.rating-row{margin-bottom:.25rem}.hours-played,.item-platform{margin:0}.badge{border-radius:var(--pico-border-radius);display:inline-block;font-size:.75rem;font-weight:600;padding:.25rem .5rem;text-transform:uppercase}.badge.secondary{background:var(--color-backlog);color:#fff}.badge.primary{background:var(--color-playing);color:#fff}.badge.success{background:var(--color-completed);color:#fff}.badge.warning{background:var(--color-abandoned);color:#fff}.badge.wishlist{background:var(--color-wishlist);color:#000}.favorite-badge,.physical-badge{font-size:.875rem}.rating-stars .star{color:var(--pico-muted-color)}.rating-stars .star.filled{color:#ffc107}.collection-filters{margin-bottom:1.5rem}.filter-row{align-items:center;display:flex;flex-wrap:wrap;gap:1rem}.filter-row input[type=search]{flex:2;min-width:200px}.filter-row select{flex:1;min-width:150px}.favorites-toggle{align-items:center;display:flex;gap:.5rem;white-space:nowrap}.favorites-toggle input{margin:0}.filter-actions{margin-top:.5rem}.pagination-row{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;margin-top:1rem}.results-info{color:var(--pico-muted-color)}.pagination-buttons{align-items:center;display:flex;gap:.5rem}.page-indicator{color:var(--pico-muted-color);padding:0 .5rem}.pagination-buttons button.small{font-size:.875rem;padding:.4rem .8rem}.stats-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin-bottom:1.5rem}.stat-card{background:var(--pico-card-background-color);border-radius:var(--pico-border-radius);padding:1rem;text-align:center}.stat-card.highlight{background:var(--pico-primary-background);color:#fff}.stat-value{display:block;font-size:2rem;font-weight:700;line-height:1.2}.stat-label{color:var(--pico-muted-color);display:block;font-size:.875rem}.stat-card.highlight .stat-label{color:#fff}.status-bars{gap:.75rem}.status-bar-item,.status-bars{display:flex;flex-direction:column}.status-bar-item{gap:.25rem}.status-bar-label{display:flex;font-size:.875rem;justify-content:space-between}.status-bar-track{background:var(--pico-muted-border-color);border-radius:.25rem;height:.5rem;overflow:hidden}.status-bar-fill{border-radius:.25rem;height:100%;transition:width .3s ease}.status-bar-fill.backlog{background:var(--color-backlog)}.status-bar-fill.playing{background:var(--color-playing)}.status-bar-fill.completed{background:var(--color-completed)}.status-bar-fill.abandoned{background:var(--color-abandoned)}.status-bar-fill.wishlist{background:var(--color-wishlist)}.platform-list{display:flex;flex-direction:column;gap:.5rem}.platform-item{background:var(--pico-card-background-color);border-radius:var(--pico-border-radius);display:flex;justify-content:space-between;padding:.5rem}.platform-count{font-weight:700}.stats-actions{margin-top:1.5rem}dialog{max-width:500px}dialog[open]{z-index:1001}dialog article{margin:0}dialog article header{position:relative}dialog article header .close{background:none;border:none;cursor:pointer;font-size:1.5rem;margin:0;padding:0;position:absolute;right:0;top:50%;transform:translateY(-50%);width:auto}dialog article footer{display:flex;gap:1rem;justify-content:flex-end}dialog article footer button{margin:0}.rating-select{margin-bottom:1rem}.rating-select>label{display:block;font-weight:700;margin-bottom:.5rem}.star-buttons{display:flex;flex-wrap:wrap;gap:.5rem}.star-btn{background:var(--pico-secondary-background)}.star-btn:hover{background:var(--pico-secondary-hover-background);border:7px solid #000}.star-btn:focus{box-shadow:0 0 0 3px rgba(13,110,253,.25);outline:none}.star-btn.selected{background:var(--pico-primary);border:7px solid gold;color:var(--pico-primary-inverse);font-weight:700}.star-btn.selected:hover{background:var(--pico-primary-hover);border-color:var(--pico-primary-hover)}.search-bar{margin-bottom:1.5rem}.search-bar input{width:100%}.search-hint{font-size:.875rem;margin-top:1rem}.search-hint,.search-pending{color:var(--pico-muted-color);text-align:center}.search-pending{padding:1rem}.search-pending p:before{animation:spin 1s linear infinite;border:2px solid var(--pico-muted-border-color);border-radius:50%;border-top-color:var(--pico-primary);content:"";display:inline-block;height:1rem;margin-right:.5rem;vertical-align:middle;width:1rem}.button-group{display:flex;flex-wrap:wrap;gap:1rem}.results-count{color:var(--pico-muted-color);text-align:center}.auth-page{padding:3rem;text-align:center}.auth-page h1{margin-bottom:1rem}.auth-page p{margin-bottom:1.5rem}.sso-callback{padding:3rem;text-align:center}.browse-page section{margin-bottom:2rem}.browse-page .section-title{align-items:baseline;border-bottom:1px solid var(--pico-muted-border-color);display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;padding-bottom:.5rem}.browse-page .section-title .result-count{color:var(--pico-muted-color);font-size:.875rem;font-weight:400}.browse-page .section-title .igdb-attribution{color:var(--pico-muted-color);font-size:.75rem;font-weight:400;margin-left:auto}.browse-page .section-title .igdb-attribution a{color:inherit;text-decoration:underline}.browse-page .igdb-results{border-top:2px solid var(--pico-muted-border-color);margin-top:1rem;padding-top:1rem}.browse-page .error-state{padding:2rem;text-align:center}.browse-page .error-state .error-message{margin-bottom:1rem}.browse-page .pending-state{color:var(--pico-muted-color);padding:2rem;text-align:center}.storefront-select{margin-bottom:1rem;position:relative}.storefront-select.disabled{opacity:.6;pointer-events:none}.storefront-select .storefront-label{display:block;font-weight:500;margin-bottom:.25rem}.storefront-select .storefront-input-container{background:var(--pico-form-element-background-color);border:1px solid var(--pico-form-element-border-color);border-radius:var(--pico-border-radius);cursor:pointer;min-height:2.5rem;padding:.5rem;transition:border-color .2s}.storefront-select .storefront-input-container:hover{border-color:var(--pico-form-element-active-border-color)}.storefront-select .storefront-chips{align-items:center;display:flex;flex-wrap:wrap;gap:.375rem}.storefront-select .storefront-placeholder{color:var(--pico-form-element-placeholder-color);font-size:.875rem}.storefront-select .storefront-chip{align-items:center;background:var(--pico-primary);border-radius:1rem;color:var(--pico-primary-inverse);display:inline-flex;font-size:.75rem;font-weight:500;gap:.25rem;padding:.125rem .5rem}.storefront-select .chip-remove{background:none;border:none;color:inherit;cursor:pointer;font-size:.875rem;line-height:1;margin:0;opacity:.8;padding:0;width:auto}.storefront-select .chip-remove:hover{opacity:1}.storefront-select .storefront-toggle{color:var(--pico-muted-color);font-size:.625rem;margin-left:auto;transition:transform .2s}.storefront-select .storefront-toggle.open{transform:rotate(180deg)}.storefront-select .storefront-dropdown{background:var(--pico-card-background-color);border:1px solid var(--pico-muted-border-color);border-radius:var(--pico-border-radius);box-shadow:0 4px 12px rgba(0,0,0,.15);left:0;margin-top:.25rem;max-height:300px;overflow-y:auto;position:absolute;right:0;top:100%;z-index:100}.storefront-select .storefront-category{padding:.5rem 0}.storefront-select .storefront-category:not(:last-child){border-bottom:1px solid var(--pico-muted-border-color)}.storefront-select .category-header{color:var(--pico-muted-color);font-size:.75rem;font-weight:600;letter-spacing:.05em;padding:.25rem .75rem;text-transform:uppercase}.storefront-select .storefront-option{align-items:center;cursor:pointer;display:flex;gap:.5rem;margin:0;padding:.375rem .75rem;transition:background-color .15s}.storefront-select .storefront-option:hover{background:var(--pico-secondary-hover-background)}.storefront-select .storefront-option.selected{background:var(--pico-primary-background)}.storefront-select .storefront-option input[type=checkbox]{height:1rem;margin:0;width:1rem}.storefront-select .option-name{font-size:.875rem}.platform-select{margin-bottom:1rem;position:relative}.platform-select.disabled{opacity:.6;pointer-events:none}.platform-select .platform-label{display:block;font-weight:500;margin-bottom:.25rem}.platform-select .platform-input-container{background:var(--pico-form-element-background-color);border:1px solid var(--pico-form-element-border-color);border-radius:var(--pico-border-radius);cursor:pointer;min-height:2.5rem;padding:.5rem;transition:border-color .2s}.platform-select .platform-input-container:hover{border-color:var(--pico-form-element-active-border-color)}.platform-select .platform-chips{align-items:center;display:flex;flex-wrap:wrap;gap:.375rem}.platform-select .platform-placeholder{color:var(--pico-form-element-placeholder-color);font-size:.875rem}.platform-select .platform-chip{align-items:center;background:var(--pico-primary);border-radius:1rem;color:var(--pico-primary-inverse);display:inline-flex;font-size:.75rem;font-weight:500;gap:.25rem;padding:.125rem .5rem}.platform-select .chip-remove{background:none;border:none;color:inherit;cursor:pointer;font-size:.875rem;line-height:1;margin:0;opacity:.8;padding:0;width:auto}.platform-select .chip-remove:hover{opacity:1}.platform-select .platform-toggle{color:var(--pico-muted-color);font-size:.625rem;margin-left:auto;transition:transform .2s}.platform-select .platform-toggle.open{transform:rotate(180deg)}.platform-select .platform-dropdown{background:var(--pico-card-background-color);border:1px solid var(--pico-muted-border-color);border-radius:var(--pico-border-radius);box-shadow:0 4px 12px rgba(0,0,0,.15);left:0;margin-top:.25rem;max-height:300px;overflow-y:auto;position:absolute;right:0;top:100%;z-index:100}.platform-select .platform-category{padding:.5rem 0}.platform-select .platform-category:not(:last-child){border-bottom:1px solid var(--pico-muted-border-color)}.platform-select .category-header{color:var(--pico-muted-color);font-size:.75rem;font-weight:600;letter-spacing:.05em;padding:.25rem .75rem;text-transform:uppercase}.platform-select .platform-option{align-items:center;cursor:pointer;display:flex;gap:.5rem;margin:0;padding:.375rem .75rem;transition:background-color .15s}.platform-select .platform-option:hover{background:var(--pico-secondary-hover-background)}.platform-select .platform-option.selected{background:var(--pico-primary-background)}.platform-select .platform-option input[type=checkbox]{height:1rem;margin:0;width:1rem}.platform-select .option-name{font-size:.875rem}.platform-select .custom-platform-input{border-bottom:1px solid var(--pico-muted-border-color);display:flex;gap:.5rem;padding:.5rem .75rem}.platform-select .custom-platform-input input{flex:1;font-size:.875rem;margin:0;padding:.25rem .5rem}.platform-select .custom-platform-input .add-custom-btn{font-size:1rem;margin:0;min-width:auto;padding:.25rem .75rem}.import-page{margin:0 auto;max-width:900px}.import-tabs ul{border-bottom:1px solid var(--pico-muted-border-color);display:flex;gap:0;list-style:none;margin:0 0 1rem;padding:0}.import-tabs li{margin:0}.import-tabs a{border-bottom:2px solid transparent;color:var(--pico-muted-color);display:block;margin-bottom:-1px;padding:.75rem 1.25rem;text-decoration:none}.import-tabs a:hover{background:var(--pico-card-background-color);color:var(--pico-color)}.import-tabs a.active{border-bottom-color:var(--pico-primary);color:var(--pico-primary);font-weight:700}.import-content{padding:1rem 0}.import-content header{margin-bottom:1.5rem}.import-content header h2{margin-bottom:.5rem}.import-content header p{color:var(--pico-muted-color);margin-bottom:0}.import-content fieldset{border:1px solid var(--pico-muted-border-color);border-radius:var(--pico-border-radius);margin:1rem 0;padding:1rem}.import-content fieldset legend{font-weight:700;padding:0 .5rem}.import-content fieldset label{cursor:pointer;display:block;margin-bottom:.5rem}.import-content fieldset input[type=checkbox]{margin-right:.5rem}.import-preview{border:1px solid var(--pico-muted-border-color);border-radius:var(--pico-border-radius);margin:1.5rem 0;max-height:400px;overflow-y:auto;padding:1rem}.import-preview h3{margin-bottom:.5rem}.import-preview table{font-size:.875rem;margin-bottom:0}.form-group{margin-bottom:1rem}.form-group label{display:block;font-weight:500;margin-bottom:.5rem}.error-message{background:var(--pico-del-color)}.error-message,.success-message{border-radius:var(--pico-border-radius);color:#fff;margin:1rem 0;padding:1rem}.success-message{background:var(--pico-ins-color)}.success-message p{margin:.5rem 0}.success-message details{margin-top:.75rem}.success-message summary{cursor:pointer;font-weight:500}.success-message ul{margin:.5rem 0 0 1rem;padding:0}.import-results{margin:1rem 0}.import-results-summary{background:color-mix(in srgb,var(--pico-ins-color) 15%,transparent);border:1px solid var(--pico-ins-color);border-radius:var(--pico-border-radius);color:var(--pico-color);padding:1rem}.import-results-summary.has-errors{background:color-mix(in srgb,var(--pico-primary-background) 15%,transparent);border:1px solid var(--pico-primary-background)}.import-results-summary p{margin:.5rem 0}.import-imported{margin-top:1rem}.import-imported summary{color:var(--color-completed);cursor:pointer;font-weight:500}.import-imported ul{margin:.5rem 0 0 1rem;padding:0}.import-updated{margin-top:1rem}.import-updated summary{color:var(--color-playing);cursor:pointer;font-weight:500}.import-updated ul{margin:.5rem 0 0 1rem;padding:0}.import-skipped{margin-top:1rem}.import-skipped summary{color:var(--pico-muted-color);cursor:pointer;font-weight:500}.import-skipped ul{margin:.5rem 0 0 1rem;padding:0}.import-errors{background:color-mix(in srgb,var(--pico-del-color) 15%,transparent);border:1px solid var(--pico-del-color);border-radius:var(--pico-border-radius);color:var(--pico-color);margin-top:.5rem;padding:1rem}.import-errors summary{color:var(--pico-del-color);cursor:pointer;font-weight:600}.import-errors ul{margin:.5rem 0 0 1rem;padding:0}.input-mode-toggle{display:flex;gap:.5rem;margin-bottom:1.5rem}.input-mode-toggle button{flex:0 0 auto;margin:0;padding:.5rem 1rem}.simple-form,.simple-form table{margin-bottom:1rem}.simple-form table input,.simple-form table select{font-size:.875rem;margin-bottom:0;padding:.5rem}.simple-form table th{font-size:.875rem;padding:.5rem}.simple-form table td{padding:.25rem;vertical-align:middle}.simple-form table td:last-child{text-align:center;width:50px}.simple-form table td:last-child button{font-size:1rem;line-height:1;margin:0;padding:.25rem .5rem}.simple-bulk{margin-bottom:1rem}.simple-bulk p{margin-bottom:.5rem}.simple-bulk code{background:var(--pico-card-background-color);border-radius:var(--pico-border-radius);display:inline-block;font-size:.875rem;padding:.25rem .5rem}.simple-bulk textarea{font-family:monospace;font-size:.875rem;margin-bottom:1rem}.export-section header{margin-bottom:2rem}.import-progress{background:var(--pico-card-background-color);border:1px solid var(--pico-muted-border-color);border-radius:var(--pico-border-radius);margin:1.5rem 0;padding:1.5rem}.import-progress h3{font-size:1rem;margin:0 0 1rem}.import-progress .progress-info{margin-bottom:1rem}.import-progress .progress-info p{font-size:.9rem;margin:.25rem 0}.import-progress .progress-stats{font-size:.875rem;margin-top:.75rem}.import-progress .stat-imported{color:var(--color-completed)}.import-progress .stat-updated{color:var(--color-playing)}.import-progress .stat-skipped{color:var(--pico-muted-color)}.import-progress progress{height:1.5rem;margin:0;width:100%}@media (max-width:768px){header nav{flex-direction:column;gap:.5rem}header nav ul{flex-wrap:wrap;justify-content:center}.page-header{gap:1rem;text-align:center}.filter-row,.page-header{flex-direction:column}.filter-row input,.filter-row select{width:100%}.collection-grid,.games-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.stats-grid{grid-template-columns:repeat(2,1fr)}.browse-page .section-title{align-items:flex-start;flex-direction:column}.browse-page .section-title .igdb-attribution{margin-left:0}.platform-select .platform-dropdown,.storefront-select .storefront-dropdown{max-height:250px}.import-tabs ul{flex-wrap:wrap}.import-tabs a{font-size:.875rem;padding:.5rem .75rem}.input-mode-toggle{flex-direction:column}.input-mode-toggle button{width:100%}.simple-form table{font-size:.8rem}.simple-form table input,.simple-form table select{font-size:.8rem;padding:.375rem}}.external-game-links{display:flex;gap:.5rem;margin:.5rem 0 1rem}.external-game-links .external-link{align-items:center;background:var(--pico-secondary-background);border-radius:4px;display:inline-flex;height:28px;justify-content:center;transition:background-color .15s,transform .15s;width:28px}.external-game-links .external-link:hover{background:var(--pico-primary-background);transform:scale(1.1)}.external-game-links .external-link img{display:block}.hidden{display:none!important}.view-mode-selector{align-items:center;display:flex;gap:.5rem;margin-bottom:1rem}.view-mode-label{color:var(--pico-muted-color);font-size:.875rem}.view-mode-buttons{display:flex}.view-mode-buttons button{border-radius:0;font-size:.875rem;margin:0;padding:.4rem .75rem}.view-mode-buttons button:first-child{border-radius:var(--pico-border-radius) 0 0 var(--pico-border-radius)}.view-mode-buttons button:not(:first-child):not(:last-child){border-left:none}.view-mode-buttons button:last-child{border-left:none;border-radius:0 var(--pico-border-radius) var(--pico-border-radius) 0}.view-mode-buttons button.selected{background:var(--pico-primary);border-color:var(--pico-primary);color:var(--pico-primary-inverse)}.virtual-scroll-container{contain:layout style;position:relative;width:100%}.virtual-scroll-content{contain:layout style paint;width:100%}.virtual-scroll-container .collection-grid{contain:layout style}.position-indicator{bottom:7rem;box-shadow:0 2px 8px rgba(0,0,0,.15);color:var(--pico-muted-color);font-size:.875rem;min-width:180px;padding:.5rem 1rem;transform:translateX(-50%);z-index:100}.position-indicator,.virtual-scroll-loading{background:var(--pico-card-background-color);border-radius:var(--pico-border-radius);left:50%;position:fixed;text-align:center}.virtual-scroll-loading{box-shadow:0 4px 20px rgba(0,0,0,.2);padding:2rem;top:50%;transform:translate(-50%,-50%);z-index:50}.virtual-scroll-loading p{color:var(--pico-muted-color);margin:1rem 0 0}.loading-dot{animation:blink 1s infinite}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.beanstalk-container{background:#000;inset:0;overflow:hidden;overscroll-behavior:contain;position:fixed;z-index:1000}.beanstalk-canvas{cursor:grab;height:100%;outline:none;touch-action:none;width:100%}.beanstalk-canvas:active{cursor:grabbing}.beanstalk-hud{inset:0;pointer-events:none;position:absolute}.beanstalk-exit-btn{background:rgba(0,0,0,.7);border:none;border-radius:var(--pico-border-radius);color:#fff;cursor:pointer;font-size:.875rem;padding:.75rem 1.5rem;pointer-events:auto;position:absolute;right:1rem;top:1rem;transition:background-color .2s}.beanstalk-exit-btn:hover{background:rgba(0,0,0,.9)}.beanstalk-hud .position-indicator{background:rgba(0,0,0,.7);bottom:2rem;color:#fff;pointer-events:auto}.beanstalk-instructions{animation:beanstalk-instructions-fade 12s ease-out forwards;background:rgba(0,0,0,.7);border-radius:var(--pico-border-radius);bottom:5rem;color:#fff;left:50%;opacity:1;padding:.75rem 1.5rem;position:absolute;text-align:center;transform:translateX(-50%)}.beanstalk-instructions p{color:#fff;font-size:.875rem;margin:.25rem 0}@keyframes beanstalk-instructions-fade{0%,83%{opacity:1}to{opacity:0;pointer-events:none}}.beanstalk-scrollbar{bottom:5rem;pointer-events:auto;position:absolute;right:1rem;top:5rem;width:20px}.beanstalk-scrollbar-track{background:hsla(0,0%,100%,.1);border-radius:10px;cursor:pointer;inset:0;position:absolute;touch-action:none}.beanstalk-scrollbar-track:hover{background:hsla(0,0%,100%,.15)}.beanstalk-scrollbar.dragging .beanstalk-scrollbar-track{background:hsla(0,0%,100%,.2)}.beanstalk-scrollbar-thumb{background:hsla(0,0%,100%,.5);border-radius:8px;cursor:grab;left:2px;position:absolute;right:2px;transition:background-color .15s}.beanstalk-scrollbar-thumb:hover{background:hsla(0,0%,100%,.7)}.beanstalk-scrollbar.dragging .beanstalk-scrollbar-thumb{background:hsla(0,0%,100%,.8);cursor:grabbing}.beanstalk-attribution{background:rgba(0,0,0,.3);border-radius:4px;bottom:.5rem;color:hsla(0,0%,100%,.5);font-size:.7rem;left:.5rem;padding:.25rem .5rem;pointer-events:auto;position:absolute;text-decoration:none;transition:color .2s,background .2s}.beanstalk-attribution:hover{background:rgba(0,0,0,.5);color:hsla(0,0%,100%,.9)}@media (max-width:768px){.view-mode-selector{flex-wrap:wrap}.position-indicator{bottom:4rem;font-size:.8rem;min-width:160px;padding:.375rem .75rem}.beanstalk-exit-btn{font-size:.8rem;padding:.5rem 1rem;right:.5rem;top:.5rem}.beanstalk-instructions{bottom:4rem;padding:.5rem 1rem}.beanstalk-instructions p{font-size:.75rem}.beanstalk-scrollbar{bottom:4rem;right:.5rem;top:4rem;width:32px}.beanstalk-scrollbar-track{border-radius:16px}.beanstalk-scrollbar-thumb{border-radius:14px}}.toast-message{animation:toast-in .3s ease;background:var(--pico-primary);border-radius:8px;color:#fff;left:50%;padding:12px 24px;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:10000}.toast-message.fade-out{opacity:0;transition:opacity .3s}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.bookshelf-container{position:relative;width:100%}.bookshelf-row{background-position:bottom;background-repeat:repeat-x;background-size:auto 100%;box-sizing:border-box;position:relative}.bookshelf-row-items{align-items:flex-end;display:flex;gap:12px;height:calc(100% - 50px);justify-content:center;padding:16px 16px 0}.bookshelf-container.theme-brown .bookshelf-row{background-image:url(textures/bookshelf/shelf-brown.webp)}.bookshelf-container.theme-gray .bookshelf-row{background-image:url(textures/bookshelf/shelf-gray.webp)}.bookshelf-item{cursor:pointer;flex-shrink:0;height:149px;position:relative;transition:transform .15s ease;width:108px}.bookshelf-item img{border-radius:2px;box-shadow:2px 2px 8px rgba(0,0,0,.4);height:100%;object-fit:cover;width:100%}.bookshelf-item:after{background:linear-gradient(135deg,hsla(0,0%,100%,.15),transparent 50%);border-radius:2px;content:"";inset:0;pointer-events:none;position:absolute}.bookshelf-item:hover{transform:translateY(-4px) scale(1.02)}.bookshelf-item:hover img{box-shadow:4px 4px 12px rgba(0,0,0,.5)}.bookshelf-theme-selector{align-items:center;display:flex;gap:.5rem;margin-bottom:1rem}.bookshelf-theme-selector .theme-label{color:var(--pico-muted-color);font-size:.875rem}.bookshelf-theme-selector .theme-btn{border:2px solid transparent;border-radius:50%;cursor:pointer;height:28px;padding:0;transition:transform .15s,border-color .15s;width:28px}.bookshelf-theme-selector .theme-btn:hover{transform:scale(1.1)}.bookshelf-theme-selector .theme-btn.selected{border-color:var(--pico-primary)}.bookshelf-theme-selector .theme-brown{background:linear-gradient(135deg,#8b4513,#654321)}.bookshelf-theme-selector .theme-gray{background:linear-gradient(135deg,grey,#5a5a5a)}.bookshelf-theme-selector .darkadia-credit{color:var(--pico-muted-color);font-size:.8rem;font-style:italic;margin-left:1rem}.create-custom-section{margin:1.5rem 0}.create-custom-card{align-items:center;background:var(--pico-card-background-color);border:2px dashed var(--pico-muted-border-color);cursor:pointer;display:flex;flex-direction:column;justify-content:center;min-height:200px;transition:border-color .2s,background-color .2s}.create-custom-card:hover{background:var(--pico-secondary-background);border-color:var(--pico-primary)}.create-custom-icon{color:var(--pico-primary);font-size:3rem;line-height:1;margin-bottom:.5rem}.create-custom-text{padding:1rem;text-align:center}.create-custom-text h4{font-size:1rem;margin:0 0 .25rem}.create-custom-text p{color:var(--pico-muted-color);font-size:.875rem;margin:0}.custom-game-badge{background:var(--pico-primary);border-radius:4px;color:var(--pico-primary-inverse);font-size:.7rem;font-weight:600;left:.5rem;padding:.125rem .5rem;position:absolute;text-transform:uppercase;top:.5rem}.cover-upload{display:flex;flex-direction:column;gap:.5rem}.cover-preview{max-width:132px}.cover-preview img{border-radius:var(--pico-border-radius);box-shadow:0 2px 8px rgba(0,0,0,.15);height:auto;width:100%}.char-count{color:var(--pico-muted-color);display:block;font-size:.75rem;margin-top:.25rem}.char-count.warning{color:var(--pico-del-color)}.custom-badge{background:var(--pico-primary);color:var(--pico-primary-inverse);display:inline-block;margin-bottom:1rem}.checkbox-row{display:flex;flex-wrap:wrap;gap:1.5rem}.checkbox-row label{align-items:center;cursor:pointer;display:flex;gap:.5rem}.checkbox-row input[type=checkbox]{margin:0}dialog article footer .footer-spacer{flex:1}.bookshelf-loading{background:var(--pico-card-background-color);border-radius:var(--pico-border-radius);box-shadow:0 4px 20px rgba(0,0,0,.2);left:50%;padding:2rem;position:fixed;text-align:center;top:50%;transform:translate(-50%,-50%);z-index:50}.bookshelf-loading p{color:var(--pico-muted-color);margin:1rem 0 0}.storefront-import{max-width:700px}.steam-form{margin-top:1.5rem}.steam-form small{color:var(--pico-muted-color);display:block;font-size:.85rem;margin-top:.25rem}.privacy-notice{background:color-mix(in srgb,var(--pico-primary) 10%,transparent);border:1px solid var(--pico-primary);border-radius:var(--pico-border-radius);font-size:.9rem;margin-bottom:1rem;padding:.75rem 1rem}.privacy-notice a{color:var(--pico-primary)}@media (max-width:900px){.bookshelf-item{height:124px;width:90px}.bookshelf-row-items{gap:10px}}@media (max-width:600px){.bookshelf-item{height:103px;width:75px}.bookshelf-row-items{gap:8px;padding:12px 12px 0}}