.paint-intro{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:38px 0 30px}.paint-intro h1{font-size:clamp(30px,4vw,48px)}.paint-intro p{font-size:18px;color:var(--muted)}.paint-intro-modes{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:22px;font-size:14px;font-weight:850}.paint-intro-modes span{display:flex;align-items:center;gap:7px}.paint-intro-modes span:nth-child(1){color:#a66517}.paint-intro-modes span:nth-child(2){color:#8050ad}.paint-intro-modes span:nth-child(3){color:#327f9f}
.paint-intro-art{position:relative;width:160px;height:150px;flex:none;display:grid;place-items:center;border-radius:46% 54% 44% 56%;background:#ffe5af;transform:rotate(-9deg)}.paint-intro-art>.icon{width:100px;height:100px;stroke:#9b5c32;fill:#fff1d6}.paint-intro-brush{position:absolute;right:-6px;bottom:-8px;transform:rotate(15deg);color:#7b56b9}.paint-intro-brush .icon{width:85px;height:85px;fill:#c7b1ee}
.paint-resume{display:flex;justify-content:space-between;align-items:center;gap:20px;border:2px solid #b7dcc7;border-radius:20px;background:#ecf7ef;padding:20px;margin-bottom:25px}.paint-resume strong{display:block;font-size:24px}.paint-resume span{display:block;margin-top:6px;color:var(--muted)}
.paint-filters{display:flex;flex-wrap:wrap;align-items:end;gap:20px;margin:12px 0 26px;padding:22px;background:#f4edf9;border:1px solid #e7dced;border-radius:22px}.paint-filters>label{display:grid;gap:6px;font-size:13px;font-weight:850}.paint-filters>label:first-child{flex:1;min-width:230px}.paint-filters input[type=search]{width:100%}.paint-filters .water-filter{display:flex;align-items:center;gap:8px;min-height:48px;cursor:pointer;padding:10px;background:white;border-radius:12px;color:#34758c}.paint-filters>span{font-size:13px;align-self:center;white-space:nowrap;color:var(--muted)}
.paint-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.paint-tile{padding:0;background:white;border:2px solid #eee3f2;border-radius:22px;box-shadow:var(--shadow);overflow:hidden;text-align:left;display:flex;flex-direction:column}.paint-tile-art{display:block;position:relative;aspect-ratio:210/265;background:white;border-bottom:1px solid #eee7f1;width:100%}.paint-tile-art>img{display:block;width:100%;height:100%;object-fit:contain;padding:12px}.water-badge{position:absolute;top:10px;right:10px;width:38px;height:38px;display:grid;place-items:center;background:#e1f5fb;color:#2986ad;border:2px solid white;border-radius:50%;box-shadow:0 2px 8px #21394915}.paint-tile-title{font-family:Fredoka,sans-serif;font-size:21px;line-height:1.3;padding:15px 17px 8px;flex:1}.paint-tile-action{display:flex;align-items:center;justify-content:space-between;background:#eee4fa;color:#654099;padding:12px 17px;font-weight:900;margin:6px 10px 10px;border-radius:12px}.paint-tile:hover{border-color:#a98cc9}.paint-tile:hover .paint-tile-action{background:#e4d6f5}
.paint-mode-dialog{width:min(760px,calc(100% - 28px));text-align:center;padding:30px}.paint-dialog-close{position:absolute;right:15px;top:15px}.paint-mode-picture{width:110px;height:145px;margin:0 auto 20px;padding:5px;border:1px solid #ddd0e7;border-radius:10px;box-shadow:0 3px 8px #3d25591a;transform:rotate(-4deg);background:white}.paint-mode-picture img{width:100%;height:100%;object-fit:contain}.paint-mode-dialog h2{font-size:32px}.paint-mode-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}.paint-mode-choices button{display:flex;align-items:center;flex-direction:column;gap:8px;background:#fff0d1;border:2px solid #f6d38c;border-radius:20px;padding:22px 12px;min-height:170px}.paint-mode-choices button:nth-child(2){background:#f0e6fc;border-color:#d7bfe9}.paint-mode-choices button:nth-child(3){background:#e5f5fc;border-color:#b7deed}.paint-mode-choices .icon{width:48px;height:48px}.paint-mode-choices strong{font-family:Fredoka,sans-serif;font-size:23px}.paint-mode-choices span{font-size:13px;line-height:1.4;color:#675674}.paint-mode-choices button:disabled{opacity:.45;cursor:default}.paint-mode-choices button:not(:disabled):hover{border-color:var(--purple);box-shadow:0 4px 15px #76509622}#paint-water-note .text-link{font-size:13px;background:none;padding:0 6px;min-height:38px}#paint-load-status{min-height:24px;color:var(--purple-dark);font-weight:800}
.painting-now>.site-header,.painting-now>.main-nav,.painting-now>.site-footer{display:none}.painting-now>.container{max-width:1440px;padding:0 24px 40px}.painting-now{background:#f3eee6}.paint-topbar{position:sticky;top:0;z-index:12;display:flex;align-items:center;gap:22px;padding:15px 0;background:#f3eee6f5;backdrop-filter:blur(8px);border-bottom:1px solid #e4d8c8}.paint-topbar>div{flex:1;min-width:0}.paint-topbar .eyebrow{font-size:11px;margin-bottom:4px}.paint-topbar h1{font-size:25px;overflow-wrap:anywhere}.paint-back{display:flex;align-items:center;gap:7px;border:2px solid #e4d8cb;border-radius:14px;padding:10px 14px;background:white;min-height:50px;font-weight:850}.paint-back .icon{transform:rotate(180deg)}.paint-topbar>.button{font-size:14px;white-space:nowrap}
.paint-workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:30px;align-items:start;padding-top:22px;max-width:1250px;margin:auto}.paint-easel{min-width:0;text-align:center}.paint-canvas-actions{display:flex;justify-content:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}.paint-canvas-actions button{display:flex;align-items:center;gap:6px;min-height:44px;padding:8px 14px;border-radius:12px;background:white;font-size:14px;font-weight:800;box-shadow:0 2px 5px #6d4f2710;border:1px solid #e5d8c9}.paint-canvas-actions button:disabled{opacity:.4;cursor:default}.paint-board{display:inline-block;max-width:100%;padding:14px;background:repeating-linear-gradient(3deg,#dcb78a 0 4px,#e7c69d 6px 11px,#e0bc91 14px 21px);border:1px solid #cb9f6c;border-radius:13px;box-shadow:0 12px 35px #67421b22, inset 0 0 0 4px #fff4df44;line-height:0}.paint-board canvas{display:block;max-width:100%;max-height:min(72dvh,790px);width:auto;height:auto;background:white;touch-action:none;cursor:crosshair;user-select:none;-webkit-user-select:none;box-shadow:0 1px 5px #694a2a40}.paint-board canvas[data-tool=fill]{cursor:cell}.paint-tip{font-size:13px;color:#77634e;line-height:1.5;max-width:620px;margin:12px auto}
.paint-toolbox{background:#fffcf7;border:1px solid #e9d9c6;border-radius:25px;padding:22px;box-shadow:0 7px 20px #60401e0a}.paint-toolbox fieldset{border:0;margin:0 0 23px;padding:0;min-width:0}.paint-toolbox legend{font-family:Fredoka,sans-serif;font-weight:550;font-size:21px;margin-bottom:12px;padding:0}.paint-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.paint-tool{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:#f5eff9;border:2px solid transparent;border-radius:14px;min-height:75px;padding:8px 3px;font-size:12px;font-weight:900}.paint-tool .icon{width:30px;height:30px;color:#7b52ad}.paint-tool[aria-pressed=true]{background:#ece0fa;border-color:#8258b5;box-shadow:0 0 0 2px white,0 0 0 3px #c5abdf}.tool-fill{background:#fff0d1}.tool-fill .icon{color:#ae731f}.tool-rainbow{background:linear-gradient(130deg,#ffebdd,#f9e2fa,#daf2fd,#e5f5df)}.tool-glitter{background:radial-gradient(circle at 18% 30%,#fff 0 2px,transparent 3px),radial-gradient(circle at 70% 70%,#fff 0 3px,transparent 4px),#f9e4ed}.tool-glitter .icon{color:#c75b91}.tool-eraser{background:#e8effa}.tool-eraser .icon{color:#5b79a6}.tool-water{background:#e3f5fc}.tool-water .icon{color:#3485ab}
.paint-palette{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:12px 8px;background:#f3e3cc;border-radius:36px 28px 42px 28px;border:1px solid #e7d3b5;box-shadow:inset 0 2px 3px #fff8ec}.paint-swatch{position:relative;display:grid;place-items:center;border:2px solid transparent;background:none;border-radius:50%;min-width:44px;min-height:44px;padding:0;aspect-ratio:1}.paint-swatch svg{display:block;width:100%;height:100%;filter:drop-shadow(0 2px 1px #76512a33)}.paint-swatch[aria-pressed=true]{border-color:#584070;background:white;transform:scale(1.08)}.swatch-check{display:none;position:absolute;color:white;text-shadow:0 1px 3px #000,0 0 2px #000;font-size:22px;font-weight:900}.paint-swatch[aria-pressed=true] .swatch-check{display:block}.paint-custom-color{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;font-size:13px;font-weight:800}.paint-custom-color input{width:48px;height:44px;border:1px solid #d1c2d9;border-radius:10px;background:white;padding:5px;cursor:pointer}
.paint-sizes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.paint-sizes button{display:flex;align-items:center;flex-direction:column;justify-content:center;background:#f4eff8;border:2px solid transparent;border-radius:12px;padding:4px 2px 7px;min-height:62px;font-size:11px;font-weight:850;color:#75509f}.paint-sizes svg{width:34px;height:34px}.paint-sizes button[aria-pressed=true]{border-color:#8055af;background:#eaddf6}.paint-tool-help{font-size:13px;color:#766486;line-height:1.6}.paint-save-status{font-size:11px;color:#6d746d;margin-top:16px}.paint-confirm-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
@media(max-width:1000px){.paint-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.paint-workspace{grid-template-columns:minmax(0,1fr) 255px;gap:20px}.paint-toolbox{padding:16px}.paint-board{padding:10px}}
@media(max-width:700px){.paint-intro-art{width:105px;height:100px}.paint-intro-art>.icon{width:70px;height:70px}.paint-intro-brush .icon{width:50px;height:50px}.paint-intro{gap:16px}.paint-intro p{font-size:15px}.paint-intro-modes{font-size:12px;gap:8px}.paint-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.paint-tile-title{font-size:19px;padding:12px}.paint-tile-action{font-size:13px;padding:10px;margin:0 8px 8px}.paint-filters{padding:16px;gap:12px}.paint-filters>label:first-child{flex-basis:100%}.paint-filters>label:nth-child(2){flex:1;min-width:0}.paint-filters select{width:100%}.paint-filters .water-filter{font-size:12px}.paint-filters>span{flex-basis:100%}.paint-resume{padding:15px;flex-wrap:wrap}.paint-resume strong{font-size:21px}.paint-mode-dialog{padding:24px 17px}.paint-mode-picture{width:80px;height:105px;margin-bottom:16px}.paint-mode-dialog h2{font-size:28px}.paint-mode-choices{grid-template-columns:1fr;gap:10px;margin-top:20px}.paint-mode-choices button{display:grid;grid-template-columns:44px 1fr;min-height:75px;padding:14px;text-align:left;gap:2px 13px}.paint-mode-choices .icon{grid-row:1/3;width:37px;height:37px}.paint-mode-choices strong{font-size:22px}.paint-mode-choices span{font-size:12px}.paint-mode-dialog .eyebrow{font-size:11px}.painting-now>.container{padding:0 12px 30px}.paint-topbar{gap:10px;padding:10px 0}.paint-topbar h1{font-size:18px}.paint-topbar .eyebrow{display:none}.paint-back{padding:8px;min-height:44px}.paint-back span{display:none}.paint-topbar>.button{font-size:12px;padding:8px 10px;min-height:44px}.paint-topbar>.button .icon{width:19px}.paint-workspace{display:flex;flex-direction:column;gap:16px;padding-top:14px}.paint-easel,.paint-toolbox{width:100%}.paint-board canvas{max-height:57dvh}.paint-canvas-actions{gap:8px;margin-bottom:12px}.paint-canvas-actions button{padding:6px 10px;font-size:12px}.paint-canvas-actions .icon{width:19px}.paint-tip{font-size:12px;margin-top:9px}.paint-toolbox{padding:17px;display:grid;grid-template-columns:1fr 1fr;gap:16px}.paint-toolbox fieldset{margin:0}.paint-toolbox legend{font-size:18px;margin-bottom:10px}#paint-tool-picker{grid-column:1/-1}.paint-tools{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.paint-tool{min-height:65px;font-size:10px;gap:4px}.paint-tool .icon{width:26px;height:26px}.paint-palette{grid-template-columns:repeat(4,minmax(0,1fr));padding:7px 3px;gap:0;border-radius:25px}.paint-swatch{min-width:0;min-height:35px}.paint-sizes{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.paint-custom-color{font-size:11px}.paint-tool-help{grid-column:1/-1;margin:0}.paint-save-status{grid-column:1/-1;margin:0}.paint-toolbox:has(.tool-water:not([hidden])){grid-template-columns:1fr}.paint-toolbox:has(.tool-water:not([hidden])) .paint-tools{grid-template-columns:repeat(2,1fr)}.paint-toolbox:has(.tool-water:not([hidden])) .paint-sizes{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:370px){.paint-intro-art{display:none}.paint-tools{grid-template-columns:repeat(3,minmax(0,1fr))}.paint-tool{min-height:61px}.paint-toolbox{padding:13px;gap:12px}.paint-palette{grid-template-columns:repeat(3,minmax(0,1fr))}.paint-topbar>.button span{max-width:48px;line-height:1.2}.paint-topbar h1{font-size:16px}}
/* Keep the palette within reach while painting on a phone. */
.paint-intro{overflow:clip}.paint-intro-art{margin-right:14px}
@media(max-width:700px){
 .painting-now>.container{padding-bottom:8px}.paint-workspace{gap:12px}.paint-board canvas{max-height:max(160px,calc(100dvh - 450px))}.paint-tip{display:none}
 .paint-toolbox{position:sticky;bottom:0;z-index:10;display:block;padding:10px 12px;border-radius:18px;background:#fffcf7fa;backdrop-filter:blur(8px);box-shadow:0 -4px 18px #60401e14}
 .paint-toolbox fieldset{margin:0 0 8px}.paint-toolbox legend{font-size:12px;font-family:Nunito,sans-serif;font-weight:850;margin-bottom:5px}
 .paint-tools{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.paint-tool{min-height:48px;padding:5px 2px;font-size:10px;gap:2px;border-radius:10px}.paint-tool .icon{width:22px;height:22px}
 .paint-color-picker{position:relative}.paint-palette{display:flex;gap:2px;overflow-x:auto;overscroll-behavior-x:contain;margin-right:48px;padding:2px 5px;border-radius:22px;scrollbar-width:thin}
 .paint-swatch{flex:0 0 40px;width:40px;height:40px;min-height:40px}.paint-custom-color{position:absolute;right:0;top:4px;margin:0;font-size:0}.paint-custom-color input{width:42px;height:42px}
 .paint-sizes{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.paint-sizes button{flex-direction:row;gap:3px;min-height:40px;padding:3px;font-size:10px}.paint-sizes svg{width:29px;height:29px}
 .paint-tool-help{display:none}.paint-save-status{font-size:10px;margin:0;line-height:1.3}
 #paint-studio[data-mode=water] .paint-board canvas{max-height:max(160px,calc(100dvh - 350px))}.paint-toolbox:has(.tool-water:not([hidden])) .paint-tools{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:370px){.paint-topbar>.button span{white-space:normal}}
.paint-guide{margin:60px auto 20px;max-width:1000px;padding:32px;background:#fff;border:1px solid #e8dff0;border-radius:24px}.paint-guide>p{max-width:800px;color:#736b7d}.paint-guide-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin:30px 0 40px}.paint-guide-modes .icon{width:35px;height:35px;color:#8b5cbe;margin-bottom:12px}.paint-guide h3{font-size:23px}.paint-guide-modes p{font-size:15px;color:#736b7d}.paint-guide details{border-top:1px solid #eee6f1;padding:16px 0}.paint-guide h2+details{margin-top:20px}.paint-guide summary{font-weight:850;min-height:30px}.paint-guide details p{color:#736b7d;line-height:1.7}
@media(max-width:700px){.paint-guide{padding:22px;margin-top:40px}.paint-guide h2{font-size:26px}.paint-guide-modes{grid-template-columns:1fr;gap:24px}.paint-guide-modes p{font-size:15px}}