/* Dog-shaped controls retain their native button semantics and live labels. */
:is(#newFromJournal,#draw){
 --dog-width:240px;
 position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;
 width:var(--dog-width);min-height:80px;max-width:100%;
 padding:28px 22px 20px 69px;
 border:0!important;border-radius:0!important;
 background:transparent url('assets/dachshund-button-no-mouth.webp') center/100% 100% no-repeat!important;
 box-shadow:none!important;color:#fff5de!important;
 font-family:Kalam,'Chalkboard SE',cursive!important;font-weight:700;font-size:16px;line-height:1.15;
 letter-spacing:0;text-align:center;text-decoration:none;text-shadow:0 1px 1px #38231655;
 transition:transform .18s ease,filter .18s ease;vertical-align:middle;
}
:is(#newFromJournal,#draw):hover:not(:disabled){transform:translateY(-3px) rotate(-1deg);filter:brightness(1.08)}
:is(#newFromJournal,#draw):active:not(:disabled){transform:translateY(1px)}
:is(#newFromJournal,#draw):focus-visible{outline:3px dashed #a76538;outline-offset:4px}
:is(#newFromJournal,#draw):disabled{opacity:.45;cursor:default;filter:saturate(.6)}

.journal-tools #newFromJournal{--dog-width:190px;min-height:66px;padding:24px 16px 16px 55px;font-size:14px}
@media(max-width:600px){.journal-tools #newFromJournal{--dog-width:180px;min-height:64px}}
@media(prefers-reduced-motion:reduce){:is(#newFromJournal,#draw){transition:none!important}}

:is(#newFromJournal,#draw).dog-puppet-ready{background-image:none!important}
.dog-puppet{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:visible;pointer-events:none}
.dog-leg{transform-box:view-box}