/* Shared workspace treatment. Scoped to the five standalone tools. */
.tool-redesign{--tool-accent:#668951;--tool-dark:#274d3b;--tool-end:#527454;--tool-soft:#eef4e6;--tool-line:#c5d2b9;--tool-ink:#47623c;background:radial-gradient(ellipse at 14% 16%,#e6eddd90,transparent 48%),#f6f7ef}
.tool-bridge{--tool-accent:#6c8590;--tool-dark:#2b4650;--tool-end:#52717a;--tool-soft:#edf2f2;--tool-line:#c4d2d3;--tool-ink:#49656c}
.tool-shape{--tool-accent:#817296;--tool-dark:#40364f;--tool-end:#6d5e7c;--tool-soft:#f1eef5;--tool-line:#d1c9dc;--tool-ink:#6b5b7e}
.tool-mapart{--tool-accent:#ad8257;--tool-dark:#514332;--tool-end:#88704e;--tool-soft:#f6f1e7;--tool-line:#d9cebb;--tool-ink:#826543}
.tool-palette{--tool-accent:#668d75;--tool-dark:#2b4d43;--tool-end:#587d68;--tool-soft:#edf4ed;--tool-line:#c4d4c5;--tool-ink:#4c715b}
.tool-redesign :is(.pixel-main,main){max-width:1240px}
.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro,.tool-intro){margin:28px 0 26px;gap:22px}
.tool-redesign .tool-intro{padding:0}
.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro,.tool-intro) h1{position:relative;padding-left:52px;color:#2d4936;font:40px/1.18 var(--pixel-font);letter-spacing:0;margin:0 0 10px}
.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro,.tool-intro) h1:before{content:'';position:absolute;left:0;top:1px;width:39px;height:39px;background:var(--tool-icon) center/contain no-repeat;image-rendering:pixelated}
/* BEGIN SHARED TOOL ICONS */
.tool-path{--tool-icon:url('tool-items/golden_shovel.png')}.tool-bridge{--tool-icon:url('tool-items/bridge-approved.png')}.tool-shape{--tool-icon:url('tool-items/shape-item.png')}.tool-mapart{--tool-icon:url('tool-items/filled_map.png')}.tool-palette{--tool-icon:url('tool-items/lime_dye.png')}
/* END SHARED TOOL ICONS */
.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro)>div>p:last-child,.tool-redesign .tool-intro>p:last-child{font:12px/1.7 system-ui,sans-serif;color:#75816c;margin:0 0 0 52px;max-width:660px}
.tool-redesign :is(.pixel-eyebrow,.shape-eyebrow,.pixel-intro .eyebrow){font:9px/1.5 system-ui,sans-serif;letter-spacing:1.1px;color:#8b9782;margin-bottom:8px}
.tool-redesign :is(.bridge-version,.shape-version,.pixel-badge){background:var(--tool-soft);border:1px solid var(--tool-line);color:var(--tool-ink);padding:7px 10px;font:11px/1.4 var(--pixel-font);border-radius:3px}
/* Pale console frame and solid, high-contrast panel heads. */
.tool-redesign :is(.bridge-layout,.shape-layout,.pixel-workspace){padding:18px;gap:18px;background:#e9eee0;border:1px solid #bdcab0;border-radius:5px;box-shadow:inset 1px 1px #fffff7,0 5px 0 #c7d3bc40,0 18px 38px #354e2710}
.tool-redesign :is(.pixel-panel,.shape-panel,.surface){border:1px solid var(--tool-line);border-radius:4px;background:#fffff9;box-shadow:0 3px 0 #a7ba9520,0 8px 18px #3d522807;min-width:0}
.tool-redesign :is(.bridge-options,.shape-options){padding:19px}
.tool-redesign :is(.bridge-options,.shape-options)>h2{grid-column:1/-1;margin:-19px -19px 20px;padding:20px 19px;font:24px/1.2 var(--pixel-font);color:#f4f7e9;background:linear-gradient(115deg,var(--tool-dark),var(--tool-end));border-bottom:3px solid var(--tool-accent);border-radius:3px 3px 0 0;box-shadow:inset 0 1px #ffffff15}
.tool-redesign :is(.bridge-range,.bridge-select,.shape-dimension,.shape-select){font-size:12px;color:var(--tool-ink)}
.tool-redesign :is(.bridge-range output,.shape-summary b){color:var(--tool-ink)}
.tool-redesign :is(select,input[type=number],input[type=text],input[type=search]){border-radius:3px;border-color:var(--tool-line);background:var(--tool-soft);color:var(--tool-ink);transition:border-color .16s,background .16s}
.tool-redesign :is(input,select):focus-visible{outline:2px solid var(--tool-accent);outline-offset:3px}
.tool-redesign :is(input,select):hover:not(:disabled){border-color:var(--tool-accent)}
.tool-redesign input[type=range],.tool-redesign input[type=checkbox]{accent-color:var(--tool-accent)}
.tool-redesign :is(.bridge-variation button,.shape-fill button[aria-pressed=true]){background:var(--tool-soft);border:1px solid var(--tool-line);color:var(--tool-ink);box-shadow:inset 0 1px #fff,0 2px #354c2710;border-radius:3px}
.tool-redesign .bridge-variation button{padding:11px}
.tool-redesign :is(.bridge-more,.pixel-advanced,.fine-tune){border-color:var(--tool-line)}
.tool-redesign :is(.bridge-more summary,.pixel-advanced summary,.fine-tune summary){color:var(--tool-ink)}
.tool-redesign :is(.bridge-note,.shape-hint,.shape-footnote){font:11px/1.75 system-ui,sans-serif;color:#819075}
.tool-redesign :is(.bridge-result,.shape-result){padding:0;overflow:hidden}
/* Selection cards retain their existing designs and accessible pressed states. */
.tool-redesign :is(.bridge-design-card,.path-style,.shape-option){background:#fdfef7;border:1px solid var(--tool-line);border-radius:4px;box-shadow:0 2px 0 #c1cdb42b;color:var(--tool-ink);transition:background .18s,border-color .18s,transform .18s,box-shadow .18s}
.tool-redesign :is(.bridge-design-card,.path-style,.shape-option):hover{background:var(--tool-soft);border-color:var(--tool-accent);transform:translateY(-2px);box-shadow:0 5px 14px #32482c0c}
.tool-redesign :is(.bridge-design-card,.path-style,.shape-option)[aria-pressed=true]{background:var(--tool-soft);border:1px solid var(--tool-accent);box-shadow:inset 0 -3px var(--tool-accent),0 3px 0 #c1cdb430;color:var(--tool-ink)}
.tool-redesign .shape-option{min-height:88px;gap:10px}
.tool-redesign .shape-option[aria-pressed=true] svg{color:var(--tool-accent)}
.tool-redesign :is(.bridge-design-gallery,.path-styles,.shape-picker){gap:10px;margin:22px 0}
.tool-redesign :is(.bridge-view-toolbar,.shape-view-header){min-height:65px;padding:14px 17px;background:linear-gradient(115deg,var(--tool-dark),var(--tool-end));color:#eaf2e3;border-bottom:3px solid var(--tool-accent);gap:14px}
.tool-redesign .shape-view-header>p{color:#e3e9dd;font-size:12px}
.tool-redesign :is(.bridge-view-toolbar,.shape-view-header) :is(button,select){background:#ffffff10;border:1px solid #ffffff35;border-radius:3px;color:#f3f6eb;min-height:30px;padding:6px 9px;font:12px var(--pixel-font)}
.tool-redesign .bridge-view-toolbar select option{background:#fffff9;color:#425a3b}
.tool-redesign :is(.bridge-view-toolbar,.shape-view-header) button:hover{background:#ffffff25}
.tool-redesign .shape-view-tabs button[aria-pressed=true]{background:#fcfff0;color:var(--tool-ink);border-color:#fcfff0}
.tool-redesign :is(.bridge-stage,.shape-stage){border-bottom:1px solid var(--tool-line)}
.tool-redesign :is(.bridge-controls,.shape-control-hint){font:10px/1.6 system-ui,sans-serif;border:1px solid #ffffff25;border-radius:3px;background:#24382fc9;padding:6px 10px;max-width:90%;white-space:normal;text-align:center}
.tool-redesign :is(.bridge-actions,.shape-actions){padding:16px;gap:9px;background:#fcfdf5}
.tool-redesign :is(.bridge-actions,.shape-actions,.pixel-exports) button{border:1px solid var(--tool-line);background:var(--tool-soft);color:var(--tool-ink);font:14px/1.4 var(--pixel-font);padding:11px 14px;border-radius:3px;box-shadow:inset 0 1px #fff9,0 2px #354c2710;transition:filter .15s,transform .15s}
.tool-redesign :is(.bridge-actions,.shape-actions,.pixel-exports) :is(.pixel-primary,.shape-primary){background:var(--tool-accent);color:#fffff1;border-color:var(--tool-accent);box-shadow:inset 0 1px #ffffff25,inset 0 -3px #14231024,0 2px #354c2720}
.tool-redesign :is(.bridge-actions,.shape-actions,.pixel-exports) button:hover:not(:disabled){filter:brightness(1.07);transform:translateY(-1px)}
.tool-redesign :is(.bridge-actions,.shape-actions,.pixel-exports) button:active:not(:disabled){transform:translateY(1px)}
.tool-redesign .shape-layer{background:var(--tool-soft);border-color:var(--tool-line)}
.tool-redesign .shape-layer b{color:var(--tool-ink)}
.tool-redesign .shape-layer>button{border-color:var(--tool-line);background:#fffff8;color:var(--tool-ink);border-radius:3px}
.tool-redesign .shape-summary{background:var(--tool-soft);padding:22px}
.tool-redesign .shape-material strong{color:var(--tool-ink)}
/* Material inventory remains compact and uses the actual rendered block icons. */
.tool-redesign .bridge-materials{padding:20px;margin-top:28px}
.tool-redesign .bridge-materials>header{padding:0 0 15px;margin-bottom:16px;border-bottom:1px solid var(--tool-line);gap:14px}
.tool-redesign .bridge-materials h2{font:24px/1.2 var(--pixel-font);color:var(--tool-ink);margin:0}
.tool-redesign :is(.bridge-materials header>span,.pixel-materials header>span){padding:5px 9px;background:var(--tool-soft);border:1px solid var(--tool-line);color:var(--tool-ink);border-radius:3px;font:11px/1.5 var(--pixel-font)}
.tool-redesign :is(.bridge-material-row,.pixel-material){background:var(--tool-soft);border:1px solid var(--tool-line);border-radius:3px;padding:12px;gap:12px}
.tool-redesign .bridge-material-icon{background:#fffff77a;border-radius:3px;padding:2px;box-sizing:content-box}
/* Map art: warm paper controls and a framed map workspace. */
.tool-mapart .pixel-settings{gap:16px}
.tool-mapart .pixel-settings>.pixel-panel{padding:18px}
.tool-mapart .pixel-settings>.pixel-panel>h2{margin:-18px -18px 18px;padding:17px 18px;background:linear-gradient(115deg,var(--tool-dark),var(--tool-end));color:#f9f4e8;font:22px/1.25 var(--pixel-font);border-bottom:3px solid var(--tool-accent);border-radius:3px 3px 0 0}
.tool-mapart .pixel-settings>.pixel-panel:nth-child(2)>h2{background:var(--tool-soft);color:var(--tool-ink);border-bottom:1px solid var(--tool-line)}
.tool-mapart .pixel-upload{border:1px dashed #bba783;background:#f8f4e9;border-radius:3px;padding:25px 10px;transition:background .16s,border-color .16s}
.tool-mapart .pixel-upload:hover,.tool-mapart .pixel-upload.dragging{background:#eee6d3;border-color:#9b764c}
.tool-mapart .pixel-upload :is(b,.ui-icon){color:#947046}
.tool-mapart .pixel-preview-header{background:linear-gradient(115deg,var(--tool-dark),var(--tool-end));border-bottom:3px solid var(--tool-accent);padding:19px 20px;color:#fff8e8}
.tool-mapart .pixel-preview-header h2{color:inherit;font:25px/1.2 var(--pixel-font)}
.tool-mapart .pixel-preview-header .pixel-muted{color:#e0d3bd;font-size:11px}
.tool-mapart .pixel-tabs{background:#ffffff10;border-color:#ffffff30;border-radius:3px}
.tool-mapart .pixel-tabs button{color:#ebe2d1;font-size:13px}
.tool-mapart .pixel-tabs button[aria-pressed=true]{background:#fcf8eb;color:#806241}
.tool-mapart .pixel-preview-area{background-color:#293c3b;background-image:radial-gradient(#a6bba31c 1px,transparent 1px)}
.tool-mapart .pixel-preview-controls{background:var(--tool-soft);border-color:var(--tool-line)}
.tool-mapart .pixel-text{color:var(--tool-ink)}
.tool-mapart .pixel-materials>header{border-bottom:1px solid var(--tool-line);padding-bottom:16px}
.tool-mapart :is(.pixel-materials,.pixel-build-guide)>h2,.tool-mapart .pixel-materials h2{font:24px/1.25 var(--pixel-font);color:var(--tool-ink)}
.tool-mapart .pixel-material b{color:var(--tool-ink)}
/* Palette: three coordinated stations and a distinct saved inventory. */
.tool-palette .workspace{gap:15px;animation:none}
.tool-palette :is(.color-panel,.matches-panel,.decoration-panel,.saved-palette){padding:18px}
.tool-palette .mode-tabs{margin:-18px -18px 18px;padding:12px 15px;background:linear-gradient(115deg,var(--tool-dark),var(--tool-end));border-bottom:3px solid var(--tool-accent);border-radius:3px 3px 0 0;grid-column:1/-1}
.tool-palette .mode-tabs button{border:1px solid #ffffff2b;background:#ffffff0c;color:#e3eddf;font:16px var(--pixel-font);border-radius:3px}
.tool-palette .mode-tabs button.active{background:#f6faed;color:#42634c;box-shadow:inset 0 -2px #bbcdb0}
.tool-palette :is(.matches-panel,.decoration-panel)>.matches-heading{padding:15px 16px;margin:-18px -18px 18px;min-height:67px;background:linear-gradient(115deg,var(--tool-dark),var(--tool-end));border-bottom:3px solid var(--tool-accent);border-radius:3px 3px 0 0;gap:12px;flex-wrap:wrap}
.tool-palette .matches-heading h2{font:20px/1.2 var(--pixel-font);color:#f1f7e9;letter-spacing:0;flex-shrink:1}
.tool-palette .match-controls{width:100%;max-width:none}
.tool-palette .match-controls .search-field{max-width:none;flex:1;background:#fffff2;border-color:#ffffff50;border-radius:3px}
.tool-palette .match-controls select{background:#f4f7ec;max-width:115px}
.tool-palette .search-field input{background:transparent}
.tool-palette .block-card{background:#f5f8ee;border:1px solid #d5dfcb;border-radius:4px;box-shadow:0 2px #b9c9ac20;transition:background .18s,border-color .18s,box-shadow .18s}
.tool-palette .block-card:hover,.tool-palette .block-card:focus-within{border-color:var(--tool-accent);background:#e9f1e0;box-shadow:0 4px 12px #314b2910}
.tool-palette .block-card.in-palette{border-color:#71936a;box-shadow:inset 0 -3px #7c9b70;background:#eaf2e2}
.tool-palette .block-add{padding:12px;min-height:66px}
.tool-palette .decoration-grid{gap:10px}
.tool-palette .color-plane-wrap{border:1px solid #aabca0;border-radius:3px;box-shadow:0 3px 0 #d4dfc7}
.tool-palette .choose-block{background:var(--tool-soft);border-color:var(--tool-line);color:var(--tool-ink);font:15px var(--pixel-font);border-radius:3px}
.tool-palette .saved-palette{background:#edf2e5;border-color:#bbcdb0;margin-top:4px}
.tool-palette .row-heading{padding-bottom:14px;border-bottom:1px solid #cedbc2;margin-bottom:18px}
.tool-palette .row-heading h2{font:23px/1.2 var(--pixel-font);color:var(--tool-ink)}
.tool-palette .palette-slot{background:#fffff7;border-radius:3px;border-color:#c6d5ba;box-shadow:inset 0 -3px #e0e9d6}
.tool-palette .palette-slot.empty{border-color:#bacbaa;background:#f4f7ed;box-shadow:none}
.tool-palette .palette-actions>.button{padding:10px 12px;font:13px var(--pixel-font);border-color:var(--tool-line);border-radius:3px}
.tool-palette .palette-actions>.primary{background:var(--tool-accent);border-color:var(--tool-accent);color:#ffffef;box-shadow:inset 0 -3px #14231024}
.tool-palette #blockPicker{border-color:#b9cbb0;border-radius:5px;background:#fbfcf3}
.tool-palette .dialog-heading h2{font:28px var(--pixel-font);color:#3c5e43}
/* Preserve working grids and useful preview space at every breakpoint. */
@media(max-width:1120px){.tool-redesign :is(.bridge-layout,.shape-layout,.pixel-workspace){padding:14px;gap:14px}.tool-palette .workspace{grid-template-columns:240px minmax(0,1fr)}.tool-palette .decoration-panel{grid-column:2;grid-row:2}.tool-palette .color-panel{grid-row:1/3}.tool-palette .decoration-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.tool-palette .saved-palette{grid-row:3}.tool-palette .decoration-panel>.matches-heading{min-height:0}.tool-palette .decoration-hint{display:none}}
@media(max-width:850px){.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro,.tool-intro) h1{font-size:34px}.tool-redesign .shape-summary{padding:18px}.tool-mapart .pixel-preview-header{display:block}.tool-mapart .pixel-tabs{margin-top:13px}.tool-redesign .bridge-layout{grid-template-columns:230px minmax(0,1fr)}.tool-redesign .bridge-view-toolbar{flex-wrap:wrap}.tool-redesign .bridge-view-toolbar>div{flex-wrap:wrap}.tool-palette .workspace{grid-template-columns:210px minmax(0,1fr)}.tool-palette .block-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:720px){.tool-palette .workspace{grid-template-columns:1fr}.tool-palette :is(.color-panel,.matches-panel,.decoration-panel,.saved-palette){grid-column:1;grid-row:auto}.tool-palette .color-panel{padding:18px;gap:0 18px}.tool-palette .matches-panel>.matches-heading{min-height:0}.tool-palette .match-controls{width:auto;min-width:170px;flex:1}.tool-palette .block-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.tool-palette .block-add{padding:9px;min-height:0}.tool-palette .palette-actions>.button{font-size:12px}.tool-palette .tool-intro{margin:23px 0}.tool-mapart .pixel-settings>.pixel-panel{padding:18px}.tool-mapart .pixel-preview-area{height:410px}.tool-mapart .pixel-materials>header{align-items:flex-start}.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro,.tool-intro) h1{font-size:31px;padding-left:43px}.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro,.tool-intro) h1:before{width:32px;height:32px}.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro)>div>p:last-child,.tool-redesign .tool-intro>p:last-child{margin-left:43px;font-size:11px}.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro){margin-top:24px}.tool-redesign .pixel-intro .pixel-badge{margin-left:43px}}
@media(max-width:620px){.tool-redesign :is(.bridge-layout,.shape-layout){grid-template-columns:1fr;padding:12px;gap:14px}.tool-redesign :is(.bridge-options,.shape-options){padding:19px;gap:0 16px}.tool-redesign .bridge-version,.tool-redesign .shape-version{display:none}.tool-redesign .shape-options>h2,.tool-redesign .bridge-options>h2{margin-bottom:12px}.tool-redesign .bridge-materials{padding:16px}.tool-redesign .bridge-materials h2{font-size:22px}.tool-redesign :is(.bridge-actions,.shape-actions){padding:13px}.tool-redesign :is(.bridge-actions,.shape-actions) button{font-size:13px;padding:11px}.tool-redesign .bridge-design-card{padding:13px 12px}.tool-redesign .path-style{padding:12px;gap:9px}.tool-redesign .path-style b{font-size:17px}.tool-redesign .shape-option{min-height:76px;gap:6px}.tool-redesign .shape-view-header{flex-wrap:wrap;gap:10px}.tool-redesign .shape-view-tabs{margin-left:auto}.tool-redesign .shape-select{grid-column:1/-1}}
@media(max-width:420px){.tool-redesign :is(.bridge-heading,.shape-heading,.pixel-intro,.tool-intro) h1{font-size:27px}.tool-palette .color-panel{gap:0 12px}.tool-palette .block-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tool-palette .decoration-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.tool-mapart .pixel-workspace{padding:12px}.tool-mapart .pixel-preview-header{padding:16px}.tool-mapart .pixel-preview-area{height:340px}.tool-mapart .pixel-exports{padding:12px}.tool-mapart .pixel-exports button{font-size:13px}.tool-redesign .bridge-heading h1 .mc-beta-badge{font-size:9px}.tool-redesign :is(.bridge-material-row,.pixel-material){padding:9px;gap:8px}}
@media(prefers-reduced-motion:reduce){.tool-redesign *, .tool-redesign *:before,.tool-redesign *:after{transition:none!important;animation:none!important}.tool-redesign :is(.bridge-design-card,.path-style,.shape-option):hover{transform:none}}
html[data-motion=reduce] .tool-redesign *{transition:none!important;animation:none!important}