:root{--ink:#17211c;--paper:#f1eee6;--cream:#faf8f1;--acid:#d9ff54;--orange:#ff6c35;--blue:#2446d8;--line:rgba(23,33,28,.16)}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:"DM Sans",sans-serif;color:var(--ink);background:var(--paper)}button,input{font:inherit}[v-cloak]{display:none}.topbar{position:fixed;z-index:20;left:0;right:0;top:0;height:76px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 28px;background:rgba(250,248,241,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.brand{justify-self:start;display:flex;gap:12px;align-items:center;color:var(--ink);font-family:Syne,sans-serif;font-weight:800;text-decoration:none;font-size:19px;letter-spacing:-.04em}.brand-mark{width:28px;height:28px;position:relative;display:block}.brand-mark i{position:absolute;width:14px;height:14px;border:2px solid var(--ink);border-radius:50%}.brand-mark i:nth-child(1){left:1px;top:1px;background:var(--acid)}.brand-mark i:nth-child(2){right:1px;top:1px;background:var(--orange)}.brand-mark i:nth-child(3){left:7px;bottom:0;background:#8aa4ff}.topbar-center{display:flex;gap:7px;align-items:center;font-size:12px;color:#69716d;text-transform:uppercase;letter-spacing:.08em}.topbar-center strong{color:var(--ink)}.live-dot{width:7px;height:7px;border-radius:50%;background:#6c9d27;box-shadow:0 0 0 4px rgba(108,157,39,.13)}.primary-button,.hero-button,.continue-button{border:0;background:var(--ink);color:white;cursor:pointer;font-weight:700}.primary-button{justify-self:end;padding:11px 13px 11px 18px;border-radius:5px;display:flex;gap:20px;align-items:center}.primary-button span{color:var(--acid);font-size:19px}.world-shell{position:fixed;inset:76px 0 0;overflow:hidden;cursor:grab;background-color:var(--paper);background-image:linear-gradient(rgba(23,33,28,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(23,33,28,.045) 1px,transparent 1px);background-size:40px 40px}.world-shell:active{cursor:grabbing}.world{position:absolute;inset:0}.world canvas{display:block}.grain{position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E")}.canvas-guide{position:absolute;border:1px dashed rgba(23,33,28,.28);pointer-events:none;box-shadow:0 0 0 10000px rgba(241,238,230,.34)}.empty-state{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-48%);width:min(620px,calc(100% - 40px));text-align:center;pointer-events:none}.empty-state>*{pointer-events:auto}.eyebrow,.step{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.eyebrow{background:var(--acid);padding:6px 10px;transform:rotate(-2deg)}h1,h2{font-family:Syne,sans-serif;margin:0;letter-spacing:-.065em}h1{font-size:clamp(52px,8vw,96px);line-height:.82;margin:22px 0}h1 em{font-style:normal;color:var(--orange)}.empty-state p{width:min(460px,100%);margin:0 auto 28px;color:#58615c;font-size:16px;line-height:1.55}.hero-button{border-radius:4px;padding:15px 18px;display:inline-flex;gap:28px;font-size:14px}.hero-button span{color:var(--acid)}.zoom-controls{position:absolute;z-index:8;right:22px;bottom:22px;display:grid;width:46px;background:rgba(250,248,241,.95);border:1px solid var(--line);border-radius:6px;box-shadow:0 8px 30px rgba(23,33,28,.12);overflow:hidden}.zoom-controls button{height:42px;border:0;border-bottom:1px solid var(--line);background:transparent;cursor:pointer;font-size:19px}.zoom-controls span{text-align:center;font-size:9px;font-weight:700;padding:8px 0;border-bottom:1px solid var(--line)}.zoom-controls .fit{border:0}.helper{position:absolute;z-index:8;left:24px;bottom:24px;display:flex;align-items:center;gap:10px;font-size:11px;color:#6a716e;text-transform:uppercase;letter-spacing:.08em}.helper i{width:3px;height:3px;background:var(--orange);border-radius:50%}.loading-card,.error-card,.placement-hint{position:absolute;z-index:15;left:50%;transform:translateX(-50%);background:var(--ink);color:white;border-radius:5px;box-shadow:0 10px 40px rgba(23,33,28,.2)}.loading-card,.error-card{top:24px;padding:11px 15px;font-size:13px}.error-card button{margin-left:10px}.spinner{display:inline-block;width:10px;height:10px;border:2px solid #fff;border-top-color:var(--acid);border-radius:50%;animation:spin .8s linear infinite;margin-right:7px}.placement-hint{top:22px;padding:10px 16px;text-align:center}.placement-hint strong,.placement-hint span{display:block}.placement-hint span{font-size:10px;color:#bdc5c0;margin-top:2px}.modal-backdrop{position:fixed;z-index:40;inset:0;background:rgba(20,27,23,.62);backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px}.studio{width:min(820px,100%);max-height:calc(100vh - 40px);overflow:auto;background:var(--cream);border-radius:8px;padding:30px;position:relative;box-shadow:0 30px 100px rgba(0,0,0,.3)}.close-button{position:absolute;right:20px;top:18px;width:34px;height:34px;border:1px solid var(--line);background:transparent;border-radius:50%;font-size:22px;cursor:pointer}.studio-intro{text-align:center}.studio-intro .step{color:var(--orange)}.studio h2{font-size:clamp(38px,5vw,58px);margin:7px 0 4px}.studio-intro p{margin:0 0 22px;color:#69716d}.tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line);margin-bottom:18px}.tabs button{border:0;background:none;padding:12px;cursor:pointer;font-weight:700;color:#89908c;border-bottom:3px solid transparent}.tabs button.active{color:var(--ink);border-color:var(--orange)}.drawing-wrap{position:relative}.drawing-wrap canvas{display:block;width:100%;aspect-ratio:720/440;background:white;border:1px solid var(--line);border-radius:5px;touch-action:none;cursor:crosshair}.tools{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);height:46px;padding:6px;display:flex;align-items:center;gap:4px;background:rgba(23,33,28,.92);border-radius:6px}.colour-picker input{position:absolute;opacity:0}.colour-picker span{display:block;width:28px;height:28px;border:3px solid white;border-radius:50%;cursor:pointer}.brush-size{width:33px;height:33px;display:grid;place-items:center;border:0;border-radius:4px;background:transparent;cursor:pointer}.brush-size.active{background:rgba(255,255,255,.15)}.brush-size i{display:block;max-width:22px;max-height:22px;border-radius:50%;background:white}.tool-text{border:0;border-left:1px solid rgba(255,255,255,.2);background:none;color:white;font-size:11px;cursor:pointer;padding:7px 9px}.dropzone{height:310px;border:1.5px dashed #8d958f;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;background:#fff;overflow:hidden}.dropzone input{position:absolute;opacity:0;pointer-events:none}.dropzone img{width:100%;height:100%;object-fit:contain;background:#f3f1eb}.upload-icon{font-size:32px;color:var(--orange)}.dropzone strong{font-family:Syne,sans-serif;font-size:18px;margin:8px}.dropzone small{color:#777f7a}.details-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.details-row label span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-bottom:6px}.details-row label small{color:#919792;text-transform:none;letter-spacing:0;font-weight:400}.details-row input{width:100%;height:44px;border:1px solid var(--line);background:white;border-radius:4px;padding:0 12px;outline:none}.details-row input:focus{border-color:var(--orange)}.form-error{color:#bb351d;font-size:12px;margin:10px 0 0}.continue-button{width:100%;margin-top:18px;padding:14px 18px;border-radius:4px;display:flex;justify-content:space-between}.continue-button span{color:var(--acid)}.toast{position:fixed;z-index:60;left:50%;bottom:25px;transform:translateX(-50%);padding:12px 18px;background:var(--ink);color:#fff;border-radius:5px;font-size:13px}.fade-enter-active,.fade-leave-active{transition:opacity .2s}.fade-enter-from,.fade-leave-to{opacity:0}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:700px){.topbar{height:66px;padding:0 14px;grid-template-columns:1fr auto}.topbar-center{display:none}.brand{font-size:17px}.world-shell{inset:66px 0 0}.primary-button{padding:9px 10px 9px 13px;gap:10px}.helper{display:none}.studio{padding:24px 16px}.details-row{grid-template-columns:1fr}.drawing-wrap canvas,.dropzone{height:280px;aspect-ratio:auto}.zoom-controls{right:14px;bottom:14px}.empty-state{top:45%}}
.world-shell.is-placing,.world-shell.is-placing:active{cursor:none}.placement-pointer{position:absolute;z-index:18;pointer-events:none;transform:translate(-100%,-100%);filter:drop-shadow(0 3px 6px rgba(23,33,28,.2))}.placement-pointer div{display:flex;align-items:flex-end;gap:7px;transform:translate(-8px,-7px)}.placement-pointer strong{display:block;padding:7px 9px;background:var(--acid);border:2px solid var(--ink);color:var(--ink);font-family:Syne,sans-serif;font-size:10px;line-height:1;letter-spacing:.08em;white-space:nowrap;transform:rotate(-2deg)}.placement-pointer span{font-family:Syne,sans-serif;color:var(--ink);font-size:42px;font-weight:800;line-height:.7}
.world-shell{background:#fff;background-image:none}.grain{display:none}.placement-pointer.blocked strong{background:var(--orange);color:#fff}.placement-pointer.blocked span{color:var(--orange)}
.dropzone{transition:border-color .16s,background-color .16s,transform .16s}.dropzone.dragging{border-color:var(--orange);background:#fff7f2;transform:scale(.995)}.dropzone.dragging .upload-icon{transform:translateY(-4px)}.upload-icon{transition:transform .16s}
.continue-button:disabled{opacity:.58;cursor:wait}
.tools{position:static;left:auto;bottom:auto;transform:none;width:100%;height:auto;min-height:50px;margin-top:10px;padding:7px 9px;justify-content:center;flex-wrap:wrap;background:rgba(23,33,28,.95)}.tool-divider{width:1px;height:28px;background:rgba(255,255,255,.2);margin:0 5px}.zoom-label{color:#aeb5b1;font-size:9px;text-transform:uppercase;letter-spacing:.08em;margin:0 4px}.drawing-zoom{width:30px;height:30px;border:0;border-radius:4px;background:rgba(255,255,255,.1);color:#fff;cursor:pointer}.drawing-zoom:disabled{opacity:.35;cursor:not-allowed}.zoom-readout{width:35px;color:#fff;text-align:center;font-size:10px;font-weight:700}
.canvas-guide{border:1px solid rgba(23,33,28,.28);border-radius:24px}
.tools{position:relative}.custom-colour-picker{position:relative;display:grid;place-items:center}.colour-picker-button{display:block;width:28px;height:28px;padding:0;border:3px solid #fff;border-radius:50%;cursor:pointer}.colour-popover{position:absolute;z-index:4;left:0;bottom:calc(100% + 12px);width:190px;padding:10px;background:#17211c;border-radius:7px;box-shadow:0 10px 35px rgba(0,0,0,.28)}.colour-field{position:relative;width:170px;height:120px;border-radius:4px;cursor:crosshair;touch-action:none;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent)}.colour-field i{position:absolute;width:12px;height:12px;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px rgba(0,0,0,.45);pointer-events:none}.hue-slider{display:block;width:100%;height:14px;margin:9px 0 7px;appearance:none;background:linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00);border-radius:10px;cursor:pointer}.hue-slider::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border:2px solid #fff;border-radius:50%;background:transparent;box-shadow:0 0 0 1px rgba(0,0,0,.45)}.colour-done{display:block;margin-left:auto;padding:3px 7px;border:0;border-radius:3px;background:var(--acid);color:var(--ink);font-size:10px;font-weight:700;cursor:pointer}.brush-scale{position:relative;display:flex;align-items:center;gap:7px;color:#fff;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.brush-scale input{width:110px;accent-color:var(--acid);cursor:pointer}.brush-scale output{min-width:22px;color:var(--acid);font-variant-numeric:tabular-nums}.brush-preview{position:absolute;left:55%;bottom:calc(100% + 16px);width:78px;height:78px;transform:translateX(-50%);display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;background:#fff;box-shadow:0 10px 30px rgba(23,33,28,.2);pointer-events:none}.brush-preview i{display:block;border-radius:50%;box-shadow:0 0 0 1px rgba(23,33,28,.15)}.brush-preview-enter-active,.brush-preview-leave-active{transition:opacity .14s,transform .14s}.brush-preview-enter-from,.brush-preview-leave-to{opacity:0;transform:translateY(5px)}.details-row{grid-template-columns:repeat(3,1fr)}.submit-row{display:flex;justify-content:center}.submit-row .continue-button{width:auto;min-width:170px;margin-top:18px;gap:24px;align-items:center;justify-content:center}.submit-row .continue-button span{font-size:18px}@media(max-width:700px){.details-row{grid-template-columns:1fr}.brush-scale input{width:min(180px,45vw)}}
.brush-preview-enter-from,.brush-preview-leave-to{transform:translateX(-50%) translateY(5px)}
.brush-preview{background-color:#fff;background-image:linear-gradient(45deg,#e7e7e7 25%,transparent 25%),linear-gradient(-45deg,#e7e7e7 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e7e7e7 75%),linear-gradient(-45deg,transparent 75%,#e7e7e7 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0}.brush-preview i{box-shadow:none;outline:none}
.brush-preview{background:#fff;background-image:none}.brush-preview i{box-shadow:none;outline:none}
.brush-controls{position:relative;display:grid;gap:5px;padding:2px 0}.brush-controls .brush-scale>span:first-child{width:92px;white-space:nowrap;text-align:right}.brush-controls .brush-scale output{width:34px;text-align:right}.brush-controls .brush-preview{left:50%;bottom:calc(100% + 16px)}
.tabs{gap:8px;border:0}.tabs button{border:1px solid var(--line);border-radius:5px;background:#fff;color:#69716d;transition:background .14s,border-color .14s,color .14s,transform .14s}.tabs button:hover{border-color:rgba(23,33,28,.38);color:var(--ink);transform:translateY(-1px)}.tabs button.active{border-color:var(--ink);background:var(--ink);color:#fff}.tabs button.active:hover{transform:none}
.custom-colour-picker{display:flex;align-items:center;gap:7px}.colour-picker-label{color:#fff;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.eraser-button{height:32px;padding:0 9px;border:1px solid rgba(255,255,255,.2);border-radius:4px;background:transparent;color:#fff;display:flex;align-items:center;gap:7px;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background .14s,border-color .14s,color .14s}.eraser-button:hover{border-color:rgba(255,255,255,.48);background:rgba(255,255,255,.08)}.eraser-button.active{border-color:var(--acid);background:var(--acid);color:var(--ink)}.eraser-icon{display:block;width:12px;height:8px;border:1.5px solid currentColor;border-radius:2px;transform:rotate(-35deg)}.brush-preview i.eraser{box-shadow:inset 0 0 0 1px rgba(23,33,28,.25)}
.tool-text:disabled{opacity:.35;cursor:not-allowed}
.history-controls{display:grid;align-self:stretch}.history-controls .tool-text{padding-top:1px;padding-bottom:1px;line-height:1}.history-controls .tool-text+.tool-text{border-top:1px solid rgba(255,255,255,.2)}
.drawing-zoom-controls{display:flex;align-items:center;gap:4px;flex:none}.tools{flex-wrap:nowrap}.brush-scale input{width:90px}.brush-controls .brush-scale>span:first-child{width:84px}@media(max-width:700px){.tools{flex-wrap:wrap}.brush-scale input{width:min(180px,45vw)}.brush-controls .brush-scale>span:first-child{width:92px}}
.topbar-actions{justify-self:end;display:flex;align-items:center;gap:8px}.topbar-actions .primary-button{justify-self:auto}.gallery-button{display:flex;align-items:center;padding:10px 13px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--ink);font-size:12px;font-weight:700;text-decoration:none;transition:border-color .16s,transform .16s}.gallery-button:hover{border-color:var(--ink);transform:translateY(-1px)}@media(max-width:700px){.topbar-actions{gap:5px}.gallery-button{padding:9px}}
.topbar-actions .gallery-button,.topbar-actions .primary-button{height:42px;font-family:"DM Sans",sans-serif;font-size:14px;font-weight:700;letter-spacing:0;line-height:1;text-transform:none}.topbar-actions .gallery-button{justify-content:center;padding:0 18px}@media(max-width:700px){.topbar-actions .gallery-button,.topbar-actions .primary-button{height:40px}.topbar-actions .gallery-button{padding:0 12px}}

.world-shell{touch-action:none}.brush-style{display:grid;gap:5px;color:white;font-size:10px;text-transform:uppercase;letter-spacing:.06em}.brush-style select{font:inherit;text-transform:none;letter-spacing:0;border:1px solid #ffffff40;border-radius:4px;background:#28332c;color:white;padding:5px;max-width:125px}.tools{flex-wrap:wrap;gap:8px}.brush-preview i.soft{mask-image:radial-gradient(circle,#000 0%,transparent 70%)}.brush-preview i.textured{mask-image:repeating-linear-gradient(75deg,#000 0 1px,#0004 1px 3px,transparent 3px 4px)}button:focus-visible,select:focus-visible{outline:2px solid var(--orange);outline-offset:3px}

.artwork-overlay{position:absolute;z-index:6;pointer-events:none}.artwork-love{position:absolute;right:0;top:calc(100% + 4px);display:flex;flex-direction:row-reverse;align-items:flex-end;justify-content:center;gap:3px;min-width:0;height:auto;padding:0;border:0;border-radius:0;background:transparent;color:#c74646;box-shadow:none;font-size:10px;font-weight:600;line-height:1;opacity:0;pointer-events:none;cursor:pointer;transition:opacity .15s,background .15s}.artwork-love.visible,.artwork-love:focus-visible{opacity:1;pointer-events:auto}.artwork-love svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}.artwork-love.visible:has(span) svg,.artwork-love.loved svg{fill:currentColor}.artwork-love span{color:#99908f;font-weight:400}.artwork-love.loved{background:transparent;border-color:transparent;color:#c74646}.artwork-love:hover{background:transparent;color:#b73535}.artwork-love:disabled{cursor:wait;opacity:.6}@media(hover:none){.artwork-love{opacity:1;pointer-events:auto}}

.brush-style{position:relative;flex:none}.brush-style-trigger{display:flex;align-items:center;justify-content:space-between;width:86px;height:28px;padding:2px 6px;border:1px solid #ffffff40;border-radius:4px;background:#28332c;color:white;cursor:pointer}.brush-style-trigger img{width:60px;height:22px;object-fit:contain}.brush-style-trigger>span{font-size:14px}.brush-style-popover{position:absolute;z-index:5;bottom:calc(100% + 12px);left:50%;transform:translateX(-50%);display:grid;grid-template-columns:repeat(3,1fr);gap:6px;width:274px;max-width:calc(100vw - 48px);padding:10px;background:var(--ink);border:1px solid #ffffff20;border-radius:8px;box-shadow:0 10px 35px #0005}.brush-style-popover button{display:grid;justify-items:center;gap:5px;min-width:0;padding:8px 4px;border:1px solid #ffffff25;border-radius:5px;background:#ffffff08;color:white;font:inherit;cursor:pointer}.brush-style-popover button:hover{background:#ffffff18}.brush-style-popover button.active{border-color:var(--acid);color:var(--acid)}.brush-style-popover img{width:100%;height:30px;object-fit:contain}.brush-controls .brush-scale input{width:68px}.history-controls{grid-template-rows:repeat(3,1fr);flex:none}.history-controls .tool-text{padding:3px 8px;font-size:10px}.tools{gap:6px}.tool-divider{margin:0 3px}@media(max-width:700px){.brush-controls .brush-scale input{width:78px}.brush-style-popover{left:0;transform:none}}

.brush-style-trigger{justify-content:center;gap:12px}.brush-style-trigger img{width:23px;height:23px}.brush-style-popover{grid-template-columns:repeat(2,minmax(0,1fr));width:206px}.brush-style-popover img{width:56px;height:56px}.brush-style-popover button{padding:10px 6px;gap:8px}

.brush-style-trigger{width:108px;height:30px;gap:6px;padding:3px 6px;justify-content:flex-start;background:#ffffff0a}.brush-style-trigger img{width:23px;height:23px;padding:3px;background:#faf8f1;border-radius:3px}.brush-style-trigger .brush-current-name{font-size:10px;text-transform:none;letter-spacing:0;white-space:nowrap}.brush-chevron{width:12px;height:12px;margin-left:auto;flex:none}.brush-style-trigger:hover,.brush-style-trigger[aria-expanded=true]{border-color:#ffffff80;background:#ffffff12}.brush-style-popover{background:#faf8f1;border:1px solid #d9ddd8;box-shadow:0 8px 24px #0003}.brush-style-popover button{color:#59615b;background:#fff;border:1px solid #dde0da}.brush-style-popover button:hover{background:#f0f2ec}.brush-style-popover button.active{color:#17211c;border-color:#65745d;background:#edf1e7}.brush-style-popover img{padding:4px}

.brush-style-trigger{background:#fff;color:#26312b;border-color:#d9ddd8}.brush-style-trigger img{background:transparent;border-radius:0}.brush-style-trigger:hover,.brush-style-trigger[aria-expanded=true]{background:#f4f6f1;border-color:#aab5a5}

.tools{justify-content:space-between;padding:8px 16px;column-gap:6px;row-gap:10px}@media(max-width:700px){.tools{padding:10px 14px;justify-content:center;gap:10px}}

.artwork-actions{position:absolute;left:50%;transform:translateX(-50%);width:max-content;top:calc(100% + 4px);display:flex;align-items:center;gap:6px;opacity:0;pointer-events:none;transition:opacity .15s}.artwork-actions.visible,.artwork-actions:focus-within{opacity:1;pointer-events:auto}.artwork-actions button{display:flex;flex-direction:row-reverse;align-items:center;gap:3px;padding:0;border:0;background:transparent;font-size:10px;line-height:1;cursor:pointer}.artwork-actions svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.artwork-actions span{color:#99908f;font-weight:400}.artwork-actions .artwork-love{position:static;opacity:1;pointer-events:auto}.artwork-actions .artwork-love.loved svg{fill:currentColor}.artwork-comment{color:#53645a}.artwork-comment:hover{color:var(--ink)}@media(hover:none){.artwork-actions{opacity:1;pointer-events:auto}}
.comment-backdrop{z-index:45}.comment-dialog{position:relative;display:grid;grid-template-columns:minmax(230px,.85fr) minmax(320px,1.15fr);grid-template-rows:minmax(0,1fr);width:min(820px,100%);height:min(590px,calc(100vh - 40px));overflow:hidden;background:var(--cream);border-radius:10px;box-shadow:0 30px 100px rgba(0,0,0,.32)}.comment-dialog>.close-button{z-index:2;background:rgba(250,248,241,.9)}.comment-artwork{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:auto;padding:28px;background:#fff}.comment-artwork img{width:100%;height:0;min-height:0;flex:1 1 0;object-fit:contain}.comment-artwork>div{flex-shrink:0;padding-top:20px;overflow-wrap:anywhere}.comment-artwork .step{color:var(--orange)}.comment-artwork h2{margin:5px 0 3px;font-size:clamp(28px,4vw,42px);line-height:.95}.comment-artwork p{margin:0;color:#69716d;font-size:12px}.comment-thread{display:grid;grid-template-rows:minmax(0,1fr) auto;min-width:0;min-height:0;overflow:auto;padding:64px 28px 24px;background:var(--cream)}.comment-list{min-height:0;overflow:auto;padding-right:7px}.comment-status,.comment-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#7a827d;text-align:center;font-size:13px}.comment-status{flex-direction:row}.comment-empty strong{color:var(--ink);font-family:Syne,sans-serif;font-size:20px;margin-bottom:6px}.comment-item{padding:0 0 20px}.comment-item:last-child{padding-bottom:4px}.comment-content{min-width:0}.comment-meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 10px;padding:0 3px}.comment-meta strong{font-size:12px;font-weight:600;color:#28382e;overflow-wrap:anywhere}.comment-meta time{color:#8b9189;font-size:10px;white-space:nowrap}.comment-item p{display:table;max-width:100%;margin:7px 0 0;padding:12px 15px;border-radius:3px 14px 14px 14px;background:#fff;color:#46504a;font-size:13px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:0 1px 2px #17211c06}.comment-form{padding-top:18px}.comment-form input,.comment-form textarea{display:block;width:100%;border:1px solid var(--line);border-radius:5px;background:#faf9f6;padding:10px 11px;outline:none;font-size:12px}.comment-form input{height:38px;margin-bottom:7px}.comment-form textarea{resize:none}.comment-form input:focus,.comment-form textarea:focus{border-color:#819078;background:#fff}.comment-form .form-error{margin:8px 0 0}
@media(max-width:700px){.comment-dialog{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);height:min(680px,calc(100vh - 24px))}.comment-artwork{display:grid;grid-template-columns:92px 1fr;gap:15px;align-items:center;padding:18px 56px 18px 18px}.comment-artwork img{width:92px;height:82px}.comment-artwork>div{padding:0}.comment-artwork h2{font-size:25px}.comment-thread{padding:22px 18px 18px}.comment-dialog>.close-button{right:12px;top:12px}}
.comment-form textarea{min-height:140px;padding:13px 14px;font:inherit;font-size:14px;line-height:1.5;background:#fff}
#comment-title{font-size:24px;line-height:1.15;letter-spacing:-.035em}
.artwork-actions{top:calc(100% + var(--artwork-action-gap,3px));transform:translateX(-50%) scale(var(--artwork-scale,1));transform-origin:top center;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.artwork-actions .artwork-comment{gap:2px}
.artwork-actions{gap:3px}
.artwork-actions:not(:has(button span)){gap:6px}
.artwork-actions button{position:static;flex:none;width:var(--action-width,12px);height:12px;min-width:0;justify-content:flex-start;overflow:visible;white-space:nowrap;font-variant-numeric:tabular-nums;transform:translateX(0);transition:transform .22s ease,opacity .18s ease,color .2s ease}
.artwork-actions svg,.artwork-actions span{flex:none}
.artwork-actions button:not(.visible){opacity:0;pointer-events:none}
.artwork-actions:hover button,.artwork-actions:focus-within button{opacity:1;pointer-events:auto}
.artwork-actions:not(:hover):not(:focus-within):has(.artwork-comment:not(.visible)) .artwork-love.visible{transform:translateX(-7.5px)}
.artwork-actions:not(:hover):not(:focus-within):has(.artwork-love:not(.visible)) .artwork-comment.visible{transform:translateX(7.5px)}
@media(prefers-reduced-motion:reduce){.artwork-actions button{transition:none}}
@media(hover:none){.artwork-actions:not(.visible){opacity:0;pointer-events:none}}
.comment-thanks{margin-top:18px;padding:20px 16px;border-radius:8px;background:#eef1e9;color:#354c3d;text-align:center;font-size:14px;font-weight:500;outline:none}
.comment-submit-row{display:flex;justify-content:flex-end;margin-top:12px}
.comment-form button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:11px 20px;border:1px solid #26382d;border-radius:8px;background:#26382d;color:#fff;font:inherit;font-size:13px;font-weight:600;line-height:1.2;box-shadow:0 2px 4px #17211c12;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}
.comment-form button:hover:not(:disabled){background:#354c3d;border-color:#354c3d;box-shadow:0 3px 8px #17211c20}
.comment-form button:disabled{background:#dce1d9;border-color:#dce1d9;color:#667060;box-shadow:none;cursor:not-allowed}