.paint-studio{max-width:1100px;margin:0 auto 30px;display:grid;grid-template-columns:250px minmax(0,1fr);gap:24px;align-items:start}.paint-controls{background:#fffaf3;border:2px solid #e9bdc6;border-radius:22px;padding:18px;position:sticky;top:12px}.paint-controls h2{font:400 24px Georgia,serif;margin:0 0 14px}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}.palette button{width:44px;height:44px;border:2px solid #ffffff;border-radius:50%;box-shadow:0 0 0 1px #ccb5c1;cursor:pointer}.palette button[aria-pressed=true]{outline:3px solid #522445;outline-offset:2px}.paint-tools{display:flex;gap:8px;flex-wrap:wrap}.paint-tools button,.paint-actions button{font:inherit;font-size:14px;min-height:44px;border:1px solid #dab3c0;border-radius:14px;background:white;color:#522445;padding:10px 12px;cursor:pointer}.paint-tools button[aria-pressed=true]{background:#a45370;color:white}.paint-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.paint-actions button:last-child{background:#a45370;color:white}.paint-controls label{display:block;font-size:14px;margin:16px 0 8px}.paint-controls input{width:100%;accent-color:#a45370}.paint-paper{background:white;padding:8px;border:1px solid #e5cfda;border-radius:18px;overflow:hidden;box-shadow:0 5px 20px #5224450a}.paint-paper canvas{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair}.paint-controls button:focus-visible{outline:3px solid #522445;outline-offset:3px}.paint-controls button:disabled{opacity:.45;cursor:default}#paint-status{font-size:13px;line-height:1.6;color:#735569;min-height:42px}.paint-tip{text-align:center;color:#735569;font-size:14px;line-height:1.7;margin:0 auto 24px}.paint-feature{margin-bottom:28px}.paint-feature img{max-height:300px;object-fit:contain}.paint-paper:focus-within{outline:2px solid #a45370}@media(max-width:750px){.paint-studio{display:flex;flex-direction:column;gap:16px}.paint-controls{position:static;width:100%;box-sizing:border-box}.palette{display:flex;flex-wrap:wrap;gap:12px}.paint-paper{width:100%;box-sizing:border-box}.paint-controls h2{font-size:22px}.paint-controls input{max-width:250px}.paint-controls label{display:inline-block;margin-right:12px}#paint-status{min-height:0;margin-bottom:0}}
.palette button{box-sizing:border-box;padding:0;min-width:0;max-width:100%}.palette{grid-template-columns:repeat(4,minmax(0,1fr))}.paint-feature+.featured-book{margin-top:24px}
.paint-toolbar{grid-column:1/-1;display:flex;justify-content:flex-end}.paint-toolbar button{font:inherit;min-height:44px;border:1px solid #dab3c0;border-radius:22px;background:#fffaf3;color:#522445;padding:10px 18px;cursor:pointer}.paint-toolbar button:focus-visible{outline:3px solid #522445;outline-offset:3px}.paint-expanded{overflow:hidden}.paint-studio.is-expanded{position:fixed;inset:0;z-index:10000;max-width:none;margin:0;padding:12px;box-sizing:border-box;background:#fff9f3;display:grid;grid-template-columns:230px minmax(0,1fr);grid-template-rows:48px minmax(0,1fr);gap:12px;height:100dvh}.is-expanded .paint-controls{position:static;min-height:0;max-height:100%;overflow:auto;box-sizing:border-box;width:100%}.is-expanded .paint-paper{height:100%;min-height:0;min-width:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center}.is-expanded .paint-paper canvas{flex:none;max-width:100%;max-height:100%}.is-expanded .palette{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.is-expanded .palette button{width:38px;height:38px}.is-expanded .paint-controls h2{font-size:22px}@media(max-width:650px){.paint-studio.is-expanded{grid-template-columns:156px minmax(0,1fr);gap:8px;padding:8px}.is-expanded .paint-controls{padding:10px}.is-expanded .palette{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.is-expanded .palette button{width:34px;height:34px}.is-expanded .paint-controls h2{font-size:18px}.is-expanded .paint-tools button,.is-expanded .paint-actions button{font-size:12px;padding:8px;min-height:44px}.is-expanded .paint-paper{padding:3px}.is-expanded #paint-status{font-size:12px}}

.picture-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:240px;overflow:auto;padding:5px;margin:0 0 12px}.picture-picker button{border:1px solid #dcb7c5;border-radius:12px;background:white;padding:7px 4px;color:#522445;cursor:pointer;min-width:0;font:inherit;font-size:12px;line-height:1.3}.picture-picker button[aria-pressed=true]{outline:2px solid #a45370;outline-offset:1px;background:#fff1f6}.picture-picker img{display:block;width:100%;height:76px;object-fit:contain;margin-bottom:5px}.picture-name{font-size:14px;font-weight:600;color:#735569;margin:10px 0 16px}.paint-controls{max-height:calc(100dvh - 24px);overflow:auto}.is-expanded .picture-picker{max-height:190px}.is-expanded .picture-picker img{height:54px}@media(max-width:750px){.paint-controls{max-height:none}.picture-picker{grid-template-columns:repeat(4,minmax(0,1fr));max-height:210px}.is-expanded .picture-picker{grid-template-columns:repeat(2,minmax(0,1fr));max-height:165px}.is-expanded .picture-picker img{height:48px}}
.picture-menu summary{font:400 22px Georgia,serif;color:#522445;cursor:pointer;min-height:44px;display:list-item;line-height:1.6}.picture-menu summary:focus-visible{outline:3px solid #522445;outline-offset:3px}.picture-menu[open]{margin-bottom:12px}