/* Quiet surfaces; Yuan Yuan lives inside useful interactions. */
.side-logo{padding-bottom:38px}
.side-logo img{width:108px;height:84px}
.side-menu{box-shadow:0 8px 32px #57452805}
.side-menu nav a{font-size:14px;min-height:48px}
.side-menu nav b{display:none}
.side-tools{padding-bottom:2px}
.hero-intro h1{margin-top:0;line-height:1.4}
.intro-copy{color:#77747b}
.apricot-hero{gap:56px}
.sample-study{padding:44px 26px 23px;box-shadow:0 18px 50px #71625208}
.sample-term{font-size:60px}
.sample-answer{min-height:64px}
.sample-actions button{flex:1;min-width:0;border:1px solid #e8dfd4;background:#fff9;border-radius:16px;color:#60564e;font:inherit;cursor:pointer}
.sample-actions button:last-child{background:#ffdfbf;border-color:#f4c99d;color:#603619}
.fox-action{display:inline-flex!important;align-items:center;justify-content:center;gap:9px;position:relative;min-height:64px!important;padding:5px 17px!important;white-space:nowrap;transition:background .2s,box-shadow .2s,transform .15s}
.fox-action:active{transform:translateY(1px)}
.fox-action:focus-visible{outline:3px solid #be7039;outline-offset:4px}
.button-fox{display:inline-block;flex:0 0 46px;width:46px;height:46px;background-image:url("yuanyuan-reactions.webp");background-size:400% 300%;background-repeat:no-repeat;background-position:100% 0;transform-origin:50% 85%;pointer-events:none}
.fox-action[data-fox="think"] .button-fox{background-position:33.3333% 50%;transform:rotate(-7deg)}
.fox-action[data-fox="happy"]:is(:hover,:focus-visible,.fox-react) .button-fox{background-position:33.3333% 100%;animation:fox-cheer .85s ease-in-out 1}
.fox-action[data-fox="think"]:is(:hover,:focus-visible,.fox-react) .button-fox{animation:fox-think 1s ease-in-out 1}
.wk-ui.glass-app #questionActions .known,.wk-ui.glass-app #nextButton{background:#ffdfbf;border:1px solid #f4c99d;color:#603619;box-shadow:none}
.wk-ui.glass-app #questionActions .again{background:#fff9;border:1px solid #e8dfd4;color:#60564e}
.wk-ui.glass-app #questionActions .known:hover,.wk-ui.glass-app #nextButton:hover{background:#ffd3a8}
.wk-ui.glass-app #questionActions{gap:14px}
.wk-ui.glass-app #questionActions button{flex:1}
.sample-actions button:hover{box-shadow:0 4px 14px #86552c0b}
.wk-ui.glass-app .study-top p,.wk-ui.glass-app #wordMeta{display:none}
.wk-ui.glass-app .page-heading>div>p:not([id]){max-width:48em;font-size:13px;color:var(--muted)}
.dark .intro-copy{color:var(--muted)}
.dark .sample-actions button:first-child,.dark.wk-ui.glass-app #questionActions .again{background:#3a302b;color:#f1e6dc;border-color:#69513f}
@keyframes fox-cheer{0%,100%{transform:translateY(0)}20%,75%{transform:translateY(-4px) rotate(-4deg)}50%{transform:translateY(-7px) rotate(4deg)}}
@keyframes fox-think{0%,100%{transform:rotate(-7deg)}35%{transform:rotate(8deg) translateY(-2px)}70%{transform:rotate(-10deg)}}
@media(max-width:1050px){.apricot-hero{grid-template-columns:1fr;max-width:730px;gap:42px}.sample-wrap{width:100%;max-width:500px}.sample-study{padding-top:32px}}
@media(max-width:800px){.side-logo{padding-bottom:30px}.side-logo img{width:46px;height:43px}.apricot-hero{gap:34px}.side-menu nav a{min-height:48px}}
@media(max-width:480px){.side-logo img{width:43px}.sample-study{padding:32px 13px 16px}.sample-term{font-size:48px}.fox-action{gap:3px;min-height:57px!important;padding:4px 7px!important;font-size:12px!important}.button-fox{width:36px;height:36px;flex-basis:36px}.sample-actions{gap:8px}.wk-ui.glass-app #questionActions{gap:8px}}
@media(max-width:380px){.fox-action{padding:4px!important;gap:2px}.button-fox{width:28px;height:28px;flex-basis:28px}}
@media(prefers-reduced-motion:reduce){.fox-action,.button-fox{animation:none!important;transition:none!important;transform:none!important}}
