/* A single achievement journal. The battle table is never resized by it. */
.achievement-overlay {
  position:fixed;inset:0;z-index:140;display:grid;place-items:center;
  padding:max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom));
  isolation:isolate;
}
.achievement-backdrop {position:absolute;inset:0;background:#04100dde;backdrop-filter:blur(6px);border:0;width:100%;height:100%;}
.achievement-panel {
  position:relative;z-index:1;display:flex;flex-direction:column;min-height:0;
  width:min(600px,100%);height:min(790px,calc(100dvh - 36px));color:#f5eccc;
  background:linear-gradient(115deg,#0e2421,#193e34 65%,#122821);
  border:1.5px solid #dcb96d;border-radius:17px;overflow:hidden;
  box-shadow:0 2px 0 #f9e1a337 inset,0 0 0 5px #ba93491a,0 24px 100px #000d;
  animation:achievement-open .45s cubic-bezier(.17,.7,.2,1) both;
}
.achievement-panel button {touch-action:manipulation;}
.achievement-header {
  position:relative;flex-shrink:0;padding:14px 18px 15px;overflow:hidden;
  background:radial-gradient(ellipse at 87% -8%,#fff0b332,transparent 64%),linear-gradient(140deg,#28483c,#122a25);
  border-bottom:1px solid #8e85564d;
}
.achievement-header:before {content:"✦";position:absolute;right:55px;top:-40px;font-size:156px;color:#e3bc6830;line-height:1;transform:rotate(12deg);pointer-events:none;}
.achievement-kicker {position:relative;font-size:9px;letter-spacing:.28em;color:#ddb86f;font-weight:800;}
.achievement-headline {position:relative;display:flex;justify-content:space-between;gap:10px;align-items:center;}
.achievement-headline h2 {font-size:34px;letter-spacing:.1em;line-height:1.1;margin:5px 0 0;color:#ffe9ac;text-shadow:0 2px 20px #ffc9654d;}
.achievement-headline h2 span {color:#eed0a1;}
.achievement-headline p {font-size:11px;margin:5px 0 0;color:#d9e5d5;}
.achievement-x {
  width:42px;height:42px;border-radius:50%;font-size:28px;line-height:1;
  background:#365549;color:#fff2d9;border:1px solid #b3a673;flex-shrink:0;
}
.achievement-topline {position:relative;display:flex;align-items:center;gap:11px;margin-top:14px;}
.achievement-topline strong {font-size:25px;line-height:1;color:#ffde94;white-space:nowrap;font-variant-numeric:tabular-nums;}
.achievement-topline strong span {font-size:11px;font-weight:550;color:#c6c8aa;}
.achievement-topline>span {font-size:10px;color:#e7d4a1;white-space:nowrap;}
.achievement-meter {height:8px;background:#0e211d;border-radius:10px;border:1px solid #587463;flex:1;overflow:hidden;}
.achievement-meter i {display:block;height:100%;background:linear-gradient(90deg,#ca9c3d,#ffe5a1,#f1b964);border-radius:10px;box-shadow:0 0 10px #ffe59e;}
.achievement-tabs {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:#112720;border-bottom:1px solid #4d6c53;flex-shrink:0;}
.achievement-tabs button {min-width:0;border:0;border-bottom:3px solid transparent;background:transparent;color:#adc2b6;display:flex;align-items:center;justify-content:center;gap:4px;flex-direction:column;padding:9px 1px 8px;font-size:11px;font-weight:700;}
.achievement-tabs button span {font-size:18px;font-weight:800;line-height:1.1;}
.achievement-tabs button[aria-pressed="true"] {color:#ffe0a1;border-bottom-color:#ffd789;background:#36503b;}
.achievement-scroll {padding:15px 16px 22px;flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;}
.achievement-section-heading {display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin:0 0 5px;border-bottom:1px solid #8d79524c;padding-bottom:11px;}
.achievement-section-heading strong {font-size:18px;color:#f6d28e;}
.achievement-section-heading span {font-size:13px;color:#bcd9c4;font-variant-numeric:tabular-nums;}
.achievement-description {font-size:11px;line-height:1.65;color:#c2d5c8;margin:9px 0 9px;}
.achievement-list {display:flex;flex-direction:column;}
.achievement-line {display:flex;align-items:center;gap:10px;border-bottom:1px solid #82987829;padding:11px 2px;min-height:61px;}
.achievement-medal {
  width:33px;height:33px;flex-shrink:0;border:1px solid #62796a;border-radius:50%;
  display:grid;place-items:center;background:#1b312b;color:#8fa298;font-size:19px;
}
.achievement-line.done .achievement-medal {color:#492a08;background:radial-gradient(circle at 30% 20%,#fff1bb,#e8b653 75%);border-color:#ffe9a1;box-shadow:0 0 13px #edc36e3d;}
.achievement-line-copy {flex:1;min-width:0;}
.achievement-line-copy strong {display:block;font-size:14px;font-weight:800;color:#f2e6ca;line-height:1.4;}
.achievement-line.locked .achievement-line-copy strong {color:#b7c8b9;}
.achievement-line-copy p {margin:3px 0 0;font-size:11px;line-height:1.55;color:#b0c1b4;overflow-wrap:anywhere;}
.achievement-line-state {display:flex;flex-direction:column;align-items:flex-end;gap:3px;min-width:48px;color:#a1b4a6;font-size:10px;}
.achievement-line-state b {color:#ffe39f;font-size:10px;}
.achievement-line-state small {font-size:9px;color:#b5cbbb;white-space:nowrap;}
.achievement-recent {margin-top:25px;padding:12px;border-radius:10px;background:#2b4838;border:1px solid #9e9b675e;}
.achievement-recent h3 {margin:0;color:#efd496;font-size:13px;}
.achievement-recent p {margin:6px 0 0;font-size:11px;color:#dfebdf;line-height:1.7;}
.achievement-word-intro {display:flex;flex-direction:column;gap:6px;padding-bottom:13px;}
.achievement-word-intro strong {font-size:23px;color:#ffe1a1;}
.achievement-word-intro span {font-size:12px;color:#c8d9c7;line-height:1.65;}
.achievement-word-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
.achievement-word {
  display:flex;align-items:center;justify-content:space-between;gap:4px;
  padding:10px 8px;text-align:left;border:1px solid #547768;border-radius:8px;
  background:#17342c;color:#f6ecda;min-width:0;
}
.achievement-word strong {font-size:12px;white-space:normal;}
.achievement-word small {font-size:9px;color:#b1c8b9;line-height:1.3;text-align:right;}
.achievement-word.seen {border-color:#8b9667;background:#2a4234;}
.achievement-word.understood {border-color:#d9b76a;background:#3b4934;}
.achievement-word.understood small {color:#ffe2a0;}
.achievement-word-extra {margin-top:20px;border-top:1px solid #718c6e;padding-top:12px;}
.achievement-word-extra summary {cursor:pointer;color:#f9d58e;font-size:14px;font-weight:800;margin-bottom:12px;}
.achievement-word-extra-single {margin-top:14px;max-width:300px;}
.achievement-footer {flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 14px max(9px,env(safe-area-inset-bottom));background:#10251f;border-top:1px solid #71815a;}
.achievement-footer span {font-size:9px;color:#9db5a5;}
.achievement-footer button {background:#e7bc6d;border:1px solid #f7d99c;border-radius:8px;min-height:38px;padding:6px 14px;color:#1c2c22;font-size:12px;font-weight:850;}
.achievement-entry {border:1px solid #ddbd7b!important;background:linear-gradient(100deg,#4c5840,#263e34)!important;color:#fff3ce!important;}
.achievement-entry span {color:#ffe1a3;}
.achievement-entry small {color:#d2dbc5!important;}
.menu-options .achievement-menu-entry {border:1px solid #d3b47b;color:#ffefc1;background:#2c513f;}
.study-read {background:#ecd08c!important;color:#26372b!important;border-color:#e7d49f!important;font-weight:800!important;}
.study-read[disabled] {opacity:.7;}

/* Cinematic burst layered above the game but never eats input. */
.achievement-celebration {position:fixed;inset:0;z-index:210;pointer-events:none;display:grid;place-items:center;overflow:hidden;isolation:isolate;}
.achievement-rays {position:absolute;inset:-55%;opacity:0;
 background:repeating-conic-gradient(from 9deg at 50% 50%,#ffedac50 0deg 5deg,transparent 6deg 19deg);
 animation:achievement-rays 3.6s ease-out forwards;filter:blur(2px);}
.achievement-celebration:before {content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 46%,#f4c04c22,#0000 60%);animation:achievement-backflash 3.6s both;}
.achievement-spotlight {
 display:flex;align-items:center;flex-direction:column;position:relative;
 width:min(380px,calc(100vw - 30px));padding:23px 22px 18px;text-align:center;
 border:1.5px solid #fff2b0;border-radius:21px;
 background:radial-gradient(ellipse at 50% 0%,#b08034,#25483b 62%,#142c27);
 box-shadow:0 0 0 7px #ffe79d26,0 0 45px #f9c25599,0 18px 80px #0009;
 animation:achievement-splash 3.6s cubic-bezier(.18,.75,.2,1) forwards;
}
.achievement-spotlight:after {content:"";position:absolute;inset:5px;border:1px solid #fce9b04d;border-radius:16px;pointer-events:none;}
.achievement-unlock-small {font-size:10px;letter-spacing:.28em;font-weight:850;color:#fff0b4;}
.achievement-unlock-icon {font-size:60px;color:#ffde7e;text-shadow:0 0 21px #fff7c4;line-height:1.15;animation:achievement-star 1s ease-out;}
.achievement-spotlight>strong {font-size:42px;letter-spacing:.16em;color:#fff1c6;line-height:1.1;text-shadow:0 3px 18px #ffd978b8;}
.achievement-spotlight h2 {font-size:22px;color:#fff8e0;margin:12px 0 14px;line-height:1.25;text-shadow:0 1px 6px #172315;}
.achievement-celebrate-person {display:flex;align-items:center;gap:9px;width:100%;background:#162c22b8;border:1px solid #e6c37e7d;border-radius:12px;min-height:80px;text-align:left;overflow:hidden;}
.achievement-celebrate-person img {width:85px;height:92px;object-fit:cover;object-position:center top;align-self:flex-end;-webkit-mask-image:linear-gradient(0deg,transparent,#000 20%);}
.achievement-celebrate-person div {flex:1;min-width:0;padding:8px 8px 8px 0;}
.achievement-celebrate-person b {color:#fbd493;font-size:12px;}
.achievement-celebrate-person p {margin:5px 0 0;color:#f5efe4;font-size:12px;line-height:1.65;}
.achievement-sparks {position:absolute;inset:0;pointer-events:none;}
.achievement-sparks i {position:absolute;top:50%;left:50%;width:7px;height:13px;background:linear-gradient(#fff4ba,#eeb147);border-radius:2px;opacity:0;animation:achievement-confetti 2s cubic-bezier(.1,.66,.2,1) both;animation-delay:calc(var(--i)*16ms);transform-origin:50% 50%;}
.achievement-sparks i:nth-child(3n) {background:#b5f7d4;border-radius:50%;}
.achievement-sparks i:nth-child(4n) {background:#fff3df;height:7px;}
@keyframes achievement-open {from {opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes achievement-splash {0%{opacity:0;transform:translateY(110px) scale(.42) rotate(-7deg)}
  17%{opacity:1;transform:translateY(-18px) scale(1.1) rotate(2deg)}
  25%{transform:translateY(0) scale(1) rotate(0)}
  84%{opacity:1;transform:translateY(0) scale(1)}
  100%{opacity:0;transform:translateY(-45px) scale(.9)}}
@keyframes achievement-rays {0%{opacity:0;transform:rotate(-30deg) scale(.3)}15%{opacity:.9}65%{opacity:.2}100%{opacity:0;transform:rotate(40deg) scale(1.4)}}
@keyframes achievement-backflash {0%,100%{opacity:0}13%{opacity:1}35%{opacity:.4}}
@keyframes achievement-star {0%{transform:scale(.1) rotate(-130deg);opacity:0}55%{transform:scale(1.4) rotate(15deg);opacity:1}100%{transform:none}}
@keyframes achievement-confetti {0%{opacity:0;transform:rotate(var(--angle)) translateY(0) scale(.2)}
  17%{opacity:1}70%{opacity:1}
  100%{opacity:0;transform:rotate(var(--angle)) translateY(calc(-1*var(--travel))) rotate(260deg) scale(.7)}}
@media (max-height:640px) {.achievement-spotlight {padding:12px 14px 10px}.achievement-unlock-icon {font-size:39px}.achievement-spotlight>strong {font-size:33px}.achievement-spotlight h2 {margin:6px 0 8px;font-size:18px}.achievement-celebrate-person img {height:65px;width:60px}.achievement-celebrate-person {min-height:62px}}
@media (max-width:350px) {.achievement-scroll {padding:12px 10px 18px}.achievement-header {padding:12px}.achievement-line {gap:7px}.achievement-line-copy p {font-size:9px}.achievement-word-grid {gap:5px}.achievement-word {padding:8px 6px}}
@media (prefers-reduced-motion:reduce) {
 .achievement-panel,.achievement-rays,.achievement-spotlight,.achievement-unlock-icon,.achievement-sparks i {animation:none!important;}
 .achievement-rays,.achievement-sparks {display:none}.achievement-spotlight {opacity:1}
}