/* Tactile field-journal navigation, loaded last to own the final cascade. */
body .town-view>.task-preview{overflow:visible;transition:width .32s cubic-bezier(.22,.82,.24,1),min-height .32s cubic-bezier(.22,.82,.24,1),transform .32s ease;transform-origin:100% 100%}
body .town-view>.task-preview .task-book-toggle{position:absolute;z-index:8;border:0;background:transparent;color:#f5eccf;cursor:pointer}
body .town-view>.task-preview:not(.is-collapsed) .task-book-toggle{top:-17px;left:-18px;width:42px;height:42px;padding:0;filter:drop-shadow(0 4px 5px rgba(42,51,30,.28))}
body .town-view>.task-preview:not(.is-collapsed) .task-book-toggle img{width:100%;height:100%;object-fit:contain}
body .town-view>.task-preview:not(.is-collapsed) .task-book-toggle span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
body .town-view>.task-preview.is-collapsed{right:9px;bottom:max(88px,calc(var(--safe-bottom) + 82px));width:122px;max-width:122px;min-height:98px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;transform:rotate(-2.5deg)}
body .town-view>.task-preview.is-collapsed::before,body .town-view>.task-preview.is-collapsed::after,body .town-view>.task-preview.is-collapsed>:not(.task-book-toggle){display:none!important}
body .town-view>.task-preview.is-collapsed .task-book-toggle{inset:-13px -5px -7px -15px;padding:0;filter:drop-shadow(0 10px 8px rgba(36,48,24,.35))}
body .town-view>.task-preview.is-collapsed .task-book-toggle img{width:100%;height:100%;object-fit:contain}
body .town-view>.task-preview.is-collapsed .task-book-toggle span{position:absolute;right:4px;bottom:10px;padding:4px 8px 5px;border:1px solid rgba(109,86,40,.42);border-radius:2px;background:url("../../assets/runtime/ui/optimized/task-journal-pattern-today.webp") center/cover;color:#3e4c31;font:700 .68rem/1 Georgia,"Noto Serif SC",serif;letter-spacing:.08em;box-shadow:0 2px 4px rgba(43,49,30,.22);white-space:nowrap}
body .town-view>.task-preview .journal-section-tabs{position:absolute;z-index:-1;top:31px;right:-40px;display:grid;gap:3px;width:43px}
body .town-view>.task-preview .journal-section-tabs button{width:43px;min-height:42px;display:grid;place-items:center;gap:1px;padding:4px 2px 3px 8px;border:1px solid rgba(69,76,48,.38);border-left:0;border-radius:0 8px 8px 0;background:#9a9d74 url("../../assets/runtime/ui/optimized/task-journal-pattern-records.webp") center/cover;color:#37402d;box-shadow:3px 3px 5px rgba(39,45,29,.18);cursor:pointer}
body .town-view>.task-preview .journal-section-tabs button:nth-child(2){background-color:#85906c;transform:translateX(3px)}
body .town-view>.task-preview .journal-section-tabs button:nth-child(3){background-color:#aaa392;transform:translateX(1px)}
body .town-view>.task-preview .journal-section-tabs button:nth-child(4){background-color:#b49a72;transform:translateX(4px)}
body .town-view>.task-preview .journal-section-tabs button:nth-child(5){background-color:#87936e;transform:translateX(2px)}
body .town-view>.task-preview .journal-section-tabs button.is-active{filter:brightness(1.12)}
body .town-view>.task-preview .journal-section-tabs img{width:19px;height:19px;object-fit:contain;border-radius:3px}
body .town-view>.task-preview .journal-section-tabs span{font:700 .56rem/1 "Noto Serif SC",Georgia,serif}
body .town-view>.task-preview:not(.is-collapsed){right:52px}
body .town-view>.task-preview:not(.is-collapsed) .task-preview-row:nth-child(n+2){display:grid}
@media (max-width:360px),(max-height:700px){body .town-view>.task-preview.is-collapsed{width:108px;max-width:108px;min-height:86px}body .town-view>.task-preview .journal-section-tabs{right:-36px;width:39px}body .town-view>.task-preview .journal-section-tabs button{width:39px;min-height:38px}}

/* Cover lift, page settle, then bookmark fan-out. */
body .town-view>.task-preview.is-opening{animation:journal-open .68s cubic-bezier(.18,.86,.25,1) both}
body .town-view>.task-preview.is-opening::after{animation:journal-page-flip .62s cubic-bezier(.3,.72,.2,1) both;transform-origin:left center}
body .town-view>.task-preview.is-opening .task-preview-book-crest,
body .town-view>.task-preview.is-opening .section-heading,
body .town-view>.task-preview.is-opening .task-preview-trigger,
body .town-view>.task-preview.is-opening .task-preview-page-foot{animation:journal-ink-arrive .42s .22s ease both}
body .town-view>.task-preview.is-opening .task-preview-row{animation:journal-row-arrive .42s ease both}
body .town-view>.task-preview.is-opening .task-preview-row:nth-child(1){animation-delay:.24s}
body .town-view>.task-preview.is-opening .task-preview-row:nth-child(2){animation-delay:.32s}
body .town-view>.task-preview.is-opening .task-preview-row:nth-child(3){animation-delay:.4s}
body .town-view>.task-preview.is-opening .journal-section-tabs button{animation:journal-tab-slide .34s cubic-bezier(.2,.86,.3,1) both}
body .town-view>.task-preview.is-opening .journal-section-tabs button:nth-child(1){animation-delay:.28s}
body .town-view>.task-preview.is-opening .journal-section-tabs button:nth-child(2){animation-delay:.34s}
body .town-view>.task-preview.is-opening .journal-section-tabs button:nth-child(3){animation-delay:.4s}
body .town-view>.task-preview.is-opening .journal-section-tabs button:nth-child(4){animation-delay:.46s}
body .town-view>.task-preview.is-opening .journal-section-tabs button:nth-child(5){animation-delay:.52s}
body .town-view>.task-preview.is-closing{animation:journal-close .28s cubic-bezier(.55,.04,.78,.24) both;pointer-events:none}

@keyframes journal-open{
  0%{opacity:.35;transform:translate(38px,34px) rotate(-5deg) scale(.42);filter:drop-shadow(0 4px 3px rgba(35,43,25,.2))}
  38%{opacity:1;transform:translate(-4px,-7px) rotate(.8deg) scale(1.035);filter:drop-shadow(0 18px 13px rgba(35,43,25,.32))}
  72%{transform:translate(1px,1px) rotate(-.25deg) scale(.992)}
  100%{transform:none;filter:none}
}
@keyframes journal-page-flip{
  0%{opacity:.2;transform:perspective(650px) rotateY(-72deg) skewY(-2deg)}
  58%{opacity:1;transform:perspective(650px) rotateY(8deg)}
  100%{transform:perspective(650px) rotateY(0)}
}
@keyframes journal-ink-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes journal-row-arrive{from{opacity:0;transform:translateX(14px) rotate(.4deg)}to{opacity:1;transform:none}}
@keyframes journal-tab-slide{from{opacity:0;transform:translateX(-25px)}to{opacity:1}}
@keyframes journal-close{from{opacity:1;transform:none}to{opacity:.2;transform:translate(38px,34px) rotate(-5deg) scale(.42)}}

/* Shared paper/cloth material vocabulary for the rest of the product. */
:root{
  --zenow-paper:url("../../assets/runtime/ui/optimized/task-journal-pattern-today.webp");
  --zenow-ink:#34432f;
  --zenow-rule:rgba(90,91,59,.24);
  --zenow-paper-shadow:0 12px 28px rgba(48,53,34,.22),inset 0 0 0 1px rgba(255,252,225,.7);
}

.auth-card,.ai-panel-card,.home-panel,.home-growth-card,.home-decoration-card,
.shop-card,.shop-confirm-card,.building-upgrade-card,.event-card,.lottery-sheet,
.questionnaire-panel,.questionnaire-entry-card,.task-card,.task-record-card,
.journal-story-panel,.health-connection-panel{
  color:var(--zenow-ink);
  border-color:rgba(101,91,55,.32)!important;
  background-color:#f3edd7!important;
  background-image:var(--zenow-paper)!important;
  background-size:cover!important;
  box-shadow:var(--zenow-paper-shadow)!important;
}

.auth-card,.ai-panel-card,.home-panel,.shop-card,.shop-confirm-card,
.building-upgrade-card,.event-card,.questionnaire-panel,.health-connection-panel{position:relative}

.auth-card::before,.ai-panel-card::before,.home-panel::before,.shop-card::before,
.shop-confirm-card::before,.building-upgrade-card::before,.event-card::before,
.questionnaire-panel::before,.health-connection-panel::before{
  content:"";
  position:absolute;
  top:-7px;
  left:50%;
  width:52px;
  height:15px;
  transform:translateX(-50%) rotate(-1.5deg);
  background:rgba(220,199,139,.48);
  box-shadow:inset 0 0 5px rgba(106,83,36,.12);
  pointer-events:none;
}

.card-heading,.health-panel-head,.skill-card-book-head{
  border-bottom:1px solid var(--zenow-rule)!important;
  font-family:Georgia,"Noto Serif SC","Songti SC",serif;
}

.primary-button,.secondary-button,.ghost-button,.compact-button,
.shop-card-action,.task-card-action{
  font-family:"Noto Serif SC","Songti SC",Georgia,serif;
  box-shadow:0 3px 0 rgba(57,72,45,.24),0 7px 12px rgba(43,51,32,.13);
}

.building-layer-close{
  background-image:var(--zenow-paper)!important;
  color:var(--zenow-ink)!important;
  border:1px solid rgba(90,84,53,.28)!important;
  box-shadow:0 6px 13px rgba(44,51,34,.2)!important;
}

@media (prefers-reduced-motion:reduce){
  body .town-view>.task-preview,
  body .town-view>.task-preview *,
  body .town-view>.task-preview::after{animation:none!important;transition:none!important}
}

/* Screenshot QA fixes: quiet bookmark swatches and a stable skill-book header. */
body .town-view>.task-preview .journal-section-tabs button{
  background-image:none!important;
  box-shadow:3px 3px 6px rgba(39,45,29,.16),inset 0 0 0 1px rgba(255,252,226,.24);
}
body .town-view>.task-preview .journal-section-tabs button:nth-child(1){background-color:#d8d0a8}
body .town-view>.task-preview .journal-section-tabs button:nth-child(2){background-color:#aeb996}
body .town-view>.task-preview .journal-section-tabs button:nth-child(3){background-color:#aaa8a0}
body .town-view>.task-preview .journal-section-tabs button:nth-child(4){background-color:#bea987}
body .town-view>.task-preview .journal-section-tabs button:nth-child(5){background-color:#929f82}
body .town-view>.task-preview .journal-section-tabs img{
  width:18px;
  height:18px;
  padding:1px;
  border-radius:50%;
  background:rgba(247,241,213,.42);
  mix-blend-mode:multiply;
  filter:saturate(.62) contrast(.9);
}

.map-panel .skill-card-tray[open]>.skill-card-book-head{
  position:relative;
  min-height:58px;
  margin-right:0;
  padding-right:112px;
}
.map-panel .skill-card-tray[open]>.skill-card-book-head>span{
  position:absolute;
  top:4px;
  right:56px;
  min-width:64px;
  min-height:34px;
  display:grid;
  place-items:center;
  padding:4px 8px;
}
.map-panel .skill-card-tray[open]>summary{
  top:15px;
  right:15px;
  width:40px;
  min-width:40px;
  height:40px;
  min-height:40px;
  display:grid;
  place-items:center;
  padding:0;
  margin:0;
  line-height:1;
  transform:none;
}
.map-panel .skill-card-tray[open]>summary::before{
  display:block;
  margin:0;
  transform:translateY(-1px);
}