/* Shared project selection, above the existing IP presentation deck. */
#practice .ip-project-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:24px;background:#1c201d;border-bottom:1px solid #41463e}
#practice .ip-project-picker button{position:relative;display:grid;grid-template-columns:42% 1fr;align-items:center;gap:22px;min-width:0;padding:0 24px 0 0;text-align:left;color:#e5e6dd;background:#292e28;border:1px solid #52594b;cursor:pointer;overflow:hidden;transition:border-color .2s,background .2s}
#practice .ip-project-picker button>img{width:100%;height:180px;object-fit:cover;object-position:center 5%;filter:saturate(.65);transition:filter .2s}
#practice .ip-project-picker button>span{display:grid;gap:10px}
#practice .ip-project-picker small{font-size:9px;letter-spacing:.12em;color:#adb5a3}
#practice .ip-project-picker strong{font-size:26px;font-weight:500;letter-spacing:.06em}
#practice .ip-project-picker em{font-style:normal;font-size:10px;letter-spacing:.1em;color:#c1c6b8}
#practice .ip-project-picker i{position:absolute;right:14px;bottom:10px;font-style:normal;font-size:20px;color:#b7c9ac}
#practice .ip-project-picker button.is-active{border-color:#c2cba5;background:#363d2e;box-shadow:inset 0 -3px #c2cba5}
#practice .ip-project-picker button.is-active>img,#practice .ip-project-picker button:hover>img{filter:none}
#practice .ip-project-picker button:focus-visible{outline:2px solid #d7dfbc;outline-offset:3px}
#practice [data-deck-versions][hidden],#practice [data-project-detail][hidden],#practice [data-deck-overview][hidden]{display:none!important}

/* The Ordainer uses the same deck, controls and index, with an artwork-led light theme. */
#practice .practice-content[data-ip-project="ordainer"][data-active-panel="ip"]{background:#ece9df}
#practice .practice-content[data-ip-project="ordainer"][data-active-panel="ip"]::before,
#practice .practice-content[data-ip-project="ordainer"][data-active-panel="ip"]::after{display:none}
#practice #mr-mellow[data-version="ordainer"]{display:grid!important;grid-template-columns:minmax(210px,.65fr) minmax(0,1.7fr);grid-template-rows:auto auto auto;gap:24px 40px;min-height:0!important;height:auto!important;padding:38px!important;background:#f1eee5!important;color:#35392f;overflow:hidden}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-surface,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-guides,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-meta,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-tags,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-bottom,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-copyright{display:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-visual{position:relative!important;inset:auto!important;grid-column:2;grid-row:1;width:100%!important;height:650px!important;min-height:0!important;opacity:1!important;transform:none!important;mask:none!important;filter:none!important;background:#e5e0d5}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-visual::before,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-visual::after{display:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-visual img{position:static!important;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;mask:none!important;filter:none!important;opacity:1!important;transform:none!important;mix-blend-mode:normal!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-copy{position:relative!important;inset:auto!important;grid-column:1;grid-row:1;align-self:center;width:auto!important;max-width:none!important;min-height:0!important;margin:0!important;padding:0!important;background:none!important;transform:none!important;text-shadow:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-copy::before,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-copy::after{display:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-kicker{color:#87724c!important;font-size:10px!important;letter-spacing:.12em}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-title{font-size:clamp(28px,3vw,46px)!important;line-height:1.5!important;font-weight:500!important;color:#34392e!important;max-width:none!important;margin:26px 0 14px!important;text-shadow:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-subtitle{font-size:11px!important;line-height:1.8!important;color:#776f5b!important;margin:0!important;letter-spacing:.1em}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-description{font-size:14px!important;line-height:2!important;color:#64685a!important;margin:30px 0 0!important;max-width:290px!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index{position:relative!important;inset:auto!important;display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;grid-column:1/-1;grid-row:2;gap:10px!important;width:100%!important;max-width:none!important;margin:0!important;padding:20px 0 0!important;border-top:1px solid #cec8b7;transform:none!important;overflow:visible!important;background:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item{position:relative!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:6px!important;width:auto!important;min-width:0!important;max-width:none!important;height:auto!important;min-height:0!important;margin:0!important;padding:5px!important;background:transparent!important;color:#5c6151!important;border:1px solid transparent!important;border-radius:0!important;transform:none!important;box-shadow:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item::before,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item::after{display:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item.is-active{border-color:#88734b!important;background:#e4dece!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item>img{position:static!important;display:block!important;width:100%!important;height:110px!important;object-fit:contain!important;opacity:1!important;filter:none!important;transform:none!important;mask:none!important;border-radius:0!important;background:#ded8ca}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item>span:not(.ordainer-index-mosaic),
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item>b{position:static!important;font-size:10px!important;line-height:1.5!important;color:inherit!important;white-space:normal!important;transform:none!important;text-shadow:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item>b{font-weight:500!important}
#practice #mr-mellow[data-version="ordainer"] .ordainer-index-mosaic{position:static!important;display:grid!important;grid-template-columns:repeat(3,1fr);gap:2px;width:100%;height:110px!important;background:#ded8ca;transform:none!important}
#practice #mr-mellow[data-version="ordainer"] .ordainer-index-mosaic img{position:static!important;width:100%!important;height:53px!important;object-fit:contain;opacity:1!important;transform:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-controls{position:relative!important;inset:auto!important;display:flex!important;grid-column:2;grid-row:3;justify-self:end;gap:10px;transform:none!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-controls button{display:block!important;width:44px;height:44px;color:#444b39;background:transparent;border:1px solid #a9a28c;border-radius:0}
#practice #mr-mellow[data-version="ordainer"] .ip-project-detail{display:flex;gap:25px;align-items:center;grid-column:1;grid-row:3;justify-self:start;color:#656c54;font-size:12px;border-bottom:1px solid #a9a28c;text-decoration:none}
#practice #mr-mellow[data-version="ordainer"][data-overview="true"] .practice-deck-visual{display:none!important}
#practice #mr-mellow[data-version="ordainer"] .ordainer-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-column:2;grid-row:1;gap:18px 12px;height:650px;align-content:center}
#practice .ordainer-overview button{padding:0;border:0;background:none;color:#676a5c;cursor:pointer}
#practice .ordainer-overview img{width:100%;height:270px;object-fit:contain;background:#e3ded2}
#practice .ordainer-overview span{display:block;font-size:11px;margin-top:10px}
#practice #mr-mellow[data-version="ordainer"] button:focus-visible{outline:2px solid #75633f;outline-offset:3px}
@media(max-width:1100px){
 #practice .ip-project-picker{padding:16px;gap:12px}
 #practice .ip-project-picker button{grid-template-columns:1fr;padding:0;gap:0}
 #practice .ip-project-picker button>img{height:190px}
 #practice .ip-project-picker button>span{padding:16px;gap:7px}
 #practice .ip-project-picker strong{font-size:23px}
 #practice #mr-mellow[data-version="ordainer"]{padding:24px!important;gap:24px;grid-template-columns:1fr!important}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-copy{grid-column:1;grid-row:1}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-title{font-size:30px!important;margin:12px 0!important}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-description{max-width:none!important;margin:14px 0 0!important;font-size:13px!important}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-visual{grid-column:1;grid-row:2;height:660px!important}
 #practice #mr-mellow[data-version="ordainer"] .ordainer-overview{grid-column:1;grid-row:2;height:660px}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-index{grid-row:3;grid-template-columns:repeat(4,minmax(0,1fr))!important}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-controls{grid-column:1;grid-row:4}
 #practice #mr-mellow[data-version="ordainer"] .ip-project-detail{grid-column:1;grid-row:4}
}
@media(max-width:600px){
 #practice .ip-project-picker{padding:10px;gap:8px}
 #practice .ip-project-picker button>img{height:155px}
 #practice .ip-project-picker button>span{padding:12px;gap:7px}
 #practice .ip-project-picker small{font-size:7px;letter-spacing:.02em}
 #practice .ip-project-picker strong{font-size:20px}
 #practice .ip-project-picker em{font-size:8px}
 #practice #mr-mellow[data-version="ordainer"]{padding:18px!important;gap:20px}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-visual{height:auto!important;aspect-ratio:2/3}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-title{font-size:27px!important}
 #practice #mr-mellow[data-version="ordainer"] .ordainer-overview{height:auto;gap:15px 6px}
 #practice .ordainer-overview img{height:auto;aspect-ratio:2/3}
 #practice .ordainer-overview span{font-size:9px}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-index{gap:8px!important}
 #practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item>img{height:84px!important}
 #practice #mr-mellow[data-version="ordainer"] .ordainer-index-mosaic{height:84px!important}
 #practice #mr-mellow[data-version="ordainer"] .ordainer-index-mosaic img{height:40px!important}
}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-visual{padding:0!important;background:transparent}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-visual img{max-width:none!important;max-height:none!important;margin:0!important;padding:0!important}
#practice #mr-mellow[data-version="ordainer"]>*{min-width:0!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index{grid-auto-flow:row!important;grid-auto-columns:auto!important;box-shadow:none!important;min-width:0!important;border-radius:0!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item{grid-area:auto!important}
#practice #mr-mellow[data-version="ordainer"] .ordainer-index-mosaic{grid-auto-flow:row!important;grid-auto-columns:auto!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;min-width:0!important}
#practice #mr-mellow[data-version="ordainer"] .ordainer-index-mosaic img{grid-area:auto!important;min-width:0!important}
@media(max-width:1100px){#practice #mr-mellow[data-version="ordainer"]{grid-template-columns:minmax(0,1fr)!important}}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item>b,
#practice #mr-mellow[data-version="ordainer"] .practice-deck-index-item>span:not(.ordainer-index-mosaic){display:block!important;width:auto!important;max-width:none!important;margin:0!important;padding:0!important;text-align:left!important;letter-spacing:0!important;-webkit-line-clamp:unset!important}
#practice #mr-mellow[data-version="ordainer"] .practice-deck-controls{width:auto!important;height:auto!important;min-height:0!important;max-width:none!important;padding:0!important;margin:0!important;background:transparent!important;box-shadow:none!important;border:0!important;backdrop-filter:none!important}
@media(prefers-reduced-motion:reduce){#practice .ip-project-picker *{transition:none}}
