.kb-tool{--ink:#443b33;--brown:#89512f;--line:#e5d6c5;--cream:#f8f1e7;color:var(--ink);font-family:inherit;font-size:15px;line-height:1.7}.kb-tool *{box-sizing:border-box}.kb-tool [hidden]{display:none!important}.kb-tool button,.kb-tool select,.kb-tool input{font:inherit}.kb-tool button{cursor:pointer;border-radius:12px;border:1px solid var(--line);padding:11px 16px;color:#705139;background:#fffaf4;line-height:1.5;min-height:44px;transition:background .15s,color .15s}.kb-tool button:disabled{opacity:.45;cursor:default}.kb-tool button:focus-visible,.kb-tool select:focus-visible,.kb-tool input:focus-visible,.kb-tool a:focus-visible{outline:3px solid #1d6b76;outline-offset:3px}.kb-tool .kb-primary{background:#89512f!important;color:#fff!important;border-color:#89512f!important;font-weight:750;padding:17px 23px;box-shadow:0 3px 0 #6b3e2519}.kb-tool .kb-primary:hover{background:#744326!important}.kb-tool .kb-secondary{background:#fff!important;color:#745137!important}.kb-tool .kb-link{background:transparent!important;color:#7c5434!important;border:0;padding:8px 0;text-decoration:underline;text-underline-offset:4px;box-shadow:none}.kb-tool .kb-small{padding:5px 11px;min-height:38px;font-size:12px}.kb-tool p{margin:0 0 14px}.kb-tool h1,.kb-tool h2,.kb-tool h3{color:var(--ink);font-weight:750;word-break:keep-all;line-height:1.4}.kb-tool h1{font-size:clamp(27px,3vw,39px);letter-spacing:-1.4px;margin:0 0 21px}.kb-tool h2{font-size:25px;margin:0 0 12px}.kb-tool h3{font-size:16px;margin:0 0 12px}.kb-tool .kb-eyebrow{font-size:10px;letter-spacing:2.2px;color:#956a47;font-weight:700;margin-bottom:15px}.kb-hero{display:grid;grid-template-columns:.85fr 1.15fr;gap:42px;align-items:center;padding:14px 0 32px}.kb-tool .kb-headline{font-size:clamp(28px,3.8vw,48px);line-height:1.3;letter-spacing:-2px;font-weight:450;margin:0 0 23px}.kb-headline strong{font-weight:800;color:#89512f}.kb-tool .kb-lead{font-size:17px;line-height:1.8;color:#796854;margin-bottom:25px}.kb-start{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px}.kb-trust{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:22px!important;font-size:12px}.kb-trust strong{padding:4px 10px;background:#f6e6d2;border:1px solid #dcb791;border-radius:7px;color:#633f25}.kb-privacy{font-size:13px;color:#633b22;line-height:1.7}.kb-tool .kb-limit,.kb-tool .kb-first-load{font-size:11px;color:#8a7764;line-height:1.85}.kb-tool .kb-first-load{padding-top:11px;border-top:1px solid #eadfd3;max-width:330px}.kb-showcase{min-width:0;background:linear-gradient(145deg,#fffaf4,#f1e7d9);border:1px solid #e8dbcb;border-radius:25px;padding:19px;box-shadow:0 24px 60px #6b4a2810}.kb-demo-header{display:flex;justify-content:space-between;gap:14px;font-size:11px;margin:0 1px 14px;color:#79664f}.kb-demo-header span:last-child{font-size:9px;white-space:nowrap}.kb-demo-stage{aspect-ratio:4/3;position:relative;border-radius:18px;overflow:hidden;background:repeating-conic-gradient(#f1ece5 0 25%,#fffcf7 0 50%) 0/20px 20px;isolation:isolate}.kb-demo-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}.kb-demo-stage #kb-demo-cutout{filter:drop-shadow(0 14px 13px #3a2c191c)}.kb-demo-stage #kb-demo-original{clip-path:inset(0);transition:clip-path 1.1s cubic-bezier(.2,.8,.2,1)}.kb-demo-stage[data-cut=true] #kb-demo-original{clip-path:inset(0 100% 0 0)}.kb-demo-stage[data-background=color]{background:var(--demo-bg)}.kb-demo-badge{position:absolute;top:13px;left:13px;background:#fffdf4e8;color:#62452d;border:1px solid #fff;border-radius:20px;font-size:10px;padding:5px 12px;backdrop-filter:blur(8px)}.kb-demo-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0 8px}.kb-tool .kb-demo-footer p{font-size:15px;font-weight:700;margin:0}.kb-demo-footer button{font-size:10px;min-height:36px}.kb-samples{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.kb-tool .kb-samples button{display:flex;align-items:center;gap:7px;padding:7px;min-width:0;font-size:11px;background:#fffaf4;color:#745137;min-height:53px}.kb-samples img{width:44px;height:35px;object-fit:cover;border-radius:6px}.kb-tool .kb-samples button[aria-pressed=true]{background:#fff;border-color:#a37651;box-shadow:inset 0 0 0 1px #a3765133}.kb-demo-colors{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:15px}.kb-demo-colors>span{font-size:10px;color:#8a745c;margin-right:auto}.kb-tool .kb-demo-colors button{width:30px;height:30px;min-height:30px;padding:0;border-radius:50%;background:var(--swatch);border:2px solid #fff;box-shadow:0 0 0 1px #d9c8b2}.kb-tool .kb-demo-colors button[aria-pressed=true]{box-shadow:0 0 0 2px #89512f}.kb-checker{background:repeating-conic-gradient(#e5ded3 0 25%,#fff 0 50%) 0/10px 10px!important}.kb-tool .kb-demo-note{font-size:9px;line-height:1.7;color:#917d65;margin:13px 0 0}.kb-status{background:#faf5ed;border:1px solid #ead8c2;border-radius:12px;padding:14px 17px;white-space:pre-line;font-size:13px;min-height:48px}.kb-progress-panel{display:grid;grid-template-columns:1fr 130px auto;gap:18px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:15px;margin:12px 0}.kb-progress-panel strong{font-size:13px}.kb-progress-panel small{display:block;font-size:11px;color:#8a715b}.kb-progress-panel progress{width:100%;accent-color:#89512f;height:10px}.kb-progress-panel button{font-size:12px}.kb-compat-panel{background:#fff5df;border:1px solid #d9ba82;padding:18px;border-radius:12px;margin-bottom:18px}.kb-compat-panel p{font-size:13px}.kb-workspace{padding-top:26px}.kb-queue-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.kb-queue-heading .kb-eyebrow{margin:0 0 6px}.kb-list{list-style:none;display:flex;gap:10px;overflow-x:auto;padding:5px 3px 15px;margin:0 0 12px}.kb-list li{position:relative;flex:0 0 132px;min-width:0}.kb-tool .kb-photo-choice{width:100%;display:flex;flex-direction:column;gap:6px;text-align:left;padding:8px;min-height:120px;background:#fffcf8;border:1px solid var(--line)}.kb-photo-choice img{width:100%;height:64px;object-fit:contain;background:repeating-conic-gradient(#eee8df 0 25%,#fff 0 50%) 0/12px 12px;border-radius:7px}.kb-photo-choice strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;padding-right:13px}.kb-photo-choice small{font-size:10px}.kb-photo-choice[aria-pressed=true]{outline:2px solid #a2734d;outline-offset:1px}.kb-tool .kb-photo-delete{position:absolute;right:5px;top:5px;border-radius:50%;width:26px;height:26px;min-height:26px;padding:0;background:#fff;color:#734c30;font-size:17px;box-shadow:0 1px 5px #0001}.kb-edit-grid{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:24px}.kb-preview-panel{min-width:0}.kb-preview-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}.kb-preview-heading strong{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px}.kb-preview-heading button{font-size:11px;white-space:nowrap;padding:6px 12px;min-height:38px}.kb-view-tools{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:0 0 12px}.kb-view-tools output{font-size:11px;width:40px;text-align:center}.kb-view-tools label{display:flex;align-items:center;gap:5px;font-size:10px;margin-left:auto}.kb-tool select{max-width:100%;border:1px solid #d6bea6;background:#fff;color:#624b39;border-radius:9px;padding:9px;font-size:12px}.kb-view-tools select{padding:6px;font-size:10px}.kb-stage{position:relative;height:490px;overflow:hidden;border:1px solid #e1d5c7;border-radius:16px;background:repeating-conic-gradient(#ebe6df 0 25%,#fff 0 50%) 0/22px 22px;touch-action:none;isolation:isolate;cursor:grab}.kb-stage[data-mode=erase],.kb-stage[data-mode=restore]{cursor:crosshair}.kb-stage[data-inspect=light]{background:#fff}.kb-stage[data-inspect=dark]{background:#262b2d}.kb-stage>canvas#kb-canvas{position:absolute;left:0;top:0;max-width:none;max-height:none;transform-origin:0 0;touch-action:none}.kb-stage #kb-stage-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.9;font-size:13px;padding:25px;color:#8b725a;background:#faf4eae0}.kb-loupe{position:absolute!important;right:14px!important;top:14px!important;width:120px!important;height:120px!important;border:3px solid #fff;border-radius:50%;box-shadow:0 4px 15px #0003;pointer-events:none;background:#ece5da;z-index:2}.kb-tool .kb-dimensions{font-size:12px;font-weight:650;margin:12px 0 5px}.kb-tool .kb-inspect-note{font-size:10px;line-height:1.8;color:#8a735d}.kb-controls{background:#faf5ed;border:1px solid var(--line);border-radius:17px;padding:20px;align-self:start}.kb-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.kb-tool .kb-modes button{font-size:11px;padding:8px 5px;min-height:42px}.kb-tool .kb-modes button[aria-pressed=true]{background:#89512f!important;color:#fff!important;border-color:#89512f}.kb-tool .kb-note{font-size:11px;color:#8b725a;line-height:1.8;margin:10px 0}.kb-controls label{display:block;font-size:12px;font-weight:650;margin:13px 0 7px}.kb-controls input[type=range]{width:100%;accent-color:#89512f}.kb-controls output{float:right;font-size:11px;color:#89512f}.kb-history{display:flex;gap:6px;margin:10px 0}.kb-history button{flex:1;min-width:0;padding:9px 5px;font-size:11px}.kb-setting-group{margin-top:18px;padding-top:18px;border-top:1px solid #e6d6c2}.kb-setting-group h3{font-size:13px}.kb-colors{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.kb-tool .kb-colors button{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:10px;padding:7px 3px;min-height:59px;background:#fffaf5;color:#745137}.kb-colors button>span{width:23px;height:23px;border-radius:50%;border:1px solid #d7c6b3;background:var(--swatch)}.kb-tool .kb-colors button[aria-pressed=true]{border-color:#89512f;box-shadow:inset 0 0 0 1px #89512f}.kb-controls .kb-custom-color{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:400}.kb-custom-color input{height:32px;width:45px;padding:3px;border:1px solid #d6bea6;border-radius:7px;background:#fff}.kb-setting-group>.kb-link{font-size:11px}.kb-controls #kb-format{width:100%}.kb-reset-row{display:flex;flex-direction:column;align-items:start;border-top:1px solid #e6d6c2;margin-top:15px;padding-top:10px}.kb-reset-row button{font-size:11px;min-height:34px}.kb-save-bar{display:flex;align-items:center;gap:12px;padding:18px 20px;background:#f7ead9;border:1px solid #dfc5a6;border-radius:14px;margin-top:22px}.kb-save-bar>div{flex:1;min-width:0}.kb-save-bar strong{display:block;font-size:14px}.kb-save-bar small{display:block;font-size:11px;line-height:1.7;margin-top:4px;white-space:pre-line}.kb-save-bar button{font-size:12px;white-space:nowrap}.kb-guide{margin-top:58px;border-top:1px solid #e9daca;padding-top:40px}.kb-guide section{margin:0 0 35px}.kb-guide p,.kb-guide details{font-size:14px;line-height:1.9;color:#7d6855}.kb-guide-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:25px}.kb-guide-steps>div{border-left:2px solid #ead0b4;padding-left:18px}.kb-guide-steps span{font-size:11px;color:#a27147}.kb-guide-steps h3{margin-top:9px}.kb-faq details{border-bottom:1px solid #e5d1bd;padding:15px 0}.kb-faq summary{cursor:pointer;font-weight:650;color:#5b493a}.kb-faq details p{margin-top:12px}.kb-back{text-align:center;margin-top:25px}.kb-back a{color:#89512f;text-decoration:underline;text-underline-offset:4px}.kb-tool #kb-original[aria-pressed=true]{background:#89512f!important;color:white!important}.kb-tool button span,.kb-tool button small{color:inherit}.kb-tool input[type=range]{padding:0}.kb-tool button[aria-pressed]:hover{filter:brightness(.98)}
@media(max-width:900px){.kb-hero{gap:25px}.kb-headline{letter-spacing:-1.5px}.kb-edit-grid{grid-template-columns:minmax(0,1fr) 240px;gap:15px}.kb-controls{padding:15px}.kb-demo-header>span:first-child{font-size:10px}.kb-samples img{width:35px}.kb-save-bar{flex-wrap:wrap}.kb-save-bar>div{flex-basis:100%}}
@media(max-width:700px){.kb-hero{display:flex;flex-direction:column;gap:22px;padding:0 0 20px}.kb-intro{width:100%}.kb-tool h1{font-size:28px;margin-bottom:14px}.kb-tool .kb-headline{font-size:36px;letter-spacing:-1.5px;margin-bottom:15px}.kb-tool .kb-lead{font-size:15px;margin-bottom:18px}.kb-start{gap:8px 15px}.kb-start>.kb-primary{padding:15px 20px}.kb-start>.kb-link{font-size:12px}.kb-trust{margin-top:17px!important}.kb-tool .kb-limit{font-size:10px}.kb-tool .kb-first-load{font-size:10px;margin-bottom:0}.kb-showcase{padding:13px;border-radius:19px;width:100%;max-width:550px}.kb-demo-header{margin-bottom:10px}.kb-demo-header span:first-child{font-size:9px}.kb-demo-header span:last-child{font-size:8px}.kb-demo-stage{border-radius:12px}.kb-samples{gap:5px}.kb-tool .kb-samples button{font-size:10px;padding:5px;gap:4px;min-height:47px}.kb-samples img{width:33px;height:29px}.kb-demo-footer .kb-link{font-size:9px}.kb-tool .kb-demo-footer p{font-size:13px}.kb-demo-colors>span{font-size:9px}.kb-tool .kb-demo-note{font-size:8px}.kb-status{font-size:12px;padding:13px}.kb-progress-panel{grid-template-columns:1fr auto;gap:10px;padding:12px}.kb-progress-panel progress{grid-column:1/-1;grid-row:2}.kb-progress-panel button{font-size:11px;padding:9px}.kb-queue-heading h2{font-size:19px}.kb-queue-heading .kb-eyebrow{font-size:8px;letter-spacing:1.2px}.kb-queue-heading>button{font-size:10px;padding:9px}.kb-list li{flex-basis:112px}.kb-edit-grid{display:flex;flex-direction:column;gap:17px}.kb-stage{height:340px}.kb-preview-heading strong{font-size:11px}.kb-view-tools{gap:5px}.kb-view-tools label{margin-left:0}.kb-controls{width:100%;padding:16px}.kb-modes button{min-height:46px!important;font-size:12px!important}.kb-colors{grid-template-columns:repeat(6,minmax(0,1fr))}.kb-tool .kb-colors button{font-size:9px}.kb-history button{font-size:12px}.kb-setting-group{margin-top:13px;padding-top:13px}.kb-controls h3{font-size:15px}.kb-save-bar{padding:15px;gap:10px;margin-top:17px}.kb-save-bar>button{flex:1;white-space:normal;padding:13px 10px;min-height:48px}.kb-save-bar .kb-primary{font-size:12px}.kb-save-bar strong{font-size:13px}.kb-guide{padding-top:30px;margin-top:35px}.kb-guide h2{font-size:21px}.kb-guide-steps{grid-template-columns:1fr;gap:16px}.kb-guide-steps p{margin-bottom:0}.kb-guide p,.kb-guide details{font-size:13px}.kb-loupe{width:105px!important;height:105px!important}}
@media(prefers-reduced-motion:reduce){.kb-tool *{transition:none!important;animation:none!important}}

.kb-tool .kb-input-errors{white-space:pre-line;background:#fff2ed;border:1px solid #d9ab96;color:#853c22;border-radius:10px;padding:13px;font-size:12px;line-height:1.8}

.kb-photo-error{display:block;color:#a32c20;font-size:11px;font-weight:650;line-height:1.5;white-space:normal;overflow-wrap:anywhere;max-width:220px;margin-top:6px}.kb-photo-choice:has(.kb-photo-error){border-color:#bd624b;background:#fff7f4}


.kb-memory-notice{margin:18px 0;padding:14px 16px;background:#fff1f0;border:1px solid #d92d20;border-radius:12px;color:#b42318}.kb-memory-notice strong{display:block;font-size:14px;font-weight:800}.kb-memory-notice p{font-size:12px;line-height:1.75;margin:7px 0 0;color:#b42318;font-weight:650}

/* Shared example scale: retain larger stages; keep editor sizing independent. */
@media(min-width:701px){.kb-hero{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:28px;align-items:start}}
@media(max-width:700px){.kb-showcase{width:calc(100% + 28px);max-width:none;margin-inline:-14px}}
