/* Shared studio header and Classic play bar. */
[hidden]{display:none!important}
.cabinetWrappedCloth:before{display:none}
.bloomSwap .arcadeHeader,.arcade .arcadeHeader{display:flex;align-items:center;justify-content:initial;gap:3px;padding:8px 12px 3px;min-height:49px;max-width:none}
.bloomSwap .arcadeHeader .brand,.arcade .arcadeHeader .brand{display:flex;align-items:center;flex:1;min-width:0;gap:6px;color:#ffedc9;font:24px/1.25 BloomKai,'Bloom Craft Kai',serif;letter-spacing:2px;text-decoration:none;white-space:nowrap}
html[lang=en] .bloomSwap .arcadeHeader .brand,html[lang=en] .arcade .arcadeHeader .brand{font-size:28px;letter-spacing:0}
.arcadeHeader .brand .mark{display:grid;place-content:center;width:24px;height:28px;flex:none;font:17px BloomKai,'Bloom Craft Kai',serif}
.bloomSwap .arcadeHeader .roundBtn,.arcade .arcadeHeader .roundBtn{display:flex;align-items:center;justify-content:center;flex:0 0 35px;width:35px;height:37px;min-width:35px;min-height:37px;border:0;background:none;box-shadow:none;border-radius:0;padding:0;position:relative;color:#f7dfb1;cursor:pointer}
.prop{display:inline-block;flex:none;background-image:url('classic/assets/ui/studio-props.webp');background-size:300% 300%;background-repeat:no-repeat;pointer-events:none;filter:drop-shadow(0 3px 2px #1f1a1a55)}.prop-reference{background-position:0 0}.prop-hint{background-position:50% 0}.prop-ghost{background-position:100% 0}.prop-sound{background-position:0 50%}.prop-menu{background-position:50% 50%}.prop-map{background-position:100% 50%}.prop-restart{background-position:50% 100%}
.bloomSwap .arcadeHeader .roundBtn .prop,.arcade .arcadeHeader .roundBtn .prop{width:53px;height:35px;flex:0 0 53px}.roundBtn[aria-pressed=false] .prop{opacity:.55;filter:grayscale(.8) drop-shadow(0 2px 2px #0005)}.bloomSwap .roundBtn[aria-pressed=false]:after{content:'';position:absolute;width:25px;height:2px;background:#ecd4ac;transform:rotate(-40deg)}
.bloomSwap .arcadeHeader .bloomLang,.arcade .arcadeHeader .bloomLang{min-width:34px;min-height:34px;font:10px Georgia;padding:5px}.bloomSwap .pbModeNav.pbCompact,.arcade .pbModeNav.pbCompact{margin-left:1px}.bloomSwap .pbModeNav.pbCompact a,.arcade .pbModeNav.pbCompact a{font-size:11px;padding:7px 9px}
.unifiedToolbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch;gap:2px;width:100%;margin:9px auto 0;padding:0 4px;max-width:500px}
.unifiedToolbar>button,.arcade .unifiedToolbar>button{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:1px;min-width:0;min-height:66px;padding:0 1px 5px;border:0;border-radius:0;background:none;box-shadow:none;font:12px/1.3 var(--studioFont,BloomKai,serif);font-weight:400;color:#ffedce;text-shadow:0 2px 3px #392515;letter-spacing:0;cursor:pointer}
.unifiedToolbar>button>.prop{width:63px;height:42px;flex:none}.unifiedToolbar .toolLabel{display:block;white-space:nowrap;line-height:20px;font:inherit;text-align:center;letter-spacing:0}.unifiedToolbar small{display:inline-grid;place-content:center;background:#174258;border:1px solid #a9915d;color:#fff0c6;border-radius:50%;min-width:17px;height:17px;font:11px Georgia;text-shadow:none;vertical-align:middle}.unifiedToolbar>button:disabled{opacity:.42;filter:grayscale(.65);cursor:default}.unifiedToolbar>button[aria-pressed=true]{color:#ffe8a0}.unifiedToolbar>button[aria-pressed=true] .prop{filter:drop-shadow(0 0 5px #ffe7a4)}.unifiedToolbar>button:focus-visible{outline:2px solid #f4d397;outline-offset:0}.unifiedToolbar #refImage{display:none}
.bloomSwap .dots{margin-top:6px;margin-bottom:7px}.bloomSwap .notice{margin-bottom:2px}.bloomSwap .unifiedToolbar{margin-top:5px}.arcade .unifiedToolbar{margin-top:7px}.arcade .tablebar{justify-content:space-between;align-items:center}.arcade .tablebar #timer{display:block;color:#ffe4b8;font:11px var(--studioFont,serif);letter-spacing:1px}
.bloomSwap dialog:not(.pbCabinet){position:fixed;background:#f5e9cd;color:#493923;border:2px solid #b4945e;border-radius:12px;width:calc(100% - 30px);max-width:440px;max-height:88dvh;overflow:auto;padding:25px 22px;box-shadow:inset 0 0 0 4px #fff6df,0 15px 70px #161c19aa;font-family:var(--studioFont,serif)}.bloomSwap dialog:not(.pbCabinet)::backdrop{background:#142a32b5;backdrop-filter:blur(5px)}.bloomSwap dialog .close{position:absolute;right:8px;top:8px;width:36px;height:36px;border:0;background:#f4e6cde0;color:#88613a;border-radius:50%;font:26px Georgia;cursor:pointer}.bloomSwap dialog h2{font:24px/1.4 var(--studioFont,serif);margin:9px 0;letter-spacing:0}.bloomSwap dialog .eyebrow{font-size:11px;color:#9f583c}.bloomSwap .settingRow{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:49px}.bloomSwap .settingRow select,.bloomSwap .audioSwitch{min-height:38px;min-width:90px;background:#eee0bb;border:1px solid #bca170;border-radius:7px;padding:6px 12px;font-family:var(--studioFont,serif)}.bloomSwap .audioSwitch[aria-pressed=true]{background:#244960;color:#fff0cf}.bloomSwap .settingRow input[type=range]{width:45%;accent-color:#244960}.bloomSwap .settingsRows{margin-top:17px}.bloomSwap .tiny{font-size:11px;line-height:1.7;color:#8c7654}.bloomSwap #imageModal{padding:5px;max-width:680px}.bloomSwap #imageModal img{display:block;width:100%;max-height:81dvh;object-fit:contain}
@media(max-width:400px){.unifiedToolbar>button,.arcade .unifiedToolbar>button{font-size:11px;min-height:60px}.unifiedToolbar>button>.prop{width:57px;height:38px}.bloomSwap .arcadeHeader,.arcade .arcadeHeader{padding-left:9px;padding-right:9px}.bloomSwap .arcadeHeader .brand,.arcade .arcadeHeader .brand{font-size:22px}html[lang=en] .bloomSwap .arcadeHeader .brand,html[lang=en] .arcade .arcadeHeader .brand{font-size:25px}.arcadeHeader .brand .mark{width:22px;height:26px;font-size:16px}}
@media(max-width:355px){.arcadeHeader .brand .mark{display:none!important}.unifiedToolbar>button,.arcade .unifiedToolbar>button{font-size:10px}.unifiedToolbar{padding:0 2px}.bloomSwap .arcadeHeader .roundBtn,.arcade .arcadeHeader .roundBtn{flex-basis:31px;width:31px;min-width:31px}.bloomSwap .pbModeNav.pbCompact a,.arcade .pbModeNav.pbCompact a{padding:7px 7px}}
/* Identical exhibition-icon slots; sprite canvases have matching proportions. */
.homeModes .modeCard{display:grid;grid-template-columns:64px minmax(0,1fr) 13px;column-gap:14px;align-items:center}.homeModes .modeCard>.studioProp{width:64px;height:64px;justify-self:center;margin:0;align-self:center}.homeModes .modeCard>div{min-width:0}.homeModes .modeCard h2{margin:0 0 7px}.homeModes .modeCard p{min-height:3.2em}.homeModes .modeCard small{min-height:1.5em}.homeModes .modeCard>.enterMark{justify-self:center}
/* Smaller completion lettering, with generous space inside the painted button. */
html[lang=en] .completion .primary,html[lang=en] #nextLevel{font-family:Georgia,'Times New Roman',serif;font-size:17px;line-height:1.3;letter-spacing:0}html[lang=en] .completion h2,html[lang=en] #winTitle{font-size:21px;line-height:1.4}
/* Draw the arrow inside the control instead of at the native outer edge. */
.settingRow select,.bloomSwap .settingRow select{appearance:none;-webkit-appearance:none;padding:8px 34px 8px 12px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235b4930' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;background-size:12px 8px;max-width:61%;min-width:118px}.settingRow select:focus-visible{outline:2px solid #947345;outline-offset:2px}.settingRow #musicTrack{width:58%;font-size:12px}.settingRow{gap:9px}
@media(max-width:370px){.homeModes .modeCard{grid-template-columns:57px minmax(0,1fr) 11px;column-gap:10px}.homeModes .modeCard>.studioProp{width:57px;height:57px}.settingRow #musicTrack{font-size:11px}.settingRow select,.bloomSwap .settingRow select{min-width:109px;padding-right:31px;background-position:right 11px center}}
/* Centre the painted objects within the atlas cells, not just the sprite boxes. */
.homeModes .modeCard>.prop-classic{background-position:calc(0% - 9px) 100%}.homeModes .modeCard>.prop-swap{background-position:calc(100% + 9px) 100%}
@media(max-width:370px){.homeModes .modeCard>.prop-classic{background-position:calc(0% - 8px) 100%}.homeModes .modeCard>.prop-swap{background-position:calc(100% + 8px) 100%}}
