/* A browsable casebook: full artwork, readable invitations, light filters. */
.experiment-browser .directory-heading{margin-bottom:24px}
.experiment-browser .directory-heading h1{font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.4;margin:12px 0 0}
.experiment-browser .experiment-difficulty-nav{display:flex;flex-wrap:wrap;gap:10px;border:0;border-bottom:1px solid var(--directory-line);background:transparent;margin-bottom:16px;padding-bottom:14px}
.experiment-browser .experiment-difficulty-nav button{display:flex;align-items:center;justify-content:center;gap:10px;min-width:90px;min-height:44px;padding:9px 16px;border:1px solid transparent;border-radius:3px;background:transparent;color:#b7ab90;font-size:1rem;white-space:nowrap}
.experiment-browser .experiment-difficulty-nav button[aria-pressed=true]{background:#bba47312;border-color:#ccb37b70;color:#ebd7a8}
.experiment-browser .experiment-level{letter-spacing:.05em}
.experiment-level-compact{display:none}
.experiment-browser .experiment-level-count{font:400 .875rem/1.5 var(--font-sans,sans-serif);color:#9da99e;font-variant-numeric:tabular-nums}
.experiment-browser .experiment-difficulty-nav button[aria-pressed=true] .experiment-level-count{color:#d3c8ae}
.experiment-browser .catalog-toolbar{border-top:0;gap:18px;padding:0 0 12px}
.experiment-browser .experiment-progress-filters{display:flex;gap:8px;flex-wrap:wrap}
.experiment-browser .experiment-progress-filters button{font-size:.875rem;min-height:44px;padding:8px 10px;border:0;border-bottom:1px solid transparent;border-radius:0;background:transparent;color:#aeb7af}
.experiment-browser .experiment-progress-filters button[aria-pressed=true]{background:transparent;border-bottom-color:#c7ae7a;color:#e1c994}
.experiment-browser .catalog-search{flex:0 1 280px}
.experiment-browser .catalog-search input{background:#14221f;color:#d8d4c5}
.experiment-browser .catalog-result-line{min-height:66px;gap:12px;padding:9px 0 17px;flex-wrap:wrap}
.experiment-result-count{display:flex;align-items:center;gap:15px;flex-wrap:wrap}
.experiment-sort{display:flex;align-items:center;gap:10px;color:#9faa9f;font-size:.875rem;min-width:0}
.experiment-sort select{min-width:130px;max-width:100%;min-height:44px;margin:0;padding:8px 30px 8px 12px;border:1px solid var(--directory-line);border-radius:2px;background:#1a2823;color:#d8d0ba;color-scheme:dark;font:inherit}
.experiment-browser .experiment-directory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.experiment-browser .murdle-feature{border-radius:2px;background:#1d2a25;box-shadow:0 7px 22px #0002}
.experiment-browser .murdle-feature-cover{grid-template-rows:auto auto 1fr auto}
.experiment-browser .murdle-feature-top{gap:10px;padding:12px 16px;min-height:50px;background:#17241f}
.experiment-browser .murdle-feature-edition{gap:12px;font-size:.875rem}
.experiment-browser .murdle-feature-edition>span{border-right:0}
.experiment-browser .murdle-feature-edition>span:first-child{font:400 1rem/1.5 Georgia,serif;padding-right:0;color:#c8b88e}
.experiment-browser .murdle-feature-edition>.experiment-difficulty{font-size:.875rem;padding:0;gap:0}
.experiment-browser .murdle-feature-edition .experiment-difficulty>span:first-child{display:none}
.experiment-browser .experiment-stars{font-size:.875rem;letter-spacing:.025em}
.experiment-browser .catalog-status{font-size:.8125rem;padding:3px 6px;white-space:nowrap}
.experiment-browser .story-cover-frame{grid-row:2;aspect-ratio:3/2;background:#15241f}
.experiment-browser .story-cover-frame>.murdle-feature-scene{object-fit:contain;aspect-ratio:3/2;filter:brightness(.94) saturate(.85)}
.experiment-browser .murdle-feature-story{padding:18px 18px 16px}
.experiment-browser .experiment-title-line{margin:0 0 10px}
.experiment-browser .murdle-feature-story h2{font-size:1.3rem;line-height:1.45;letter-spacing:.055em;margin:0}
.experiment-browser .murdle-feature-story>p{font-size:1rem;line-height:1.65;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:3.3em;margin:0;color:#adb9af}
.experiment-browser .murdle-feature-action{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:48px;margin:0 18px;padding:11px 0;font-size:.875rem;border-top:1px solid var(--directory-line)}
.experiment-browser .murdle-feature-action>span:last-child{margin-left:auto;font-size:1.05rem}
.experiment-browser .experiment-cover-stamp{font-size:.75rem;padding:1px 5px;outline-offset:2px;letter-spacing:.04em}
#directory-experiments-results{scroll-margin-top:110px}
#directory-experiments-results:focus{outline:none}
#directory-experiments-results:focus-visible{outline:1px solid #bfa97766;outline-offset:5px}
.experiment-pagination{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;margin-inline:auto;padding:28px 0 6px}
.experiment-page-controls{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;width:min(100%,440px)}
.experiment-page-numbers,.experiment-page-window{display:flex;align-items:center;gap:5px;justify-content:center;min-width:0}
.experiment-page-numbers{max-width:100%}
.experiment-page-window-compact{display:none}
.experiment-pagination button{min-width:44px;min-height:44px;padding:9px 13px;background:#1b2a23;border:1px solid var(--directory-line);color:#c7bea6;font:inherit;font-size:.875rem;border-radius:2px}
.experiment-browser .experiment-page-controls>button{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;min-width:0}
.experiment-page-numbers button{width:44px;flex-shrink:0;padding-inline:4px;font-variant-numeric:tabular-nums}
.experiment-page-numbers .experiment-page-edge{font-size:1.25rem;line-height:1}
.experiment-pagination button[aria-current=page]{background:#bca47520;border-color:#bba578;color:#eddbb5}
.experiment-pagination button:disabled{opacity:.4;cursor:default}
.experiment-pagination button:focus-visible{outline:2px solid #eddbb5;outline-offset:3px}
.experiment-page-summary{text-align:center;color:#a2ad9f;font-size:.8125rem;white-space:nowrap;font-variant-numeric:tabular-nums}
.experiment-browser .experiment-pagination-top{padding:6px 0 28px}
@media(min-width:1280px){
 .experiment-browser .experiment-directory-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:740px){
 .experiment-browser .directory-heading{margin-bottom:20px}
 .experiment-browser .experiment-difficulty-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-bottom:16px;padding-bottom:16px}
 .experiment-browser .experiment-difficulty-nav button{min-width:0;gap:0;padding:9px 4px;min-height:44px;font-size:1rem}
 .experiment-browser .experiment-level{letter-spacing:0}
 .experiment-level-stars{display:none}
 .experiment-level-compact{display:inline}
 .experiment-browser .experiment-level-count{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .experiment-browser .catalog-toolbar{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding-bottom:8px}
 .experiment-browser .experiment-progress-filters{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px}
 .experiment-browser .experiment-progress-filters button{padding:8px 6px}
 .experiment-browser .catalog-search{order:-1;width:100%;min-width:0}
 .experiment-browser .catalog-search input{min-height:46px}
 .experiment-browser .catalog-result-line{gap:7px;padding:8px 0 20px;font-size:.875rem}
 .experiment-result-count{gap:6px 12px}
 .experiment-sort{gap:7px;margin-left:auto}
 .experiment-sort select{font-size:1rem;min-width:118px}
 .experiment-browser .experiment-directory-grid{grid-template-columns:minmax(0,1fr);gap:24px}
 .experiment-browser .murdle-feature-cover{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto;gap:0;padding:0}
 .experiment-browser .story-cover-frame{grid-column:1;grid-row:2;width:100%;aspect-ratio:3/2}
 .experiment-browser .murdle-feature-top{grid-column:1;grid-row:1;padding:12px 18px;min-height:54px;flex-wrap:wrap;gap:8px 12px}
 .experiment-browser .murdle-feature-edition{gap:12px}
 .experiment-browser .murdle-feature-edition>span:first-child{font-size:1rem}
 .experiment-browser .catalog-status{font-size:.875rem;padding:3px 7px}
 .experiment-browser .murdle-feature-story{grid-column:1;grid-row:3;padding:20px 20px 22px}
 .experiment-browser .experiment-title-line{margin-bottom:10px}
 .experiment-browser .murdle-feature-story h2{font-size:1.5rem;line-height:1.5;letter-spacing:.04em;overflow-wrap:anywhere}
 .experiment-browser .murdle-feature-story>p{display:block;-webkit-line-clamp:unset;overflow:visible;min-height:0;font-size:1rem;line-height:1.8;color:#bcc5ba}
 .experiment-browser .murdle-feature-action{grid-column:1;grid-row:4;padding:13px 0;margin:0 20px;min-height:52px;gap:10px;font-size:.9375rem}
 .experiment-browser .experiment-cover-stamp{font-size:.8125rem;padding:1px 5px}
 .experiment-pagination{width:min(100%,360px);padding-top:24px}
 .experiment-page-controls{gap:8px}
 .experiment-page-controls>button{padding-inline:6px}
 .experiment-page-numbers,.experiment-page-window{gap:4px}
 .experiment-page-window-wide{display:none}
 .experiment-page-window-compact{display:flex}
 .experiment-page-numbers button{width:clamp(32px,9.5vw,44px);min-width:0;padding-inline:3px}
 .experiment-page-arrow{display:none}
 .experiment-browser .experiment-pagination-top{padding:4px 0 24px}
}
@media(max-width:360px){
 .experiment-sort>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}

.experiment-explore-more{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px 24px;margin-top:32px;padding-top:20px;border-top:1px solid var(--chrome-line,#8791734d);font-size:.9375rem;}
.experiment-explore-more a{display:inline-flex;align-items:center;min-height:44px;color:var(--chrome-muted,#b9c3b9);text-decoration:none;}
.experiment-explore-more a:hover{color:var(--chrome-accent,#d6bf8d);text-decoration:underline;text-underline-offset:4px;}

/* An archive label, a working tab, a reading bookmark, a completed seal.
   Shape and text carry the distinction as well as color. Artwork stays clear. */
.experiment-browser .murdle-feature[data-case-state]{--state-ink:#b9c3b9;--state-edge:#63746a;--state-paper:#1b2923;border-top:3px solid var(--state-edge)}
.experiment-browser .murdle-feature[data-case-state="active"]{--state-ink:#ecd19b;--state-edge:#ad8950;--state-paper:#3a3020}
.experiment-browser .murdle-feature[data-case-state="read"]{--state-ink:#bbd1dc;--state-edge:#6e92a3;--state-paper:#233943}
.experiment-browser .murdle-feature[data-case-state="solved"]{--state-ink:#26251b;--state-edge:#c4a46b;--state-paper:#d3ba82;border-color:#a9915e;box-shadow:0 7px 22px #0002,inset 0 0 0 1px #c4a46b33}
.experiment-browser [data-case-state] .murdle-feature-top{min-height:68px;flex-wrap:wrap;gap:10px 12px}
.experiment-browser [data-case-state] .catalog-status{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;gap:7px;min-height:36px;margin-left:auto;padding:6px 10px;border:1px solid var(--state-edge);border-radius:2px;background:var(--state-paper);color:var(--state-ink);font:500 .875rem/1.4 var(--font-sans,sans-serif);letter-spacing:.035em;white-space:nowrap}
.experiment-browser .experiment-state-icon{display:block;width:21px;height:21px;flex:0 0 21px}
.experiment-browser [data-case-state="new"] .catalog-status{border-style:dashed;background:transparent}
.experiment-browser [data-case-state="active"] .catalog-status{border-left-width:4px;padding-left:7px}
.experiment-browser [data-case-state="read"] .catalog-status{border-radius:2px 2px 9px 2px}
.experiment-browser [data-case-state="solved"] .catalog-status{border:3px double #7f653a;outline:1px solid #e5cc9377;outline-offset:2px;padding:4px 9px;font-weight:650;letter-spacing:.06em;box-shadow:inset 0 0 0 1px #eddaab66}
.experiment-browser [data-case-state="solved"] .murdle-feature-top{background:#293023;border-bottom-color:#b4996266}
.experiment-browser [data-case-state="solved"] .murdle-feature-action{border-top:3px double #af945e88;color:#e0c48a}
.experiment-browser [data-case-state="solved"] .experiment-cover-stamp{font-size:.875rem;padding:4px 9px;background:#a888461b;color:#e4cb93;border-color:#c6a56c;outline-color:#c6a56c55}
@media(forced-colors:active){
 .experiment-browser [data-case-state] .catalog-status{border-color:CanvasText;outline-color:CanvasText;background:Canvas;color:CanvasText}
}

.experiment-explore-more a{gap:12px;font-size:14px}
