/* Native settings share the portal's theme and spacing. */
:is(#hyruleServerAdmin,#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup,#hyruleHistorySync,#hyruleTaskDiagnostics) [hidden]{display:none!important}
:is(#hyruleServerAdmin,#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup){padding:1.25rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);margin-bottom:1.25rem;min-width:0}
:is(#hyruleServerAdmin,#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup)>p{color:var(--color-text-secondary);font-size:.875rem;line-height:1.6;margin:.75rem 0;overflow-wrap:anywhere}
:is(#hyruleServerAdmin,#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup) .btn{margin:.25rem .25rem .25rem 0;max-width:100%;white-space:normal}
#hyruleServerAdmin [data-server-list]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1rem}
.hyrule-server-card{padding:1rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg-elevated);min-width:0}
.hyrule-server-card h4{font-size:1rem;color:var(--color-text);margin:0 0 .6rem}
.hyrule-server-card p{font-size:.8125rem;line-height:1.6;color:var(--color-text-muted);overflow-wrap:anywhere;margin:.65rem 0}
.hyrule-server-badge{display:inline-block;padding:.25rem .6rem;background:var(--color-primary-surface);border-radius:999px;color:var(--color-primary-hover);font-size:.75rem}
.hyrule-actions{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}
.hyrule-server-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--color-border)}
.hyrule-server-form>h4,.hyrule-server-form>.hyrule-actions,.hyrule-server-form>[role=status]{grid-column:1/-1;margin:0}
.hyrule-server-form label{font-size:.8125rem;color:var(--color-text-secondary);line-height:1.5;min-width:0}
.hyrule-server-form [hidden]{display:none!important}
.hyrule-server-form select{color-scheme:dark}
.hyrule-toggle{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface)}
.hyrule-checkbox{width:1.15rem;height:1.15rem;accent-color:var(--color-primary);flex-shrink:0}
:is(#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup) progress{display:block;appearance:none;height:.5rem;border:0;border-radius:999px;overflow:hidden;background:var(--color-surface-hover);margin:1rem 0;accent-color:var(--color-primary)}
:is(#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup) progress::-webkit-progress-bar{background:var(--color-surface-hover)}
:is(#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup) progress::-webkit-progress-value{background:var(--color-primary);border-radius:999px}
:is(#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup) progress::-moz-progress-bar{background:var(--color-primary);border-radius:999px}
@media(max-width:640px){#hyruleServerAdmin [data-server-list],.hyrule-server-form{grid-template-columns:minmax(0,1fr)}:is(#hyruleServerAdmin,#hyruleLibrarySync,#hyruleCollectionsPreview,#hyruleDownloadCleanup){padding:1rem}.hyrule-actions>.btn{flex:1 1 auto}.hyrule-server-form .admin-panel-input{font-size:16px}}

#hyruleDownloadCleanup progress{width:100%}.hyrule-sync-summary{display:flex;flex-wrap:wrap;gap:.5rem}.hyrule-sync-summary span{padding:.4rem .7rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);font-size:.8125rem}#hyruleLibrarySync [data-sync-message],#hyruleCollectionsPreview [data-sync-message]{padding:.75rem;border-radius:var(--radius-sm);background:var(--color-bg-elevated);border:1px solid var(--color-border)}
#hyruleMaintenance{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;gap:1rem;background:transparent;color:var(--color-text)}#hyruleMaintenance p{max-width:32rem;color:var(--color-text-secondary)}#hyruleMaintenance a{padding:.8rem 1.2rem;border-radius:var(--radius-sm);background:var(--color-primary);color:white;text-decoration:none}
#hyruleTaskDiagnostics .admin-health-component { align-items: flex-start; }
#hyruleTaskDiagnostics .admin-health-component-indicator { margin-top: .3rem; }
#hyruleTaskDiagnostics .admin-health-component small { white-space: normal; overflow-wrap: anywhere; }
#hyruleTaskDiagnostics .admin-health-status { max-width: 5.5rem; text-align: right; }
.hyrule-debug-label { margin: .5rem 0 0; color: var(--color-text-secondary); font-size: .75rem; font-weight: 600; }
.hyrule-task-controls{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:.85rem 1rem;background:var(--color-surface)}.hyrule-task-controls>summary{cursor:pointer;color:var(--color-text);font-size:.84rem;font-weight:600}.hyrule-task-controls>.admin-panel-description{margin-top:.75rem}.hyrule-task-controls .admin-panel-option{gap:1rem}.hyrule-task-controls .toggle-switch{flex-shrink:0}
.hyrule-debug-live { align-self: flex-start; padding: .4rem .65rem; border: 1px solid var(--color-border); border-radius: var(--radius-sm); color: var(--color-text-secondary); font-size: .7rem; white-space: nowrap; }
#hyruleTaskDiagnostics .hyrule-debug-idle .admin-health-component-indicator { background: var(--color-text-muted); box-shadow: none; }
#hyruleTaskDiagnostics .hyrule-debug-idle .admin-health-status { color: var(--color-text-secondary); }
:is(#hyruleTaskDiagnostics,#hyruleHistorySync) progress { display: block; appearance: none; width: 100%; height: .35rem; border: 0; border-radius: 999px; overflow: hidden; background: var(--color-surface-hover); accent-color: var(--color-primary); margin: .65rem 0; }
:is(#hyruleTaskDiagnostics,#hyruleHistorySync) progress::-webkit-progress-bar { background: var(--color-surface-hover); }
:is(#hyruleTaskDiagnostics,#hyruleHistorySync) progress::-webkit-progress-value { background: var(--color-primary); border-radius: 999px; }
:is(#hyruleTaskDiagnostics,#hyruleHistorySync) progress::-moz-progress-bar { background: var(--color-primary); }
.hyrule-history-state { margin: 1rem 0; padding: .9rem 1rem; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); box-shadow: var(--glass-highlight), var(--requests-shadow-inset-well); }
.hyrule-history-state [role=status] { margin: 0; color: var(--color-text); font-size: .84rem; }
.hyrule-history-state .admin-panel-description { margin-bottom: 0; }

@media (min-width: 768px){#hyruleMaintenance p{max-width:none;white-space:nowrap}}
.hyrule-batch-options { margin-top: .75rem; }
.hyrule-batch-options summary { cursor: pointer; font-weight: 600; }
.hyrule-batch-options p { margin: .6rem 0; font-size: .85rem; }
.hyrule-batch-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,220px),1fr)); gap: 1rem; margin: 1rem 0; }
.hyrule-batch-grid label { display: block; margin-bottom: .4rem; font-weight: 600; }
.hyrule-batch-grid input { width: 100%; min-height: 42px; box-sizing: border-box; padding: .6rem .75rem; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text); font: inherit; }
.hyrule-batch-grid input:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.hyrule-batch-grid small { display: block; margin-top: .4rem; line-height: 1.5; font-size: .8rem; color: var(--color-text-muted); }

/* Detailed collection synchronization progress. */
.hyrule-collection-details{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:.4rem 1rem;margin:1rem 0;font-size:.875rem}.hyrule-collection-details dt{color:var(--color-text-secondary)}.hyrule-collection-details dd{margin:0;overflow-wrap:anywhere}.hyrule-collection-table{overflow-x:auto;margin:.75rem 0}.hyrule-collection-table table{width:100%;border-collapse:collapse;font-size:.8125rem}.hyrule-collection-table th,.hyrule-collection-table td{text-align:left;padding:.5rem;border-bottom:1px solid var(--color-border);white-space:nowrap}.hyrule-collection-activity{padding-left:1.25rem;font-size:.8125rem;color:var(--color-text-secondary)}#hyruleCollectionsPreview details,#hyruleLibrarySync details{margin:.75rem 0}#hyruleCollectionsPreview summary,#hyruleLibrarySync summary{cursor:pointer}#hyruleCollectionsPreview [data-collections-warning]:empty{display:none}

/* History uses the same bounded activity presentation as the other sync tasks. */
.hyrule-history-activity{margin-top:1rem}.hyrule-history-activity summary{cursor:pointer}.hyrule-history-activity ul{padding-left:1.25rem}

.hyrule-favorites-activity{margin-top:1rem}.hyrule-favorites-activity summary{cursor:pointer}.hyrule-favorites-activity ul{padding-left:1.25rem}

.hyrule-playlists-activity{margin-top:1rem}.hyrule-playlists-activity summary{cursor:pointer}.hyrule-playlists-activity ul{padding-left:1.25rem}


/* Detail skeleton reuses the populated sheet's responsive structure. */
#detailModal .detail-skeleton .detail-skeleton-bar{display:inline-block;flex-shrink:0;max-width:100%;margin:0;vertical-align:middle;border-radius:5px}
#detailModal .detail-skeleton .detail-skeleton-chip{border-radius:999px}
#detailModal .detail-skeleton .detail-skeleton-icon{border-radius:6px}
#detailModal .detail-skeleton .detail-skeleton-star{border-radius:50%;margin:0 3px}
#detailModal .detail-skeleton .detail-skeleton-availability{background:rgba(255,255,255,.045);border:0;border-bottom:1px solid var(--color-border);border-radius:0;display:flex;align-items:center;justify-content:center;min-height:32px;width:100%}
#detailModal .detail-skeleton .detail-poster{position:relative}
#detailModal .detail-skeleton .detail-skeleton-watch{pointer-events:none;display:flex;justify-content:center;align-items:center;gap:.4rem;background:rgba(255,255,255,.045);color:transparent}
#detailModal .detail-skeleton .detail-skeleton-action{width:100%;max-width:100%;pointer-events:none;color:transparent;border-color:var(--color-border);background:rgba(255,255,255,.035);box-shadow:none}
#detailModal .detail-skeleton-rating-global{display:flex;align-items:center;justify-content:center;gap:.38rem;min-height:26px;padding:.28rem .58rem;border:1px solid var(--color-border);border-radius:999px}
#detailModal .detail-skeleton .detail-collection-copy{flex:1}
#detailModal .detail-skeleton .detail-collection-image .skeleton-text{border-radius:0}
#detailModal .detail-skeleton .skeleton-overview-text{display:flex;flex-direction:column;gap:.6rem}
#detailModal .detail-skeleton .detail-skeleton-request{display:inline-flex;align-items:center;gap:.6rem;min-height:42px;border:1px solid var(--color-border);background:rgba(255,255,255,.035);pointer-events:none}
#detailModal .detail-skeleton .season-accordion-trigger{pointer-events:none}
#detailModal .detail-skeleton .season-accordion-title{gap:.5rem;flex-wrap:wrap}
#detailModal .detail-skeleton .seasons-summary{display:flex;gap:.6rem;flex-wrap:wrap}
#detailModal .detail-skeleton .detail-related-header h3,#detailModal .detail-skeleton .seasons-header h3{display:flex;align-items:center;gap:.5rem}
#detailModal .detail-skeleton .detail-related-card>.poster-wrapper{aspect-ratio:2/3;border-radius:var(--radius-md);overflow:hidden}
#detailModal .detail-skeleton-related-copy{display:flex;flex-direction:column;gap:.5rem;padding:.6rem .2rem}
#detailModal.loading .detail-top-actions #linkBtn,#detailModal.loading[data-skeleton-availability="complete"] .detail-top-actions #issueBtn,#detailModal.loading[data-skeleton-availability="partial"] .detail-top-actions #issueBtn,#detailModal.loading[data-skeleton-availability="unavailable"] .detail-top-actions #alertBtn{display:inline-flex!important;pointer-events:none;background:rgba(255,255,255,.08)}
#detailModal.loading .detail-top-actions svg{visibility:hidden}
#detailModal.loading .detail-top-actions .modal-close svg{visibility:visible}
#detailModal .detail-skeleton .detail-rating{background:rgba(255,255,255,.045);border-color:var(--color-border);box-shadow:none}
#detailModal .detail-skeleton .detail-header-top .detail-skeleton-bar{flex-shrink:1}
#detailModal #detailContentHost.detail-body-enter{opacity:.35;transform:translateY(3px)}
#detailModal #detailContentHost.detail-body-enter.detail-body-enter-active{opacity:1;transform:none;transition:opacity .24s ease,transform .24s ease}
@media(prefers-reduced-motion:reduce){#detailModal #detailContentHost.detail-body-enter{opacity:1;transform:none}#detailModal .detail-skeleton .skeleton-text,#detailModal .detail-skeleton .skeleton-poster{animation:none!important}}

#hyruleDuplicateScan .duplicate-actions{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem;margin:1rem 0}#hyruleDuplicateScan progress{width:100%;height:.6rem;accent-color:#a855f7}#hyruleDuplicateScan .duplicate-disk{display:inline-block;margin:.25rem;padding:.35rem .65rem;background:rgba(255,255,255,.06);border-radius:.5rem}#hyruleDuplicateScan .duplicate-group{margin:1rem 0;padding:1rem;border:1px solid rgba(255,255,255,.12);border-radius:12px}#hyruleDuplicateScan .duplicate-copy{padding:.75rem 0;border-top:1px solid rgba(255,255,255,.07)}#hyruleDuplicateScan code{display:block;overflow-wrap:anywhere;font-size:.85rem;color:var(--text-secondary,#aaa)}#hyruleDuplicateScan .duplicate-disk{display:inline-block}#hyruleDuplicateScan p{line-height:1.6}#hyruleDuplicateScan button:disabled{opacity:.5;cursor:default}

/* Wider desktop control panel; retain compact mobile rules. */
@media(min-width:900px){#adminPanelModal .modal-content.admin-panel-modal{width:calc(100vw - 3rem);max-width:1600px}}

/* Keep the detail background stable while the decoded artwork is loading. */
#detailModal .detail-backdrop.detail-backdrop-loading{filter:none;transition:none}

/* Lightweight loading surfaces: one soft animation per card, stable poster geometry. */
.skeleton-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(255,255,255,.025);box-shadow:none}
.skeleton-card .skeleton-poster{aspect-ratio:2/3;background:linear-gradient(145deg,rgba(168,85,247,.08),rgba(255,255,255,.025));animation:none}
.skeleton-card .skeleton-poster:before{display:none}
.skeleton-card .skeleton-title,.skeleton-card .skeleton-meta,#detailModal .detail-skeleton .skeleton-text{animation:none;background:rgba(255,255,255,.065)}
.skeleton-card:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 25%,rgba(168,85,247,.055),transparent 75%);animation:hyrule-skeleton-breathe 2.6s ease-in-out infinite}
@keyframes hyrule-skeleton-breathe{0%,100%{opacity:.25}50%{opacity:.85}}
#detailModal .detail-skeleton .detail-title{min-height:1.25em;display:block;width:100%;pointer-events:none}
#detailModal .detail-skeleton .skeleton-overview-text{margin:0;min-height:5.5rem}
#detailModal .detail-skeleton .detail-credit-links .detail-skeleton-bar{min-height:30px;border-radius:999px}
#detailModal .detail-skeleton .detail-skeleton-action{min-height:36px;display:flex;align-items:center;justify-content:center}
#detailModal .detail-skeleton .season-accordion-trigger{min-height:58px}
@media(prefers-reduced-motion:reduce){.skeleton-card:after{animation:none;opacity:.4}}
.admin-panel-skeleton{padding:.25rem 0}.admin-panel-skeleton-tabs{display:flex;gap:.6rem;margin:.25rem 0 1.25rem;overflow:hidden}.admin-panel-skeleton-tabs .skeleton-text{flex:0 0 90px;height:34px;border-radius:999px}.admin-panel-skeleton .skeleton-text{animation:none;background:rgba(255,255,255,.06)}.admin-panel-skeleton .skeleton-panel-heading{height:18px;width:40%;margin-bottom:1rem}.admin-panel-skeleton-row{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding:.8rem 0;border-top:1px solid var(--color-border)}.admin-panel-skeleton-row>div{display:flex;flex:1;flex-direction:column;gap:.5rem}.skeleton-panel-title{height:14px;width:65%}.skeleton-panel-copy{height:11px;width:85%}.skeleton-panel-toggle{height:23px;width:43px;border-radius:999px;flex-shrink:0}
.modal .modal-body,#detailModal .modal-content{overscroll-behavior-y:contain;scrollbar-gutter:stable;scroll-padding-block:1rem}

/* El catálogo conserva la primera fila; los títulos por solicitar se comparan en paralelo. */
@media(min-width:768px){
    .app #resultsGrid.search-results-grouped{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:1.35rem 1.5rem}
    .app .search-results-group[data-search-result-group="library"]{grid-column:1/-1}
    .app .search-results-group[data-search-result-group="movie"]{grid-column:1}
    .app .search-results-group[data-search-result-group="tv"]{grid-column:2}
    .app #resultsGrid:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group:not([data-search-result-group="library"]) .search-results-group-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    .app #resultsGrid.search-results-grouped:not(:has([data-search-result-group="tv"])) [data-search-result-group="movie"],
    .app #resultsGrid.search-results-grouped:not(:has([data-search-result-group="movie"])) [data-search-result-group="tv"]{grid-column:1/-1}
}
@media(min-width:768px) and (max-width:900px){
    .app #resultsGrid.search-results-grouped{column-gap:1rem}
    .app #resultsGrid:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group:not([data-search-result-group="library"]) .search-results-group-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Separador entre Películas y Series: más aire y un filete más claro entre los dos grupos. */
.app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]){--search-split:2.75rem;gap:var(--search-split)}
.app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group[data-search-result-group="tv"]{position:relative}
.app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group[data-search-result-group="tv"]::before,
.app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group[data-search-result-group="tv"]::after{content:"";position:absolute;z-index:1;pointer-events:none}
.app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group[data-search-result-group="tv"]::before{left:.2rem;right:.2rem;top:calc(var(--search-split) / -2);height:1px;background:rgba(255,255,255,.22);box-shadow:0 1px rgba(0,0,0,.4)}
.app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group[data-search-result-group="tv"]::after{left:50%;top:calc(var(--search-split) / -2 - 2px);width:2.75rem;height:4px;border-radius:2px;transform:translateX(-50%);background:linear-gradient(90deg,var(--color-primary),var(--color-primary-glow));box-shadow:0 0 10px var(--color-primary-glow)}
@media(min-width:768px){
    .app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]){--search-split:3.5rem;column-gap:var(--search-split);row-gap:1.35rem;align-items:stretch}
    .app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group[data-search-result-group="tv"]::before{left:calc(var(--search-split) / -2);right:auto;top:0;bottom:0;width:1px;height:auto}
    .app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group[data-search-result-group="tv"]::after{left:calc(var(--search-split) / -2 - 2px);top:50%;width:4px;height:2.75rem;transform:translateY(-50%);background:linear-gradient(180deg,var(--color-primary),var(--color-primary-glow))}
}
@media(min-width:768px) and (max-width:900px){
    .app #resultsGrid.search-results-grouped:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]){--search-split:2.5rem}
}

/* El input queda por encima del resplandor y del panel, que a veces se pintan encima y se comen el clic. */
.search-input-wrapper{cursor:text}
.search-input-wrapper>#searchInput{position:relative;z-index:32;caret-color:var(--color-text);-webkit-user-select:text;user-select:text}
.search-input-wrapper>.search-icon{z-index:34;pointer-events:none}
.search-input-wrapper>.clear-search-btn{z-index:34;cursor:pointer}
.search-input-wrapper:focus-within>#searchInput{border-color:#c084fc80}

/* Altura estable, igual que los demás modales principales. */
#adminPanelModal .modal-content.admin-panel-modal{height:auto;min-height:calc(100vh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));min-height:calc(100dvh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));max-height:calc(100vh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
#adminPanelModal .modal-body{min-height:0;flex:1;overflow-y:auto}

#detailModal .media-type-badge.detail-disk-badge{max-width:100%;white-space:normal;overflow-wrap:anywhere;text-transform:none;background:linear-gradient(145deg,#3b82f6,#1d4ed8);color:#fff;border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px rgba(255,255,255,.15);-webkit-backdrop-filter:none;backdrop-filter:none}
/* Sin contornos de foco; conservar la geometría y los bordes propios del diseño. */
@layer hyrule-no-outlines{
    *,*::before,*::after{outline:none!important;outline-offset:0!important}
    :is(:focus,:focus-visible),:focus-within:is(.search-input-wrapper,.history-search-wrapper,.settings-input-group,.settings-player-select-control){box-shadow:none!important}
}
html body :is(button,a[href],[role="button"]):focus-visible{filter:brightness(1.12)}
#detailModal .detail-badges{flex-wrap:wrap}

@media(min-width:1025px){
    .app #resultsGrid:has([data-search-result-group="movie"]):has([data-search-result-group="tv"]) .search-results-group:not([data-search-result-group="library"]) .search-results-group-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}