/* ColorLab's paper cards unfold into a quiet reading space. */
.appearance-settings{margin:28px 0 0;padding:20px;border:1px solid var(--line);border-radius:18px;min-width:0;background:var(--white)}
.appearance-settings legend{padding:0 8px;font-size:17px;font-weight:600}
.appearance-settings p{font-size:13px;line-height:1.8;color:var(--muted);margin-bottom:16px}
.appearance-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.appearance-options label{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 4px;min-height:48px;border:1px solid var(--line);border-radius:12px;font-size:13px;cursor:pointer;white-space:nowrap}
.appearance-options input{width:14px;height:14px;margin:0;accent-color:var(--rose)}
.appearance-options label:has(input:checked){background:var(--rose-soft);color:var(--rose);border-color:var(--rose)}
.appearance-options label:focus-within{outline:2px solid var(--rose);outline-offset:3px}
@media(max-width:360px){.appearance-settings{padding:16px 12px}.appearance-options label{flex-direction:column;gap:7px}}
.hero-copy .quiet-glint { display:inline-block; width:20px; height:20px; flex-shrink:0; vertical-align:middle; overflow:visible; }
.quiet-glint path { transform-box:view-box; transform-origin:center; opacity:.62; animation:quiet-glint 8s cubic-bezier(.4,0,.2,1) infinite; }
@keyframes quiet-glint { 0%,60%,100%{opacity:.62;transform:scale(1)} 77%{opacity:1;transform:scale(1.07)} 94%{opacity:.62;transform:scale(1)} }
@media(prefers-reduced-motion:reduce) { .quiet-glint path { animation:none; } }
.color-detail-dialog { padding:0; overflow-x:hidden; }
.color-detail-dialog[open] { animation:color-unfold 220ms cubic-bezier(.2,.7,.2,1); }
.color-detail-dialog::backdrop { backdrop-filter:none; }
body:has(.color-detail-dialog[open]) main .articulated *,body:has(.color-detail-dialog[open]) main .articulated::after { animation-play-state:paused; }
.color-detail-dialog .dialog-close { z-index:2; background:var(--white); }
#detail-dialog .dialog-close { color:var(--rose); }
#detail-dialog .dialog-close:focus-visible { outline:2px solid var(--rose); outline-offset:1px; }
#detail-dialog[data-pointer-focus] .dialog-close:focus { outline:none; box-shadow:none; }
.swatch[data-pointer-focus]:focus, .color-detail-dialog[data-pointer-focus]:focus, .color-detail-dialog[data-pointer-focus] .dialog-close:focus { outline:none; }
.color-detail-hero { display:flex; align-items:center; gap:28px; padding:42px 32px 26px; background:var(--detail-tint); color:var(--detail-ink); }
.color-detail-hero>.report-character { width:130px; height:170px; flex-shrink:0; }
.color-detail-hero>.articulated { --character-delay:0s!important; }
.color-detail-hero h2 { font-size:30px; }
.color-detail-hero p { color:var(--detail-ink); color:color-mix(in srgb,var(--detail-ink) 88%,#211f24); }
.color-detail-copy { padding:26px 32px 32px; display:grid; gap:24px; }
.color-detail-copy h3 { font:600 20px/1.5 var(--serif); margin-bottom:7px; }
.color-detail-copy p { line-height:1.9; }
@keyframes color-unfold { from{transform:translateY(6px) scale(.98)} to{transform:none} }
@media(max-width:767px) and (prefers-reduced-motion:no-preference) {
 .color-detail-dialog[open] { animation:color-mobile-open 380ms cubic-bezier(.16,1,.3,1); transform-origin:50% 100%; }
}
@keyframes color-mobile-open { from{transform:translateY(32px) scale(.96)} to{transform:none} }
.first-visit { margin:36px 24px 0; border:1px solid var(--line); border-radius:18px; background:var(--white); }
.first-visit>a { display:flex; align-items:flex-start; gap:18px; padding:26px; border-radius:18px; }
.first-visit-symbol { display:grid; place-items:center; width:46px; height:46px; flex-shrink:0; border-radius:14px; background:#eee9e0; color:#746953; }
.first-visit strong,.first-visit a>span>span { display:block; }
.first-visit strong { font:600 24px/1.5 var(--serif); margin:6px 0; }
.first-visit a>span>span:not(.eyebrow) { font-size:14px; color:var(--muted); }
.first-visit .first-visit-link { margin-top:14px; color:var(--rose); }
.legacy-import { border:1px solid var(--line); border-radius:16px; padding:20px; margin:18px 0; background:var(--white); }
.legacy-import h2 { font-size:20px; }
.legacy-import p { font-size:14px; margin:10px 0 14px; color:var(--muted); }
.legacy-options { display:grid; gap:12px; margin:16px 0; }
.legacy-options label { display:flex; gap:12px; align-items:center; min-height:48px; }
.legacy-options input { width:20px; height:20px; flex-shrink:0; accent-color:var(--rose); }
.legacy-options strong,.legacy-options label span>span { display:block; font-size:14px; }
.legacy-options label:has(input:disabled) { opacity:.65; }
@media(max-width:767px) { .first-visit>a{padding:22px 18px;gap:12px} .first-visit strong{font-size:21px} }
.swatch { backface-visibility:hidden; -webkit-backface-visibility:hidden; }
main[data-flipping] .articulated *,main[data-flipping] .articulated::after { animation-play-state:paused; }
/* Independent character paths stay in the companion space, never over answers. */
.quiz-companion .companion-cast { position:relative; pointer-events:none; --roam-x:9px; --roam-y:-15px; }
.quiz-companion .companion-member { position:absolute; animation:companion-wander 14s ease-in-out infinite; }
.quiz-companion .companion-member:nth-child(2) { animation-delay:-3.5s; }
.quiz-companion .companion-member:nth-child(3) { animation-delay:-7s; }
.quiz-companion .companion-member:nth-child(4) { animation-delay:-10.5s; }
@keyframes companion-wander { 0%,100%{transform:translate(0,0)} 25%{transform:translate(var(--roam-x),calc(var(--roam-y)/2)) rotate(2deg)} 50%{transform:translate(0,var(--roam-y))} 75%{transform:translate(calc(var(--roam-x)*-1),calc(var(--roam-y)/2)) rotate(-2deg)} }
@media(min-width:768px) {
 .companion-desktop .companion-cast { height:310px; margin:20px 0; --roam-x:24px; --roam-y:-24px; }
 .companion-desktop .companion-member { width:44%; height:140px; }
 .companion-desktop .companion-member:nth-child(1) { left:3%;top:12px; }
 .companion-desktop .companion-member:nth-child(2) { right:3%;top:28px; }
 .companion-desktop .companion-member:nth-child(3) { left:7%;bottom:0; }
 .companion-desktop .companion-member:nth-child(4) { right:0;bottom:12px; }
}
.collection-entry { flex-shrink:0; color:var(--rose); font-size:12px; }
.collection-page { padding:28px 40px 60px; }
.collection-heading { margin:24px 0 28px; }
.collection-heading h1 { font:600 36px/1.5 var(--serif); margin:12px 0; }
.collection-heading>p { color:var(--muted); }
.collection-switch { display:flex; gap:10px; margin:24px 0 16px; }
.collection-switch a { padding:10px 18px; border:1px solid var(--line); border-radius:24px; }
.collection-switch a[aria-current] { color:var(--rose); background:var(--rose-soft); border-color:var(--rose); }
.collection-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:start; }
.collection-grid .article-card { min-width:0; width:100%; display:flex; flex-direction:column; }
.home-page .horizontal-list .article-card { display:flex; flex-direction:column; }
.home-page .article-card .article-image { width:100%; flex:none; aspect-ratio:3/2; }
.home-page .article-card .topic-illustration { object-fit:contain; }
.home-page .article-card .article-copy { flex:1; display:flex; flex-direction:column; width:100%; }
.home-page .article-card .read-link { margin-top:auto; padding-top:22px; }
.collection-grid .article-copy>p { display:block; overflow:visible; -webkit-line-clamp:unset; }
.collection-grid .article-copy h3 { min-height:0; }
.resources .resource-card { display:flex; flex-direction:column; align-items:stretch; gap:0; padding:0; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--white); }
.resources .media-compact { width:100%; height:auto; aspect-ratio:3/2; border-radius:0; }
.resources .resource-copy { display:block; width:100%; padding:18px 20px 22px; }
.resources .resource-copy h3 { font-size:17px; line-height:1.5; margin:7px 0 10px; }
.resources .resource-copy p { font-size:13px; line-height:1.8; }
.resources .resource-copy>p:not(.source-note) { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.resources .resource-card>.icon { display:none; }
.history-entry { position:relative; border:1px solid var(--line); background:var(--white); border-radius:18px; margin:16px 0; padding:0 24px 8px; }
.history-entry .history-card { border:0; }
.history-entry .history-card-unified { display:grid; grid-template-columns:minmax(0,1fr) 130px; align-items:center; gap:16px 24px; padding:24px 0 12px; }
.history-card-unified>div { min-width:0; }
.history-kicker { display:block; font-size:11px; letter-spacing:.12em; color:var(--muted); }
.history-mbti { display:block; font-family:system-ui,sans-serif; font-size:34px; letter-spacing:.06em; line-height:1.25; margin:5px 0; color:var(--record-accent); }
.history-entry .history-summary h3 { font-size:21px; line-height:1.5; margin:0; }
.history-result-labels { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-top:10px; }
.history-result-labels span { padding:3px 9px; border-radius:6px; background:var(--result-light,#f3efeb); color:var(--result-ink,var(--muted)); font-size:12px; line-height:1.6; }
.history-portraits { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:4px; min-height:110px; }
.history-portraits img { display:block; width:80px; height:120px; object-fit:contain; }.history-portraits img:not(:only-child){width:56px;height:88px}.history-portraits>.icon{width:40px;height:40px;color:var(--record-accent)}
.history-entry .history-takeaway { grid-column:1/-1; margin:0; font-size:14px; line-height:1.85; color:var(--ink); }.history-takeaway>span{display:block;font-size:11px;letter-spacing:.08em;color:var(--muted);margin-bottom:3px}
.history-meta { grid-column:1/-1; display:grid; gap:3px; padding-top:14px; border-top:1px solid var(--line); font-size:12px; color:var(--muted); }.history-meta time{font-size:11px}
.history-open { grid-column:1/-1; display:flex; align-items:center; gap:8px; min-height:44px; padding-right:104px; font-size:13px; color:var(--record-accent); }.history-open .icon{width:18px;height:18px}
.history-entry .delete-record{position:absolute;right:24px;bottom:20px}.history-entry .history-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px}
@media(max-width:480px){.history-entry{padding:0 16px 12px}.history-entry .history-card-unified{grid-template-columns:minmax(0,1fr) 86px;gap:14px 12px;padding-top:20px}.history-mbti{font-size:29px}.history-entry .history-summary h3{font-size:18px}.history-portraits{min-height:110px}.history-portraits img{width:68px;height:106px}.history-portraits img:not(:only-child){width:40px;height:62px}}
.reflection-panel { margin:24px 0; padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--white); }
.reflection-panel h2 { font-size:22px; margin:8px 0 18px; }
.reflection-options { display:flex; flex-wrap:wrap; gap:10px; }
.reflection-options [data-choice="other"] { flex-basis:100%; }
.reflection-saving { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; }
.reflection-options button { border:1px solid var(--line); border-radius:12px; background:transparent; color:var(--ink); padding:12px 16px; min-height:44px; text-align:left; line-height:1.6; transition:background .15s ease,transform .15s ease; }
.reflection-options button[aria-pressed=true] { background:var(--rose-soft); border-color:var(--rose); color:var(--rose); }
.reflection-options button:active { transform:scale(.98); }
.reflection-reply { min-height:1.6em; margin:16px 0 8px; }.reflection-panel small { color:var(--muted); font-size:12px; }
@media(max-width:480px){.reflection-panel{padding:18px}}
@media(prefers-reduced-motion:reduce){.reflection-options button{transition:none}.reflection-options button:active{transform:none}}
.delete-record { display:block; margin-left:auto; background:none; color:var(--rose); padding:8px 12px; min-height:44px; border:1px solid var(--line); border-radius:10px; font-size:12px; }
.delete-record:hover { background:var(--rose-soft); }
@media(min-width:768px) and (max-width:1023px) { .collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:767px) {
  .section-heading { flex-wrap:wrap; gap:6px 12px; }
  .section-heading .collection-entry { margin-left:auto; }
  .collection-page { padding:20px 20px 40px; }
  .collection-heading h1 { font-size:28px; }
  .collection-grid { grid-template-columns:1fr; gap:20px; }
  .color-detail-hero { padding:40px 22px 24px; gap:14px; }
  .color-detail-hero>.report-character { width:88px; height:120px; }
  .color-detail-hero h2 { font-size:24px; }
  .color-detail-copy { padding:24px; }
  /* Quiz owns the thumb zone; the exit action remains at the top. */
  body[data-page="test"] { padding-bottom:calc(86px + env(safe-area-inset-bottom)); }
  body[data-page="test"] #navigation { display:none; }
  body[data-page="test"] .site-header { height:48px; }
  body[data-page="test"] .brand>span { font-size:23px; }
  body[data-page="test"] .brand img { width:30px; height:30px; }
  .test-page { padding:0 20px 12px; }
  .test-topline { margin-bottom:0; min-height:36px; }
  .test-topline .text-button { min-height:36px; font-size:12px; }
  .test-page>.survey-context { display:none; }
  .question-area { animation:none; }
  #question-form { animation:none; transform:none; }
  .companion-mobile { display:block; padding:10px 0 0; margin-bottom:8px; }
  .companion-mobile .companion-cast { height:110px; margin:0; }
  .companion-mobile .companion-member { width:23%; height:90px; bottom:3px; }
  .companion-mobile .companion-member:nth-child(1) { left:0; }
  .companion-mobile .companion-member:nth-child(2) { left:25%; }
  .companion-mobile .companion-member:nth-child(3) { left:50%; }
  .companion-mobile .companion-member:nth-child(4) { left:75%; }
  .companion-mobile .companion-copy { display:none; }
  .companion-mobile .companion-copy strong { font-size:12px; }
  .companion-mobile .companion-copy p { font-size:11px; line-height:1.5; }
  .question-progress { margin-bottom:5px; font-size:11px; }
  .question-progress strong { font-size:16px; }
  .test-page legend { margin:12px 0 12px; }
  .question-number { margin-bottom:5px; font-size:10px; }
  .question-text { font-size:21px; line-height:1.45; }
  .question-helper { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .options { clear:both; gap:8px; }
  .option { min-height:54px; padding:10px; gap:10px; }
  .option-copy { font-size:15px; line-height:1.45; }
  .option-letter { width:26px; height:26px; font-size:13px; }
  .option-check,.option-check .icon { width:16px; }
  .question-actions { position:fixed; z-index:35; bottom:0; left:0; right:0; margin:0; padding:12px 20px calc(12px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:var(--paper); box-shadow:0 -6px 18px #39343506; }
  .question-actions .button { min-height:50px; padding:10px 14px; }
  .question-bottom { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
}
@media(max-width:767px) and (max-height:700px) {
  .companion-mobile .companion-cast { height:68px; }
  .companion-mobile .companion-member { height:60px; }
  .test-topline { min-height:30px; }
  .test-topline .text-button { min-height:30px; }
  .companion-mobile { padding:2px 0 6px; margin-bottom:5px; }
  .question-text { font-size:19px; }
  .test-page legend { margin:6px 0; }
  .option { min-height:48px; padding:8px 10px; }
  .option-copy { font-size:14px; }
  .options { gap:7px; }
}
@media(max-width:359px) {
  .test-page { padding-left:14px; padding-right:14px; }
  .question-actions { padding-left:14px; padding-right:14px; gap:8px; }
  .question-actions .button { white-space:nowrap; gap:6px; padding:9px 8px; font-size:13px; }
  .question-actions .icon { width:17px; }
  .companion-mobile .companion-copy { display:none; }
  .companion-mobile .companion-cast { height:62px; margin:auto; }
  .test-page .option { gap:7px; padding:8px; }
  .option-letter { width:22px; height:22px; }
  .question-text { font-size:18px; }
}
@media(prefers-reduced-motion:reduce) { .color-detail-dialog[open],.color-detail-dialog[open] .color-detail-copy,.quiz-companion .companion-member{animation:none} }
/* Keep guest account actions together, above the guest's existing records. */
.guest-account{margin:0 0 28px;padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--white)}
.guest-account h2{margin:0 0 10px;font-size:21px;line-height:1.55}
.guest-account p{margin:0;color:var(--muted);font-size:15px;line-height:1.8}
.guest-account-actions{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0 16px}
.guest-account-actions .button{min-width:124px}
.guest-account .guest-account-note{padding-top:16px;border-top:1px solid var(--line);font-size:14px}
@media(max-width:600px){.guest-account{padding:20px}.guest-account h2{font-size:19px}.guest-account-actions .button{flex:1;min-width:0}}
.first-use-link{display:flex;align-items:center;gap:12px;width:min(100%,380px);margin:24px auto 12px;padding:14px 12px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.source-note{display:grid;gap:2px;text-align:left}.source-note>span{display:block;line-height:1.7;word-break:normal;overflow-wrap:normal}
.history-test-filter{grid-column:1/-1}.history-filters select{max-width:100%}.footer-companions{display:flex;align-items:flex-end;gap:14px;margin-top:16px}.footer-companions img{width:44px;height:64px;object-fit:contain}
.profile-page>[data-logout]{display:flex;justify-content:center;min-width:148px;margin:28px auto 0;padding:12px 24px}.first-use-link>.icon:first-child{box-sizing:content-box;padding:9px;background:var(--rose-soft);border-radius:12px;color:var(--rose)}
.first-use-link>span{flex:1}.first-use-link small{display:block;font-size:11px}.first-use-link .icon{width:18px;height:18px}.first-use-link:hover{color:var(--rose)}
@media(min-width:768px){
  .hero-copy>.microcopy{text-align:left;width:280px;margin-top:10px}
  .hero-copy>.all-surveys-link{justify-content:flex-start;font-size:13px;margin-top:6px;min-height:44px}
  .hero-copy>.first-use-link{width:280px;margin:16px 0 0;padding:16px 0;gap:10px}
}
@media(max-width:767px){
  .hero-copy>.first-use-link{margin:28px auto 0;padding-block:24px}
  .hero>.color-studio{margin-top:0}
  .organized-footer .footer-brand{text-align:center}
  .organized-footer .footer-companions{justify-content:center}
}
.organized-footer{display:grid;grid-template-columns:1.6fr 1fr 1.2fr;gap:32px;text-align:left;align-items:start}
.organized-footer .footer-brand>strong{font:600 30px Georgia,serif}.organized-footer h2{font:600 14px var(--body-font);margin:0 0 12px}.organized-footer p{font-size:13px;margin:12px 0;color:var(--muted)}
.organized-footer a{display:flex;align-items:center;gap:8px;min-height:44px;font-size:14px;width:fit-content}.organized-footer small{font-size:11px;color:var(--muted)}
.history-filters{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:20px 0;border-block:1px solid var(--line)}
.history-filters label{display:flex;flex-direction:column;gap:8px;min-width:0;font-size:13px;color:var(--muted)}
.history-filters :is(select,input){width:100%;min-width:0;min-height:44px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);font:inherit;font-size:16px}
.history-dates{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:16px}.history-dates[hidden]{display:none}
.history-load-status{font-size:13px;color:var(--muted);margin-top:12px}.history-month{margin-top:28px}.history-month>h3{font-size:16px;margin-bottom:12px;color:var(--muted)}
.history-pagination{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:24px;font-size:13px}.history-pagination .button{padding:10px 14px;min-height:44px}
.mood-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:stretch;gap:32px;padding:28px 32px;max-width:none;margin:32px 40px}
.mood-choice{max-width:380px}.mood-choice h2{font-family:var(--serif);font-size:28px;line-height:1.55;margin:12px 0 24px}
.mood-choice .reflection-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mood-choice .reflection-options button{text-align:center;padding:11px 10px;border-radius:10px;font-size:14px}
.mood-choice small{display:block;margin-top:20px;font-size:11px;line-height:1.7}
.mood-panel button:focus-visible{outline:2px solid var(--rose);outline-offset:2px}.mood-panel button[data-pointer-focus]:focus{outline:none;box-shadow:none}
.mood-response{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:0;min-width:0;text-align:center}
.mood-response .reflection-reply{margin:0 auto;max-width:27ch;min-height:3.6em;font-size:14px;line-height:1.8;color:var(--ink)}
.mood-scene{display:grid;justify-items:center;align-content:center;min-height:280px;height:100%;width:100%;margin:0 auto;overflow:hidden}
.mood-vignette{position:relative;display:grid;place-items:center;width:240px;max-width:100%;height:220px;isolation:isolate}
.mood-vignette img{position:relative;width:124px;height:174px;object-fit:contain;transform-origin:50% 90%;animation-duration:1100ms;animation-timing-function:cubic-bezier(.22,.65,.3,1);animation-fill-mode:both}
.mood-orbit{position:absolute;width:136px;height:136px;border-radius:50%;z-index:-1;animation:mood-bloom 950ms ease-out both}
.mood-ground{position:absolute;bottom:20px;width:76px;height:8px;border-radius:50%;background:#65565317}
.mood-vignette i{position:absolute;width:6px;height:6px;border-radius:50%;background:#c6a56f;left:32px;top:60px;animation:mood-spark 1000ms ease-out both}
.mood-vignette i:nth-last-child(2){left:auto;right:28px;top:40px;animation-delay:100ms;background:#91a791}
.mood-vignette i:last-child{left:auto;right:38px;top:108px;animation-delay:180ms;background:#9aacbf}
.mood-lift img{animation-name:mood-lift;animation-duration:800ms}.mood-lift .mood-ground{animation:mood-shadow 800ms ease-in-out both}.mood-sway img{animation-name:mood-sway;animation-duration:1500ms}.mood-float img{animation-name:mood-float;animation-duration:1500ms}.mood-ponder img{animation-name:mood-ponder;animation-duration:1200ms}.mood-ponder i{display:none}
.mood-welcome{height:240px;width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:12px;padding:24px 12px;box-sizing:border-box}.mood-welcome img{width:100%;height:160px;object-fit:contain;transform-origin:50% 95%;animation:mood-walk-in 2200ms cubic-bezier(.22,.65,.3,1) both;animation-play-state:paused}.mood-scene-caption{font-size:12px;color:var(--muted);padding:0 12px 14px;text-align:center}
.mood-welcome img:nth-child(2){animation-delay:150ms}.mood-welcome img:nth-child(3){animation-delay:300ms}.mood-welcome img:nth-child(4){animation-delay:450ms}.mood-welcome[data-entered] img{animation-play-state:running}
.mood-scene{container-type:inline-size}.mood-welcome{display:flex;justify-content:center;align-items:flex-end;min-width:0}.mood-welcome img{width:auto;flex:none;max-width:none;height:min(160px,calc((100cqw - 60px)/2.71))}
@keyframes mood-walk-in{0%{opacity:0;transform:translateX(30px) rotate(3deg)}18%{opacity:1;transform:translate(23px,-2px) rotate(-2deg)}40%{transform:translate(14px,0) rotate(2deg)}62%{transform:translate(7px,-2px) rotate(-1deg)}82%{transform:translate(2px,0)}100%{opacity:1;transform:none}}
@keyframes mood-lift{0%,100%{transform:translateY(0)}15%{transform:translateY(2px);animation-timing-function:cubic-bezier(.2,.7,.3,1)}45%{transform:translateY(-10px);animation-timing-function:cubic-bezier(.4,0,.7,1)}80%{transform:translateY(0)}}
@keyframes mood-shadow{0%,100%{transform:scaleX(1);opacity:1}45%{transform:scaleX(.85);opacity:.6}}
@keyframes mood-sway{0%,100%{transform:rotate(0)}25%{transform:rotate(-10deg)}65%{transform:rotate(8deg)}}
@keyframes mood-float{0%,100%{transform:translateY(0)}45%{transform:translateY(-18px) rotate(3deg)}}
@keyframes mood-ponder{0%,100%{transform:rotate(0)}35%,60%{transform:rotate(-3deg)}}
@keyframes mood-bloom{from{transform:scale(.8);opacity:.3}to{transform:scale(1);opacity:1}}
@keyframes mood-spark{0%{transform:translateY(8px) scale(.4);opacity:0}35%{opacity:.8}100%{transform:translateY(-16px) scale(.5);opacity:0}}
@media(prefers-reduced-motion:reduce){.mood-vignette *,.mood-welcome img{animation:none!important}.mood-vignette i{display:none}}
@media(max-width:767px){.mood-panel{grid-template-columns:1fr;gap:8px;margin:24px;padding:24px 20px 12px}.mood-choice{max-width:380px;width:100%;margin:auto;text-align:center}.mood-choice h2{font-size:24px;margin:10px 0 20px}.mood-response{padding:0}.mood-scene{min-height:200px;margin-bottom:0}.mood-welcome{height:200px;gap:6px;max-width:380px;padding:24px 0}.mood-welcome img{width:100%;height:126px}.history-entry .delete-record{right:16px;bottom:24px}}
@media(max-width:767px){.mood-welcome img{width:auto;height:min(126px,calc((100cqw - 18px)/2.71))}}
.reflection-panel button:focus-visible{outline:2px solid var(--rose);outline-offset:2px}.reflection-panel button[data-pointer-focus]:focus{outline:none;box-shadow:none}
.mood-panel{position:relative;isolation:isolate;overflow:hidden;background:var(--white)}
.mood-panel::before{content:"";position:absolute;inset:0;z-index:-1;background:url('./crayon-b.webp') center/cover;opacity:.7;pointer-events:none}
.mood-choice .reflection-options button:not([aria-pressed=true]){background:#fffefbea}
.result-hero.result-paper{position:relative;isolation:isolate;overflow:hidden;background:var(--white)}
.result-hero.result-paper::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#fffdfb80 0%,#fffdfb00 18%,#fffdfb00 34%,#fffdfbd9 56%,#fffdfbeb 100%)}
.result-color-wash{position:absolute;inset:0;display:flex;z-index:-1;isolation:isolate;opacity:1;pointer-events:none}
.result-color-wash>span{min-width:0;background:var(--wash)}
.result-color-wash::after{content:"";position:absolute;inset:0;background:url('./crayon-b.webp') center/cover;filter:grayscale(1) brightness(.666667) contrast(3);mix-blend-mode:screen}
.result-character-action{display:grid;place-items:center;width:min(135px,23%);height:100%;padding:0;border:0;background:none;cursor:pointer;touch-action:manipulation;border-radius:18px}
.result-character-action :is(.character-art,.character-head),.result-character-action .report-character::after{animation:none}
.result-character-action:only-child{width:160px}.result-character-action .report-character{width:100%;height:100%}.result-character-action:focus-visible{outline:2px solid var(--rose);outline-offset:4px}.result-character-action[data-pointer-focus]:focus{outline:none;box-shadow:none}
.reflection-other{margin-top:18px}.reflection-other[hidden]{display:none}.reflection-other label{display:block;font-size:14px}.reflection-other textarea{display:block;box-sizing:border-box;width:100%;margin:8px 0 12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--white);color:var(--ink);font:inherit;resize:vertical}.reflection-other .button{min-height:44px}
.result-hero.result-paper{border:1px solid var(--line);padding:26px 24px;color:var(--ink)}
.result-paper .result-characters{margin:18px auto;height:155px}.result-paper .result-characters .report-character{max-height:150px}
.result-paper h1{font-size:30px;margin:12px 0}.result-paper .result-type{color:var(--muted)}
.result-intros{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:18px;margin:20px auto 0;max-width:640px}
.result-paper .result-intro{margin:0;max-width:none;text-align:left;font-size:14px;line-height:1.85}.result-intro>strong{display:block;font-size:14px;margin-bottom:6px}
.result-paper .result-stamp{margin-top:20px;color:var(--muted)}
@media(max-width:480px){.result-hero.result-paper{padding:22px 18px}.result-paper h1{font-size:25px}.result-paper .result-characters{height:130px}.result-paper .result-characters .report-character{max-height:125px}}
@media(max-width:767px){.organized-footer{grid-template-columns:1fr 1fr;gap:24px}.organized-footer .footer-brand{grid-column:1/-1;border-bottom:1px solid var(--line);padding-bottom:20px}.organized-footer .footer-contact p{font-size:12px}.history-page{padding-inline:20px}}
