/*
 * DacAI Resident v0.2 / A+ Archivist
 * Canonical behavior specification: DACAI_SPEC.md
 * Runtime copy is intentionally vendored because each website is an independent repository.
 */

.stage { position: relative; }

.dacai-resident {
    --dacai-size: 44px;
    --dacai-entry-x: 520px;
    --dacai-enter-duration: 5000ms;
    --dacai-exit-duration: 4000ms;
    position: absolute;
    z-index: 1;
    width: calc(var(--dacai-size) * .8);
    height: var(--dacai-size);
    color: var(--ink-primary);
    opacity: 0;
    pointer-events: none;
    transform: translate3d(var(--dacai-entry-x), 0, 0);
}

.dacai-resident[hidden] { display: none !important; }

.dacai-resident__button {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    color: inherit;
    background: transparent;
    border: 0;
    border-radius: 2px;
    cursor: pointer;
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent;
}

.dacai-resident__button:focus-visible {
    outline: 1px solid #8a7148;
    outline-offset: 4px;
}

.dacai-resident__svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.dacai-body,
.dacai-head rect,
.dacai-booklet rect {
    fill: var(--bg);
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.dacai-head,
.dacai-arm,
.dacai-leg,
.dacai-booklet {
    transform-box: fill-box;
    transform-origin: center;
}

.dacai-arm path,
.dacai-leg path {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.dacai-tab {
    fill: #927248;
    stroke: currentColor;
    stroke-width: 1.35;
    stroke-linejoin: round;
}

.dacai-mark { fill: #6f7b72; }
.dacai-eye { fill: currentColor; transform-box: fill-box; transform-origin: center; animation: dacai-blink 8.2s step-end infinite; }
.dacai-booklet__tab { fill: #927248; }
.dacai-paper-line { fill: none; stroke: var(--ink-label); stroke-width: 1.45; stroke-linecap: round; }
.dacai-head { transform-origin: 50% 88%; transition: transform 360ms ease; }
.dacai-arm, .dacai-booklet { transition: transform 300ms ease; }

.dacai-resident[data-dacai-state='entering'] {
    animation: dacai-enter var(--dacai-enter-duration) cubic-bezier(.25, .7, .2, 1) forwards;
}

.dacai-resident[data-dacai-state='walking'] .dacai-leg--left,
.dacai-resident[data-dacai-state='entering'] .dacai-leg--left { animation: dacai-step-left 760ms ease-in-out infinite; }
.dacai-resident[data-dacai-state='walking'] .dacai-leg--right,
.dacai-resident[data-dacai-state='entering'] .dacai-leg--right { animation: dacai-step-right 760ms ease-in-out infinite; }
.dacai-resident[data-dacai-state='idle'],
.dacai-resident[data-dacai-state='looking'],
.dacai-resident[data-dacai-state='sitting'],
.dacai-resident[data-dacai-state='reading'],
.dacai-resident[data-dacai-state='writing'],
.dacai-resident[data-dacai-state='waving'] { opacity: .9; transform: translate3d(0, 0, 0); }
.dacai-resident[data-dacai-state='looking'] .dacai-head { transform: rotate(-5deg) translate(-.6px, -.5px); }
.dacai-resident[data-dacai-state='waving'] .dacai-arm--left { animation: dacai-wave 560ms ease-in-out 2; }
.dacai-resident[data-dacai-state='exiting'] {
    animation: dacai-exit var(--dacai-exit-duration) cubic-bezier(.55, 0, .75, .35) forwards;
}

.dacai-resident__state {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 50%;
    padding: 2px 5px;
    color: var(--ink-primary);
    background: var(--bg);
    border: 1px solid #8a7148;
    font: 9px/1.3 ui-monospace, monospace;
    white-space: nowrap;
    transform: translateX(-50%);
}

.dacai-resident.dacai-debug { outline: 1px dashed #8a7148; outline-offset: 8px; }
.dacai-resident.dacai-debug .dacai-resident__state { display: block; }

@keyframes dacai-enter {
    0% { opacity: 0; transform: translate3d(var(--dacai-entry-x), 0, 0); }
    14% { opacity: .9; }
    100% { opacity: .9; transform: translate3d(0, 0, 0); }
}

@keyframes dacai-exit {
    0% { opacity: .9; transform: translate3d(0, 0, 0); }
    80% { opacity: .9; }
    100% { opacity: 0; transform: translate3d(var(--dacai-entry-x), 0, 0); }
}

@keyframes dacai-blink { 0%, 47%, 50%, 100% { transform: scaleY(1); } 48%, 49% { transform: scaleY(.12); } }
@keyframes dacai-step-left { 0%, 100% { transform: rotate(5deg); } 50% { transform: rotate(-6deg); } }
@keyframes dacai-step-right { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(5deg); } }
@keyframes dacai-wave { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-22deg) translate(-1px, -2px); } }

@media (max-width: 1199px) and (min-width: 860px) {
    .dacai-resident { --dacai-size: 41px; }
}

@media (max-width: 859px) {
    .dacai-resident { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .dacai-resident,
    .dacai-resident *,
    .dacai-resident *::before,
    .dacai-resident *::after {
        animation: none !important;
        transition: none !important;
    }
}