/* A dedicated play strip keeps Sparky out of the stories and their controls. */
.sparky-companion{display:flex;align-items:center;gap:20px;max-width:1180px;margin:0 auto;padding:8px 24px 0;border-bottom:1px solid var(--line,#ccd4db);color:var(--ink,#16181b);font:700 14px/1.4 Arial,Helvetica,sans-serif}
.sparky-playground{position:relative;flex:1;min-width:100px;height:110px;max-width:520px;overflow:hidden}
.sparky-sprite{position:absolute;bottom:0;left:0;width:90px;height:97.745px;background-image:url('assets/sparky-spritesheet.png');background-size:800% 1100%;background-repeat:no-repeat;will-change:transform,background-position;pointer-events:none}
.sparky-caption{margin-right:auto;white-space:nowrap;letter-spacing:.02em}
.sparky-controls{display:flex;gap:8px;flex-wrap:wrap}
.sparky-controls button{min-height:44px;padding:8px 12px;border:1px solid currentColor;background:transparent;border-radius:4px;color:inherit;font:700 14px/1.4 Arial,Helvetica,sans-serif;cursor:pointer}
.sparky-controls button:hover{text-decoration:underline;text-underline-offset:3px}
.sparky-controls button:focus-visible{outline:3px solid var(--blue,#214ae8);outline-offset:3px}
.sparky-controls button:disabled{cursor:default;opacity:.65;text-decoration:none}
.sparky-companion[data-hidden="true"]{padding-top:8px;padding-bottom:8px;justify-content:flex-end}
.sparky-companion[data-hidden="true"] .sparky-playground,.sparky-companion[data-hidden="true"] .sparky-caption,.sparky-companion[data-hidden="true"] .sparky-pause{display:none}
@media(max-width:600px){.sparky-companion{padding-left:16px;padding-right:16px;gap:10px;flex-wrap:wrap}.sparky-playground{height:94px;flex-basis:calc(100% - 90px);max-width:none}.sparky-sprite{width:78px;height:84.712px}.sparky-caption{margin-right:0}.sparky-controls{width:100%;justify-content:flex-end;margin-top:-4px;margin-bottom:8px}.sparky-companion[data-hidden="true"] .sparky-controls{margin:0}}
@media(prefers-reduced-motion:reduce){.sparky-sprite{will-change:auto}}
@media print{.sparky-companion{display:none!important}}
/* Embedded reporter portraits: part of the page, never floating over its text. */
.sparky-profile-layout{grid-template-columns:210px minmax(0,1fr) 240px;align-items:start}
.sparky-profile,.sparky-inline{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;border:0;max-width:none}
.sparky-profile .sparky-playground{flex:none;width:190px;height:210px;min-width:0;max-width:none;overflow:hidden}
.sparky-profile .sparky-sprite{width:190px;height:206.35px}
.sparky-profile .sparky-controls,.sparky-inline .sparky-controls{width:100%;justify-content:center;margin:0;gap:6px}
.sparky-profile .sparky-controls button,.sparky-inline .sparky-controls button{padding:7px 9px;min-height:44px;font-size:12px}
.sparky-inline .sparky-playground{flex:none;width:128px;height:143px;min-width:0;max-width:none}
.sparky-inline .sparky-sprite{width:128px;height:139.015px}
.sparky-inline .sparky-controls{max-width:180px}
.sparky-with-note{display:grid;grid-template-columns:160px minmax(0,1fr);gap:28px;align-items:center}
.sparky-note-copy{min-width:0}
.notebook [data-sparky-place]{padding-top:20px;margin-top:20px;border-top:1px solid currentColor}
.sparky-between-sections{margin:24px 0 34px}
.sparky-companion.sparky-profile[data-hidden="true"],.sparky-companion.sparky-inline[data-hidden="true"]{padding:0}
@media(max-width:1100px){.sparky-profile-layout{grid-template-columns:190px minmax(0,1fr);gap:26px}.sparky-profile-layout>.question{grid-column:2}}
@media(max-width:600px){.sparky-profile-layout{grid-template-columns:1fr;gap:22px}.sparky-profile-layout>.question{grid-column:auto}.sparky-profile-layout>[data-sparky-place]{justify-self:center;width:210px}.sparky-with-note{grid-template-columns:1fr;gap:22px}.sparky-with-note>[data-sparky-place]{justify-self:start}.sparky-inline .sparky-controls,.sparky-profile .sparky-controls{margin:0}.sparky-profile .sparky-playground,.sparky-inline .sparky-playground{flex-basis:auto}}
@media print{[data-sparky-place]{display:none!important}.sparky-profile-layout{display:block!important}.sparky-with-note{display:block!important}}
/* Profile: generous left-aligned copy, with Sparky perched on his status box. */
#sparky .sparky-profile-layout{grid-template-columns:minmax(0,1fr) 280px;gap:44px;text-align:left;align-items:start}
.sparky-profile-copy{min-width:0}
.sparky-profile-card{min-width:0;width:100%;align-self:start}
.sparky-profile-card .sparky-profile{gap:0}
.sparky-profile-card .sparky-playground{height:207px;margin-bottom:-3px;z-index:1}
.sparky-profile-card .question{margin:0;width:100%;box-sizing:border-box;text-align:left}
.sparky-profile-controls .sparky-controls{justify-content:flex-start;gap:8px;margin:12px 0 0}
.sparky-profile-controls button{font-size:12px;padding:7px 9px}
.sparky-profile-controls button[hidden]{display:none}
@media(max-width:1100px){#sparky .sparky-profile-layout{grid-template-columns:minmax(0,1fr);gap:24px}.sparky-profile-card{max-width:340px}}
@media(max-width:1280px){:root[data-reading-size="extra-large"] #sparky .sparky-profile-layout{grid-template-columns:minmax(0,1fr)}:root[data-reading-size="extra-large"] .sparky-profile-card{max-width:340px}}
@media print{.sparky-profile-controls{display:none!important}.sparky-profile-card{max-width:none!important}}
/* Observation portraits follow the record, leaving its text full width. */
.sparky-observation{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;border:0;max-width:none;align-items:flex-start}
.sparky-observation .sparky-playground{flex:none;width:112px;height:124px;min-width:0;max-width:none}
.sparky-observation .sparky-sprite{width:112px;height:121.638px}
.sparky-observation .sparky-controls{width:100%;justify-content:flex-start;gap:6px;margin:0}
.sparky-observation .sparky-controls button{padding:7px 9px;min-height:44px;font-size:12px}
.sparky-companion.sparky-observation[data-hidden="true"]{padding:0}
@media(max-width:600px){.sparky-observation .sparky-playground{flex-basis:auto}.sparky-observation .sparky-controls{margin:0}}
/* A small seated Sparky occupies the real masthead gap, never the navigation. */
.toolbar>[data-sparky-place="masthead"]{flex:0 0 68px;width:68px;min-width:68px;align-self:center}
.sparky-companion.sparky-masthead{display:block;width:68px;max-width:68px;margin:0;padding:0;border:0}
.sparky-masthead .sparky-playground{width:68px;min-width:68px;max-width:68px;height:74px;flex:none}
.sparky-masthead .sparky-sprite{width:68px;height:73.852px}
.text-size-controls .sparky-header-controls{display:flex;gap:8px;flex-wrap:wrap;margin-right:auto;width:auto}
.toolbar>[data-sparky-place="masthead"]:has([data-hidden="true"]){display:none}
@media(max-width:520px){.toolbar>.masthead-identity{flex:1 1 180px}.toolbar>[data-sparky-place="masthead"]{margin-left:auto}.sparky-masthead .sparky-playground{flex-basis:auto}.text-size-controls .sparky-header-controls{flex-basis:100%;margin:0}}
@media print{.sparky-header-controls{display:none!important}}
/* Keep the mascot close to the zine identity; movement stays inside its own lane. */
.toolbar>.masthead-brand-group{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-wrap:wrap;max-width:100%;min-width:0}
.masthead-brand-group>.masthead-identity{flex:0 1 auto}
.masthead-brand-group>[data-sparky-place="masthead"]{flex:0 0 92px;width:92px;min-width:92px;margin:0}
.masthead-brand-group .sparky-masthead{width:92px;max-width:92px}
.masthead-brand-group .sparky-playground{width:92px;max-width:92px;min-width:92px;overflow:hidden}
.masthead-brand-group>[data-sparky-place="masthead"]:has([data-hidden="true"]){display:none}
.toolbar>nav{margin-left:auto}
@media(max-width:520px){.toolbar>.masthead-brand-group{gap:6px}.masthead-brand-group>[data-sparky-place="masthead"]{flex-basis:76px;width:76px;min-width:76px}.masthead-brand-group .sparky-masthead{width:76px;max-width:76px}.masthead-brand-group .sparky-playground{width:76px;max-width:76px;min-width:76px}.toolbar>nav{margin-left:0}}