@layer components{.scene{color:var(--color-ink);--tone:var(--color-gold);--tone-ink:var(--color-highlight-deep);--tone-wash:var(--color-highlight-wash);--tone-on:var(--color-ink);overflow:visible}:is(.scene[data-tone],.scene [data-tone]):is([data-tone=accent],[data-tone=web]){--tone:var(--color-gold);--tone-ink:var(--color-highlight-deep);--tone-wash:var(--color-highlight-wash);--tone-on:var(--color-ink)}:is(.scene[data-tone],.scene [data-tone])[data-tone=local]{--tone:var(--color-gold-light);--tone-ink:var(--color-highlight-deep);--tone-wash:var(--color-cream);--tone-on:var(--color-ink)}:is(.scene[data-tone],.scene [data-tone])[data-tone=browser]{--tone:var(--color-action);--tone-ink:var(--color-action);--tone-wash:var(--color-cream);--tone-on:var(--color-cream)}:is(.scene[data-tone],.scene [data-tone])[data-tone=web-server]{--tone:var(--color-cardinal-deep);--tone-ink:var(--color-cardinal-deep);--tone-wash:var(--color-sand);--tone-on:var(--color-cream)}:is(.scene[data-tone],.scene [data-tone])[data-tone=internet]{--tone:var(--color-cocoa);--tone-ink:var(--color-cocoa);--tone-wash:var(--color-sand);--tone-on:var(--color-cream)}:is(.scene[data-tone],.scene [data-tone])[data-tone=search-engine]{--tone:var(--color-ink-soft);--tone-ink:var(--color-ink-soft);--tone-wash:var(--color-gold-light);--tone-on:var(--color-cream)}:is(.scene[data-tone],.scene [data-tone])[data-tone=remote]{--tone:var(--color-sand-deep);--tone-ink:var(--color-cocoa);--tone-wash:var(--color-sand);--tone-on:var(--color-ink)}:is(.scene[data-tone],.scene [data-tone])[data-tone=cloud]{--tone:#a9d8dc;--tone-ink:var(--color-ink-soft);--tone-wash:color-mix(in srgb, #a9d8dc 35%, var(--color-surface));--tone-on:var(--color-ink)}.scene .sc-sheet{fill:var(--color-surface)}.scene .sc-rule{stroke:var(--color-sand);stroke-width:1.25px;fill:none}.scene .sc-margin{stroke:color-mix(in srgb, var(--color-action) 32%, transparent);stroke-width:1.5px;fill:none}.scene .sc-shadow{fill:var(--color-sand-deep)}.scene .sc-ink{fill:none;stroke:var(--color-ink);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.scene .sc-ink-thin{fill:none;stroke:var(--color-ink);stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round}.scene .sc-muted{fill:none;stroke:var(--color-cocoa);stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round}.scene .sc-device{fill:var(--color-cream)}.scene .sc-paper-fill{fill:var(--color-surface)}.scene .sc-screen{fill:var(--color-sand);stroke:var(--color-ink);stroke-width:2.5px}.scene .sc-slot{fill:var(--color-sand)}.scene .sc-dark{fill:var(--color-ink)}.scene .sc-led,.scene .sc-tone{fill:var(--tone)}.scene .sc-wash{fill:var(--tone-wash)}.scene .sc-gold{fill:var(--color-gold)}.scene .sc-tone-line{fill:none;stroke:var(--tone-ink);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.scene .sc-knock{fill:none;stroke:var(--tone-on);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.scene .sc-tone-ink{fill:none;stroke:var(--tone-ink);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.scene .sc-flow{fill:none;stroke:var(--tone-ink);stroke-width:4px;stroke-linecap:round;stroke-dasharray:0 9}.scene .sc-name{font:800 20px/1 var(--font-sans), system-ui, sans-serif;fill:var(--color-ink)}.scene .sc-sub{font:italic 500 21px/1 var(--font-display), Georgia, serif;fill:var(--color-ink);letter-spacing:.01em}.scene .sc-tag,.scene .sc-mark{font:700 20px/1 var(--font-sans), system-ui, sans-serif;fill:var(--color-ink)}.scene-part{transition:opacity var(--duration-slow) var(--ease-out-quart), transform var(--duration-slow) var(--ease-out-expo)}.scene[data-active] .scene-part:not([data-on]){opacity:.26}.scene-part[data-on]{transform:translateY(-3px)}.scene .sc-glow{fill:var(--color-highlight-wash);opacity:0;transform-box:fill-box;transform-origin:50%;transition:opacity var(--duration-slow) var(--ease-out-quart), transform var(--duration-slow) var(--ease-out-expo);transform:scale(.9)}.scene .sc-ring{fill:none;stroke:var(--color-gold);stroke-width:5px;stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:1px;opacity:0;transition:stroke-dashoffset var(--duration-slow) var(--ease-out-quart) 60ms, opacity var(--duration-base) var(--ease-out-quart)}.scene .sc-swipe{fill:var(--color-highlight);opacity:0;transform-box:fill-box;transform-origin:0;transition:transform var(--duration-slow) var(--ease-out-expo) .12s, opacity var(--duration-base) var(--ease-out-quart);transform:scaleX(0)}.scene [data-on] .sc-glow{opacity:1;transform:none}.scene [data-on] .sc-ring{opacity:.95;stroke-dashoffset:0}.scene [data-on] .sc-swipe{opacity:.8;transform:none}.scene .sc-only-on{opacity:0;transition:opacity var(--duration-base) var(--ease-out-quart)}.scene [data-on] .sc-only-on{opacity:1}.scene [data-on] .sc-hide-on{opacity:0}.scene :is(.sc-pop,.sc-spin,.sc-wave,.sc-wiggle,.sc-bob,.sc-press){transform-box:fill-box;transform-origin:50%}.scene .sc-grow-y{transform-box:fill-box;transform-origin:50% 100%}.scene .sc-grow-x{transform-box:fill-box;transform-origin:0}.scene :is(.sc-swing,.sc-sweep){transform-box:view-box;transform-origin:var(--o,0 0)}.scene :is(.sc-draw,.sc-draw-on){stroke-dasharray:1 1}.scene .sc-draw-on{stroke-dashoffset:1px;transition:stroke-dashoffset var(--duration-slow) var(--ease-out-quart) var(--d,0s)}.scene [data-on] .sc-draw-on{stroke-dashoffset:0}.scene [data-on] .sc-march{animation:1s linear 3 scene-march}.scene [data-on] .sc-travel{animation:scene-travel 1.6s var(--ease-out-quart) var(--d,0s) 2 both}.scene [data-on] .sc-travel-once{animation:scene-travel 1.2s var(--ease-out-quart) var(--d,0s) 1 both}.scene [data-on] .sc-pop{animation:scene-pop var(--duration-slow) var(--ease-out-expo) var(--d,0s) 1 both}.scene [data-on] .sc-grow-y{animation:scene-grow-y .7s var(--ease-out-quart) var(--d,0s) 1 both}.scene [data-on] .sc-grow-x{animation:scene-grow-x .6s var(--ease-out-quart) var(--d,0s) 1 both}.scene [data-on] .sc-spin{animation:scene-spin 1.8s var(--ease-out-quart) var(--d,0s) 2}.scene [data-on] .sc-wave{animation:scene-wave 1.1s var(--ease-out-quart) var(--d,0s) 3 both}.scene [data-on] .sc-wiggle{animation:scene-wiggle .9s var(--ease-out-quart) var(--d,0s) 2}.scene [data-on] .sc-swing{animation:scene-swing 1.1s var(--ease-out-quart) var(--d,0s) 2}.scene [data-on] .sc-sweep{animation:scene-sweep 1.4s var(--ease-out-expo) var(--d,0s) 2 both}.scene [data-on] .sc-bob{animation:scene-bob 1.2s var(--ease-out-quart) var(--d,0s) 3}.scene [data-on] .sc-press{animation:scene-press .8s var(--ease-out-quart) var(--d,0s) 3}.scene [data-on] .sc-draw{animation:scene-draw .7s var(--ease-out-quart) var(--d,0s) 1 both}@keyframes scene-march{to{stroke-dashoffset:-16px}}@keyframes scene-travel{0%{transform:translate(var(--fx,0), var(--fy,0));opacity:0}18%{opacity:1}to{opacity:1;transform:none}}@keyframes scene-pop{0%{opacity:0;transform:scale(.4)}}@keyframes scene-grow-y{0%{transform:scaleY(0)}}@keyframes scene-grow-x{0%{transform:scaleX(0)}}@keyframes scene-spin{to{transform:rotate(360deg)}}@keyframes scene-wave{0%{opacity:0;transform:scale(.5)}45%{opacity:1}}@keyframes scene-wiggle{30%{transform:rotate(-9deg)}70%{transform:rotate(7deg)}}@keyframes scene-swing{30%{transform:rotate(-10deg)}70%{transform:rotate(6deg)}}@keyframes scene-sweep{0%{transform:rotate(-120deg)}}@keyframes scene-bob{50%{transform:translateY(-6px)}}@keyframes scene-press{35%{transform:translateY(4px)}}@keyframes scene-draw{0%{stroke-dashoffset:1px}}.scene .sc-switch-lever{transform-box:fill-box;transform-origin:50% 100%;transition:transform var(--duration-slow) var(--ease-out-expo)}.scene[data-active=power-off] .sc-switch-lever{transform:rotate(180deg)}.scene .sc-desk-papers{transition:opacity var(--duration-slow) var(--ease-out-quart) .12s, transform var(--duration-slow) var(--ease-out-quart) .12s}.scene[data-active=power-off] .sc-desk-papers{opacity:0;transform:translateY(-10px)}.scene[data-active=power-off] .sc-power-glow{opacity:0}.scene .sc-power-glow{transition:opacity var(--duration-base) var(--ease-out-quart)}.scene[data-active=power-off] [data-part=storage],.scene[data-active=power-off] [data-part=ram]{opacity:1}.scene .sc-off-only{opacity:0;transition:opacity var(--duration-base) var(--ease-out-quart) .2s}.scene[data-active=power-off] .sc-off-only{opacity:1}.scene[data-active=power-off] .sc-on-only{opacity:0}.scene-stage .scene-part{cursor:pointer}.scene-step-in{animation:scene-step-in var(--duration-base) var(--ease-out-quart) both}@keyframes scene-step-in{0%{opacity:.35;transform:translateY(6px)}}@media print{.scene .scene-part{opacity:1!important;transform:none!important}}.scene .sc-digit{font:700 30px/1 var(--font-mono), ui-monospace, Menlo, monospace}.scene .sc-digit-sm{font-size:22px}.scene .sc-ray{fill:none;stroke:var(--color-highlight-deep);stroke-width:2.6px;stroke-linecap:round}.scene .sc-glint{fill:none;stroke:var(--color-surface);stroke-width:2.2px;stroke-linecap:round}.scene .sc-veil{fill:var(--color-surface);opacity:.72}.scene :is(.sc-not-bit,.sc-dim-0){transition:opacity var(--duration-slow) var(--ease-out-quart)}.scene[data-scene=switches-to-bits][data-active=write-down] [data-part=switches]{opacity:.5}.scene[data-scene=switches-to-bits][data-active=bit] :is([data-part=switches],[data-part=write-down]){opacity:1}.scene[data-scene=switches-to-bits][data-active=bit] .sc-not-bit{opacity:.26}.scene[data-scene=switches-to-bits][data-active=byte] [data-part=write-down],.scene[data-scene=place-values][data-active=keep] :is([data-part=places],[data-part=bits]){opacity:1}.scene[data-scene=place-values][data-active=add] :is([data-part=places],[data-part=bits],[data-part=keep]){opacity:.5}.scene [data-on] .sc-l-move{animation:scene-l-move 1.6s var(--ease-out-quart) .5s 2 both}@keyframes scene-l-move{0%{transform:translate(-18px,-18px)}45%,55%{transform:translateY(-18px)}}.scene .sc-bits{letter-spacing:.5px;font-size:20px}.scene .sc-grid{fill:none;stroke:var(--color-sand-deep);stroke-width:1.2px}}
@layer components{.scene.word-art{--wa-ink:3px;--wa-thin:2.2px;width:100%;height:auto;display:block;overflow:visible}.scene.word-art--tile{--wa-ink:2px;--wa-thin:1.4px}.scene.word-art--chip{--wa-ink:1.5px;--wa-thin:1.1px}.scene.word-art :is(.sc-ink,.sc-ink-thin,.sc-muted,.sc-tone-ink,.sc-tone-line,.sc-knock,.sc-flow,.sc-screen){vector-effect:non-scaling-stroke}.scene.word-art :is(.sc-ink,.sc-tone-ink,.sc-tone-line,.sc-knock){stroke-width:var(--wa-ink)}.scene.word-art :is(.sc-ink-thin,.sc-muted,.sc-screen){stroke-width:var(--wa-thin)}.scene.word-art .sc-flow{stroke-width:calc(var(--wa-ink) * 1.5);stroke-dasharray:0 calc(var(--wa-ink) * 3)}.scene.word-art .wa-glyph{font:800 15px/1 var(--font-sans), system-ui, sans-serif;fill:var(--tone-ink)}.scene.word-art .wa-glyph--ink{fill:var(--color-ink)}.scene.word-art .wa-letter{font:900 46px/1 var(--font-chunk,var(--font-sans)), system-ui, sans-serif;fill:var(--color-cocoa)}.scene.word-art .wa-glyph--on{fill:var(--tone-on)}}
