@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#f5f3ed;--ink:#25372f;--muted:#7b8179;--gold:#b58a4d;--line:#e3e4dc;--green:#234e3c}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'DM Sans',sans-serif}aside{position:fixed;width:236px;height:100vh;background:#1e3028;color:#eee8d9;padding:28px 20px}.logo{width:148px;display:block;margin:0 auto 30px}.eyebrow{font-size:9px;letter-spacing:2px;color:#a6b0a5;padding:0 12px}nav{display:grid;gap:8px}button,.button{cursor:pointer;font:inherit;border:1px solid var(--line);border-radius:7px;background:white;color:var(--ink);padding:11px 15px;display:inline-block}button:hover,.button:hover{filter:brightness(.95)}nav button{border:0;background:transparent;color:#bdc8bd;text-align:left;padding:14px 12px}nav button.active{background:#3b4d3e;color:#edd3a5}nav span{float:right;font-size:11px}.asidefoot{position:absolute;bottom:30px;font-size:10px;letter-spacing:1px;line-height:2.4}.asidefoot small{color:#9da99d;letter-spacing:0;font-size:12px}.dot{display:inline-block;width:6px;height:6px;background:#a7bf90;border-radius:50%;margin-right:7px}main{margin-left:236px;padding:0 42px;max-width:1700px}header{height:87px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:1.4px}header b{margin:0 12px;color:#b9bdb2}header div{letter-spacing:0;font-size:12px}header .button{background:var(--green);color:white;border-color:var(--green)}h1{font:800 36px Manrope,sans-serif;letter-spacing:-1.5px;margin:10px 0}h2{font:700 18px Manrope,sans-serif;margin:0 0 8px}h3{font-size:14px}.intro{padding:34px 0 28px}.intro p{color:var(--muted);margin:10px 0}.kicker{font-size:10px;letter-spacing:2px;color:var(--gold);font-weight:700}.pill{display:inline-block;padding:6px 10px;background:#e9eddf;border-radius:20px;font-size:10px;color:#506746}.layout{display:grid;grid-template-columns:1fr 1.05fr;gap:24px}.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:26px}.sub{font-size:12px;color:var(--muted);line-height:1.7}.label{display:block;font-size:10px;font-weight:700;letter-spacing:1px;margin:22px 0 9px;text-transform:uppercase}select,input,textarea{font:inherit;color:var(--ink);background:#fafaf6;border:1px solid #dbdfd5;border-radius:6px;padding:11px;width:100%}select{height:45px}input[type=file]{font-size:11px}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.result{background:#233c30;color:#fff;position:relative;overflow:hidden}.result:after{content:'';position:absolute;width:230px;height:230px;right:-130px;top:-100px;border:40px solid #ffffff04;border-radius:50%;pointer-events:none}.result .sub{color:#b9c8ba}.result .kicker{color:#c8ad79}.big{font:700 66px Manrope,sans-serif;letter-spacing:-3px;margin:8px 0}.big small{font-size:16px;font-weight:400;letter-spacing:0;color:#b5c5b6}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px;border-top:1px solid #ffffff25;padding-top:22px}.metric strong{display:block;font:600 26px Manrope,sans-serif;margin:7px 0}.metric small{color:#b9c8ba;font-size:10px;letter-spacing:1px}.result button{margin-top:24px;background:#e6c28a;border:0;width:100%;font-weight:700}.note{padding:16px 19px;background:#eeece1;border-radius:8px;margin-top:20px;font-size:12px;line-height:1.7;color:#7a725c}.strip{margin-top:25px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}.strip .card{padding:20px}.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}.tool{position:relative}.tool h3{line-height:1.5;min-height:42px}.tool img{height:85px;object-fit:contain;width:100%;margin-bottom:10px}.bit-art{height:70px;display:flex;align-items:center;justify-content:center;color:#b39361;font-size:44px;background:linear-gradient(135deg,#f4f2ea,#e9ece4);border-radius:7px}.star{float:right;border:0;padding:0 0 8px 8px;color:#aa854c;font-size:22px}.tool button.pick{width:100%;margin-top:12px}.filters{display:flex;gap:10px}.filters input{flex:1}.rackrow{display:grid;grid-template-columns:64px 1fr 100px;gap:16px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}.slot{font:800 26px Manrope;color:var(--gold)}.rackrow select{margin-top:8px}.rackrow input{padding:8px}.rackrow small{color:var(--muted)}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:32px;padding:22px 0;color:var(--muted);font-size:11px}#toast{position:fixed;bottom:24px;left:50%;background:#233c30;color:white;padding:14px 24px;border-radius:8px;display:none;z-index:10}a{color:var(--green)}.empty{padding:40px;text-align:center}.full{width:100%}@media(min-width:1450px){main{padding:0 65px}.intro{padding-top:45px}.card{padding:32px}}@media(max-width:1000px){aside{width:190px;padding:25px 12px}main{margin-left:190px;padding:0 24px}.layout{grid-template-columns:1fr}.tools{grid-template-columns:1fr 1fr}.strip{grid-template-columns:1fr}.big{font-size:54px}}@media(max-width:650px){aside{position:static;width:100%;height:auto;padding:10px}.logo{width:65px;margin:0 auto 8px}.eyebrow,.asidefoot{display:none}nav{display:flex;overflow:auto;gap:0}nav button{white-space:nowrap;font-size:11px;padding:10px}main{margin:0;padding:0 16px}header{height:70px}header>span{display:none}h1{font-size:29px}.tools{grid-template-columns:1fr}.rackrow{grid-template-columns:40px 1fr 65px}.card{padding:20px}.two{gap:10px}footer{font-size:10px}}
/* Visual tool selection and RapidChange pockets */
.rack-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px}.rack-heading p{margin:6px 0}.pocket-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.pocket{border:1px solid var(--line);background:white;border-radius:12px;overflow:hidden;transition:border-color .2s}.pocket.selected{border:2px solid var(--green);box-shadow:0 0 0 3px #234e3c0d}.pocket-select{display:flex;flex-direction:column;border:0;border-radius:0;background:transparent;padding:18px;width:100%;height:calc(100% - 55px);text-align:left}.pocket-top{display:flex;align-items:center;justify-content:space-between;width:100%;gap:10px}.pocket-top>span:last-child{font-size:9px;letter-spacing:.5px;color:#788775}.pocket.selected .pocket-top>span:last-child{color:var(--green);font-weight:700}.pocket-select img,.pocket-select .bit-art{width:100%;height:95px;object-fit:contain;margin:12px 0;background:#fff}.pocket-select strong{font-size:13px;line-height:1.5;margin-bottom:5px}.pocket-select .sub{font-size:11px}.empty-pocket{height:95px;width:100%;display:grid;place-items:center;font-size:32px;color:#a7b3a1;margin:12px 0;background:#f7f8f2;border:1px dashed #d7ddcf;border-radius:7px}.pocket-controls{padding:10px 18px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #eef0e8;height:55px}.pocket-controls label{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted)}.pocket-controls input{width:62px;padding:5px 8px;background:#fff}.clear-pocket{font-size:11px;padding:5px 8px;border:0;background:transparent;color:#8a674e}.rack-warning{font-size:11px;color:#7a725c;line-height:1.7;margin:15px 0 28px}.bit-picker{padding:25px}.picker-controls{display:grid;grid-template-columns:1fr 230px;gap:12px}.type-filters{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0}.type-filters button{border-radius:20px;padding:8px 12px;font-size:11px;background:#f7f8f3}.filter-active,.type-filters .filter-active{background:var(--green)!important;color:#fff!important;border-color:var(--green)}.picker-summary{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:15px 0 0;font-size:11px;color:var(--muted)}#resetFilters{padding:4px 0;border:0;background:none;text-decoration:underline;font-size:11px}.rack-tools{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;margin-top:18px}.rack-bit{border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;background:#fff}.rack-bit.assigned{border:2px solid var(--green)}.photo-wrap{position:relative;background:#fafaf7}.photo-wrap img,.photo-wrap .bit-art{height:155px;width:100%;object-fit:contain;margin:0;background:#fafaf7}.photo-wrap .star{position:absolute;right:10px;top:10px;padding:2px 7px;border-radius:50%;background:#fff;box-shadow:0 1px 5px #0001}.rack-bit-info{padding:16px;display:flex;flex-direction:column;flex:1}.type-label{font-size:9px;color:#a17a42;text-transform:uppercase;letter-spacing:.8px;font-weight:700}.rack-bit h3{min-height:0;margin:8px 0;font-size:13px;line-height:1.5}.rack-bit .sub{margin:0;font-size:11px}.assignment-label{font-size:10px;color:#829078;margin:12px 0}.assign-button{background:var(--green);color:white;border-color:var(--green);font-size:12px;width:100%;margin-top:auto}.assign-button.is-assigned{background:#edf1e6;border-color:#dce4d4;color:var(--green);cursor:default}.image-credit{margin-top:22px;font-size:10px}.rack-tools .empty{grid-column:1/-1}.tool>img{height:130px}.pocket-select:focus-visible,button:focus-visible{outline:3px solid #c4a16c;outline-offset:3px}@media(max-width:1100px){.rack-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.pocket-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.rack-heading{align-items:flex-start;flex-direction:column}.picker-controls{grid-template-columns:1fr}.pocket-grid{gap:9px}.pocket-select{padding:12px}.pocket-top{flex-wrap:wrap;gap:4px}.pocket-controls{padding:10px}.rack-tools{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.bit-picker{padding:14px}.rack-bit-info{padding:11px}.photo-wrap img,.photo-wrap .bit-art{height:115px}.rack-bit h3{font-size:12px}.assign-button{font-size:11px;padding:10px 5px}}
.export-panel{margin:0 0 20px;padding:18px 22px}.export-panel summary{display:flex;justify-content:space-between;align-items:center;gap:15px;cursor:pointer;font-weight:700;list-style:none}.export-panel summary small{font-size:11px;color:var(--muted);font-weight:400}.export-panel summary:after{content:'＋';font-size:18px}.export-panel[open] summary:after{content:'−'}.export-panel[open] summary{padding-bottom:8px}.export-panel .export-check{display:flex;align-items:center;gap:10px;margin-top:15px;font-size:12px}.export-check input{width:16px;height:16px;accent-color:var(--green)}.export-panel .assign-button{margin-top:18px;width:auto}.export-panel .note{font-size:11px}.export-panel button:disabled{opacity:.6;cursor:wait}@media(max-width:650px){.export-panel summary{flex-wrap:wrap}.export-panel .two{grid-template-columns:1fr}}
.rack-transfer{margin-bottom:18px}.rack-transfer .rack-heading{margin-bottom:2px}.transfer-controls{display:flex;align-items:flex-end;gap:12px}.transfer-controls>div{flex:1}.transfer-controls .label{margin-top:12px}.transfer-controls button,.transfer-controls .button{white-space:nowrap}.transfer-controls #exportRackJson{background:var(--green);color:white;border-color:var(--green)}.rack-transfer>.sub{font-size:11px;margin-top:13px}.import-slot-preview{max-height:240px;overflow:auto;background:#fff9;border-radius:6px;margin:12px 0}.import-slot-preview>div{display:flex;gap:16px;padding:9px 12px;border-bottom:1px solid #deddd1;font-size:11px}.import-slot-preview b{white-space:nowrap;min-width:90px}.rack-transfer .note .assign-button{width:auto;margin-top:0}#undoRackImport{font-size:12px}#rackImportPreview .note h3{margin:0 0 10px}@media(max-width:650px){.transfer-controls{flex-wrap:wrap}.transfer-controls>div{flex-basis:100%}.transfer-controls .button,.transfer-controls button{flex:1;text-align:center}.import-slot-preview>div{flex-direction:column;gap:3px}}
.calc-rack-panel{margin-bottom:24px}.calc-rack-actions{display:flex;gap:9px;flex-wrap:wrap}.calc-rack-actions .button{background:var(--green);border-color:var(--green);color:#fff}.calc-rack-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:12px}.calc-rack-bit{padding:15px;text-align:left;display:flex;flex-direction:column;gap:8px;min-width:0;background:#fafbf7;border:1px solid var(--line);position:relative}.calc-rack-bit.selected{background:#f0f4e9;border:2px solid var(--green);box-shadow:0 0 0 2px #234e3c0b}.calc-rack-bit .pocket-top{font-size:9px;gap:6px;flex-wrap:wrap}.calc-rack-bit img,.calc-rack-bit .bit-art{width:100%;height:100px;object-fit:contain;border-radius:5px;margin:0;background:#fff}.calc-rack-bit strong{font-size:12px;line-height:1.5;overflow-wrap:anywhere}.calc-rack-bit>.sub{font-size:10px;margin-top:auto}.calc-rack-empty{padding:30px;text-align:center;border:1px dashed #cdd6c3;border-radius:9px;background:#fafbf7}.calc-rack-empty>span{font-size:30px;color:#96a48b}.selected-bit-summary{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:22px 0 0;padding:17px 0 8px}.selected-bit-summary h3{font-size:14px;line-height:1.6;margin:8px 0 3px}.selected-bit-summary .sub{margin-top:0}@media(max-width:650px){.calc-rack-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.calc-rack-bit{padding:11px}.calc-rack-bit img,.calc-rack-bit .bit-art{height:90px}.calc-rack-actions{width:100%}.calc-rack-actions>*{flex:1;text-align:center;font-size:12px}}
/* Larger current-rack cards: six assigned pockets form two rows of three. */
.calc-rack-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.calc-rack-bit{min-height:285px;padding:20px;gap:12px}.calc-rack-bit img,.calc-rack-bit .bit-art{height:170px}.calc-rack-bit strong{font-size:14px;line-height:1.55}.calc-rack-bit>.sub{font-size:12px}.calc-rack-bit .pocket-top{font-size:10px}.calc-rack-bit .kicker{font-size:11px}@media(max-width:900px){.calc-rack-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.calc-rack-bit{padding:16px;min-height:265px}.calc-rack-bit img,.calc-rack-bit .bit-art{height:150px}}@media(max-width:480px){.calc-rack-grid{grid-template-columns:1fr}.calc-rack-bit{min-height:280px}.calc-rack-bit img,.calc-rack-bit .bit-art{height:180px}}
.reference-controls{border-top:1px solid var(--line);margin-top:20px}.reference-controls .sub{font-size:11px}.reference-controls select{font-size:12px}.reference-controls #referenceRow{max-width:100%}
.account-bar{margin:20px 0 0;padding:17px 20px;border:1px solid #d7dfcf;border-radius:10px;background:#eaf0e1;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.account-info{flex:1;min-width:220px}.account-info strong{display:block;font-size:13px;margin-bottom:5px}.account-info span{font-size:11px;line-height:1.6;display:block}.account-actions{display:flex;gap:7px;flex-wrap:wrap}.account-actions button,.account-actions .button{font-size:11px;padding:8px 11px;text-decoration:none}.account-actions .button:first-child{background:var(--green);color:white;border-color:var(--green)}.account-bar.conflict,.account-bar.error,.account-bar.auth{background:#fff1dc;border-color:#daba86}.sync-explanation{font-size:11px;line-height:1.7;margin:0;width:100%}.account-actions button:disabled{opacity:.5}.account-bar.saving{background:#edf2e8}@media(max-width:650px){.account-bar{padding:14px}.account-actions{width:100%}.account-info{min-width:0;width:100%}}