.pet-workspace { max-width: 1060px; padding-top: 1.2rem; padding-bottom: 2rem; --pet-accent: #70dfc7; --pet-forest: #102b29; }
.pet-workspace [hidden] { display: none !important; }
.pet-heading { display: flex; gap: .75rem; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.pet-heading h1 { font-family:var(--sans);font-weight:750;font-size:clamp(1.7rem,3vw,2.25rem);margin:.2rem 0;line-height:1.2;letter-spacing:-.025em; }
.pet-heading p { margin: .35rem 0; color: var(--muted); }
.pet-workspace button,.pet-workspace input,.pet-workspace select { min-height: 44px; font: inherit; }
.pet-workspace button { cursor: pointer; }
.pet-workspace button:disabled { opacity: .5; cursor: wait; }
.pet-workspace :focus-visible { outline: 3px solid var(--pet-accent); outline-offset: 3px; }
.pet-stock-button { flex-shrink: 0; display: grid; gap: .12rem; justify-items: center; padding: .45rem .7rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); color: var(--text); font-size: 1.3rem !important; }
.pet-stock-button span { font-size: .62rem; }
.pet-character-form { display: flex; align-items: center; gap: .7rem; margin-bottom: .7rem; }
.pet-character-form label { font-size: .8rem; color: var(--muted); }
.pet-character-form select { width: auto; max-width: 70%; min-width: 0; }
.pet-context { font-size: .87rem; color: var(--muted); padding: .4rem 0; overflow-wrap: anywhere; }
.pet-context strong { color: var(--text); }
.pet-context p { margin: .25rem 0; }
.pet-context details { margin: .5rem 0; }
.pet-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .25rem; padding: .35rem; margin: .7rem 0 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.pet-tabs button { min-width: 0; background: none; color: var(--muted); border: 1px solid transparent; border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; gap: .35rem; font-size: .88rem; }
.pet-tabs button[aria-selected=true] { color: var(--pet-accent); background: var(--pet-forest); border-color: #35645b; font-weight: 700; }
.pet-card { padding: 1rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); margin-bottom: .8rem; min-width: 0; }
.pet-card h2,.pet-card h3 { margin-top: 0; }
.pet-action { background: radial-gradient(ellipse at 50% 10%,#24453a 0,transparent 60%),linear-gradient(155deg,#18221f,var(--surface)); border-color: #596248; }
.pet-action-head { display: flex; align-items: center; gap: 1rem; }
.pet-portrait { width: 105px; height: 105px; object-fit: contain; flex-shrink: 0; filter: drop-shadow(0 6px 12px #0006); }
.pet-action h2 { font-size: 1.45rem; margin: .25rem 0; }
.pet-eyebrow { font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); }
.pet-action-target { font-size: 1.08rem; font-weight: 700; margin: .6rem 0; }
.pet-badge { display: inline-flex; align-items: center; gap: .4rem; font-size: .78rem; font-weight: 700; padding: .35rem .65rem; border-radius: 999px; border: 1px solid #448170; background: #183b31; color: #bcefd2; }
.pet-badge[data-badge=SAVE],.pet-badge[data-badge=HOLD],.pet-badge[data-badge=WAIT] { background: #3b3220; border-color: #8c7949; color: #f5df9c; }
.pet-badge[data-badge=GATE] { background: #273751; border-color: #5a7193; color: #c8defb; }
.pet-primary { width: 100%; display: block; padding: .7rem 1rem; margin-top: .7rem; border: 1px solid #84e5d0; border-radius: var(--radius-sm); color: #072a23; background: var(--pet-accent); font-weight: 750 !important; }
.pet-secondary { border: 1px solid var(--border); background: var(--surface-2); color: var(--text); border-radius: var(--radius-sm); padding: .55rem .7rem; }
.pet-workspace summary { cursor: pointer; min-height: 44px; padding: .7rem 0; color: var(--gold-light); }
.pet-workspace details>p { font-size: .85rem; }
.pet-workspace details ul { padding-left: 1.3rem; }
.pet-costs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .4rem; margin: .8rem 0; }
.pet-cost { border-radius: .55rem; padding: .5rem .65rem; background: #0003; min-width: 0; }
.pet-cost strong { display: block; font-variant-numeric: tabular-nums; }
.pet-cost span { color: var(--muted); font-size: .72rem; }
.pet-small { font-size: .78rem; color: var(--muted); line-height: 1.45; overflow-wrap: anywhere; }
.pet-notice { font-size: .83rem; color: var(--pet-accent); margin: .3rem 0; }
.pet-notice[data-error=true] { color: #ffd4ad; }
.pet-field { display: grid; gap: .3rem; margin-bottom: .75rem; min-width: 0; }
.pet-field label { font-size: .82rem; color: var(--muted); }
.pet-field input,.pet-field select { width: 100%; min-width: 0; padding: .55rem .65rem; border: 1px solid var(--border); background: var(--surface-2); color: var(--text); border-radius: .55rem; }
.pet-field input:invalid:not(:placeholder-shown) { border-color: #da9270; }
.pet-check { display: flex; align-items: center; gap: .5rem; font-size: .82rem; margin: .5rem 0; }
.pet-check input { width: 20px; flex-shrink: 0; margin: 0; }
.pet-path { list-style: none; display: grid; gap: .6rem; padding: 0; }
.pet-path li { display:flex;gap:.6rem;align-items:center;padding:.6rem .7rem;border-left:3px solid #517b6a;background:var(--surface-2);border-radius:0 .5rem .5rem 0;font-size:.87rem; }
.pet-path p { margin:.2rem 0 0; }
.pet-refine-stat { padding: .8rem; border: 1px solid var(--border); border-radius: .6rem; margin-bottom: .65rem; min-width: 0; }
.pet-refine-stat legend { padding: 0 .3rem; font-size: .83rem; }
.pet-refine-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65rem; }
.pet-refine-columns .pet-field { margin-bottom: .4rem; }
.pet-refine-columns select { font-size: .8rem; }
.pet-refine-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .6rem; margin-top: .75rem; }
.pet-refine-actions button { font-size: .82rem; }
.pet-footer-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1rem; }
.pet-account-note { border-top: 1px solid var(--border); margin-top: 1rem; padding-top: .8rem; font-size: .8rem; color: var(--muted); }
.pet-account-note a { display: inline-flex; min-height: 44px; align-items: center; }
.pet-account-note button { display: block; margin-top: .5rem; }
.pet-stock-dialog { color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: 1rem; padding: 1rem; width: min(530px,calc(100% - 1rem)); max-height: calc(100dvh - 2rem); overflow-y: auto; }
.pet-stock-dialog::backdrop { background: #000b; }
.pet-stock-dialog header { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.pet-stock-dialog h2 { font-size: 1.3rem; margin: .3rem 0; }
.pet-stock-dialog>p { font-size: .82rem; color: var(--muted); }
.pet-stock-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65rem; }
.pet-recovery { padding: .9rem; border: 1px solid var(--gold-dark); border-radius: var(--radius-sm); margin-bottom: .8rem; background: var(--surface); }
.pet-recovery button { margin: .25rem; }
@media(min-width:700px) { .pet-plan-grid { display:grid; grid-template-columns: minmax(0,1.45fr) minmax(0,1fr); gap:1rem; align-items:start; } .pet-action { padding:1.4rem; } .pet-portrait { width:140px; height:140px; } .pet-costs { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(prefers-reduced-motion:no-preference) { .pet-tabs button,.pet-primary { transition:background .15s ease; } }
.pet-stock-intro { padding:.85rem;border:1px solid #517b6a;border-radius:.8rem;background:var(--pet-forest);margin-bottom:.7rem; }
.pet-inline-actions { display:flex;gap:.55rem;align-items:center; }
.pet-inline-actions .pet-primary { margin:0;width:auto;flex:1; }
.pet-tools { margin:-.3rem 0 .8rem; }
.pet-tools .pet-stock-button { display:flex;align-items:center;gap:.6rem;width:100%;padding:.55rem .8rem;border-color:#518576;background:#153b32;font-size:1rem !important; }
.pet-tools .pet-stock-button span:first-child { font-size:1.3rem; }
.pet-tools .pet-stock-button span:last-child { margin-left:auto;font-size:.72rem;color:#c4dfd5; }
.pet-stock-inline { display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .65rem;border:1px solid #588a7b;background:#173d32;color:#d2f7e9;border-radius:.5rem;margin-top:.3rem; }
.pet-context details { margin:.15rem 0; }
.pet-context summary { padding:.5rem 0; }
.pet-context-suggestion { border-left:2px solid var(--gold-light);padding:.5rem .65rem; }
.pet-context-suggestion a { display:inline-flex;align-items:center;min-height:44px;margin-right:.5rem; }
.pet-option { padding:.3rem 0;border-bottom:1px solid var(--border); }
.pet-option:last-child { border:0; }
.pet-strategy { margin:1rem 0; }
.pet-strategy h2 { font-size:1.2rem; }
.pet-strategy-grid .pet-action-head { gap:.6rem;margin-top:.7rem; }
.pet-strategy-grid .pet-portrait { width:64px;height:64px; }
.pet-strategy-grid .pet-action-head h2 { font-size:1rem;margin:0; }
.pet-strategy-grid h3 { font-size:1.05rem; }
.pet-strategy-grid .pet-primary { font-size:.85rem; }
.pet-collection-prompt .pet-secondary { width:100%; }
[data-pet-editor] .pet-portrait { width:85px;height:85px; }
[data-pet-editor] { scrollbar-gutter:stable; }
@media(min-width:700px) { .pet-strategy-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem; } }

/* Collection cards share the same visual language in Plan and Animals. */
.pet-review { margin:1.5rem 0; }
.pet-section-heading { display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap; }
.pet-section-heading h2,.pet-section-heading h3,.pet-section-title { margin:0;font:700 1.13rem/1.3 var(--sans);color:var(--text); }
.pet-section-heading p { margin:.3rem 0 0; }
.pet-review-count { font-size:.72rem;color:var(--pet-accent);padding:.4rem .6rem;background:var(--pet-forest);border-radius:999px; }
.pet-review-list { list-style:none;padding:0 !important;margin:.8rem 0 1rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;align-items:stretch; }
.pet-animal-tile { min-width:0;display:flex;flex-direction:column;overflow:hidden;border:1px solid #394740;border-radius:.85rem;background:linear-gradient(155deg,#1b2924,var(--surface) 65%); }
.pet-animal-button { position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:.45rem;width:100%;min-width:0;padding:.8rem .65rem .75rem;background:transparent;color:var(--text);border:0;text-align:center;border-radius:.8rem .8rem 0 0; }
.pet-animal-button:hover { background:#75e4be09; }
.pet-animal-button:focus-visible { outline-offset:-4px; }
.pet-animal-button:disabled { opacity:1;cursor:default; }
.pet-animal-top { position:absolute;top:.65rem;left:.6rem;right:.6rem;display:flex;align-items:center;justify-content:space-between;font-size:.78rem;color:#bed2c8; }
.pet-generation-tag { display:inline-block;padding:.14rem .4rem;border:1px solid #45594e;border-radius:.35rem;font-size:.67rem;letter-spacing:.03em; }
.pet-thumbnail { object-fit:contain;flex-shrink:0;filter:drop-shadow(0 4px 9px #0004); }
.pet-animal-button>.pet-thumbnail { width:64px;height:64px; }
.pet-animal-name { display:flex;align-items:center;justify-content:center;min-height:2.5em;font-size:.92rem;line-height:1.25;overflow-wrap:anywhere; }
.pet-animal-metrics { display:grid;grid-template-columns:1fr 1fr;width:100%;gap:.4rem;margin-top:auto;padding-top:.25rem; }
.pet-animal-metrics>span { display:grid;gap:.15rem; }
.pet-animal-metrics>span+span { border-left:1px solid #405147; }
.pet-animal-metrics small { color:#b3beb8;font-size:.67rem; }
.pet-animal-metrics b { font-size:1.23rem;line-height:1.1;font-variant-numeric:tabular-nums; }
.pet-animal-metrics>span+span b { color:#b3beb8;font-weight:500; }
.pet-target-state { color:#a9e9ce;font-size:.7rem;font-weight:600; }
.pet-animal-button[data-state=pending] .pet-target-state { color:#f0d296; }
.pet-animal-button[data-state=missing] .pet-target-state { color:#c7d2df; }
.pet-animal-why { border-top:1px solid #354239; }
.pet-animal-why summary { padding:.6rem .7rem;color:#b9c6be;font-size:.69rem;line-height:1.4; }
.pet-animal-why p { padding:0 .7rem .65rem;margin:0; }
.pet-older-collection>summary { font-weight:650; }
.pet-context-meta { display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.45rem; }
.pet-context-chip { padding:.25rem .5rem;background:var(--surface-2);border-radius:.4rem;font-size:.74rem; }
.pet-context-controls { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;align-items:start; }
.pet-context-control { background:var(--surface);border:1px solid var(--border);border-radius:.65rem;min-width:0; }
.pet-context-control:only-child { grid-column:1/-1; }
[data-pet-profile-options][open] { grid-column:1/-1; }
.pet-context .pet-profile-explanation { margin:.6rem .7rem; }
.pet-profile-explanation p { margin:.5rem 0; }
.pet-context .pet-context-control summary { display:grid;grid-template-columns:1fr auto;padding:.6rem .7rem;gap:.2rem;min-height:68px; }
.pet-context-control summary::after { content:'⌄';grid-column:2;grid-row:1/3;align-self:center;color:var(--muted); }
.pet-context-control[open]>summary::after,.pet-profile-explanation[open]>summary::after { content:'⌃'; }
.pet-context-control summary>span { font-size:.67rem;color:var(--muted); }
.pet-context-control summary strong { grid-column:1;font-size:.82rem;line-height:1.3;font-weight:650; }
.pet-context-control .pet-field,.pet-context-control>p { margin:.35rem .65rem .65rem; }
.pet-context .pet-profile-explanation>summary { min-height:44px;padding:.4rem 0; }
[data-pet-profile-options]>div>p { margin:.35rem .65rem .65rem; }
.pet-decision { padding:1rem 1.1rem;background:linear-gradient(120deg,#272d22,var(--surface));border-color:#57604a; }
.pet-decision h2 { margin:.6rem 0 .3rem;font-size:1.25rem; }
.pet-decision>p { margin:.5rem 0 0;line-height:1.55; }
.pet-wave-preview { display:grid;gap:.5rem;margin:.6rem 0; }
.pet-wave-preview>div { display:flex;align-items:center;gap:.6rem;padding:.5rem;background:#ffffff04;border-radius:.5rem; }
.pet-wave-preview strong { font-size:.83rem; }
.pet-wave-preview p { margin:.15rem 0; }
.pet-option>summary { display:flex;align-items:center;gap:.65rem;font-size:.85rem;color:var(--text); }
.pet-option>summary::after { content:'+';margin-left:auto; }
.pet-option[open]>summary::after { content:'−'; }
.pet-refinement-preview h2 { font:700 1.05rem/1.3 var(--sans);margin:0 0 .4rem; }
.pet-refinement-preview-row { display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:.5rem;padding:.7rem 0;border-bottom:1px solid var(--border); }
.pet-refinement-preview-row strong { font-size:.76rem; }
.pet-refinement-preview-row p { margin:.15rem 0;font-size:.7rem; }
.pet-refinement-preview-row .pet-badge { max-width:6.5rem;padding:.3rem .45rem;font-size:.66rem; }
.pet-refinement-preview>button { width:100%;margin-top:.8rem; }
.pet-mark-symbol { display:grid;place-items:center;font-size:1.5rem;color:var(--gold-light); }
.pet-quality-pill { display:inline-flex;align-items:center;gap:.4rem;color:#bfe6cd;border:1px solid #466b54;background:#1c3527;padding:.35rem .65rem;border-radius:.4rem;font-size:.82rem;font-weight:650; }
.pet-quality-pill::before { content:'';width:.5rem;height:.5rem;border-radius:50%;background:currentColor; }
.pet-quality-pill[data-quality='2'] { color:#b1d7fa;background:#1b3042;border-color:#496884; }
.pet-quality-pill[data-quality='3'] { color:#dec5fa;background:#332543;border-color:#786091; }
.pet-refine-target { margin:.8rem 0; }
.pet-refine-target p { margin:0 0 .4rem; }
.pet-session { background:linear-gradient(145deg,#1e3932,var(--surface) 70%);border-color:#4b7c6b; }
.pet-session .pet-action-head { margin:.8rem 0; }
.pet-session .pet-portrait { width:64px;height:64px; }
.pet-session .pet-action-head h2 { font-size:1.1rem;margin:0; }
.pet-session .pet-action-head p { margin:.2rem 0; }
.pet-session-metrics { display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:.4rem;margin:.85rem 0; }
.pet-session-metrics>div { display:grid;gap:.2rem;padding:.5rem;background:#0003;border-radius:.5rem; }
.pet-session-metrics strong { font-size:1.05rem;font-variant-numeric:tabular-nums; }
.pet-session-metrics span { font-size:.64rem;color:var(--muted);overflow-wrap:anywhere; }
.pet-refinement-entry { margin:1.4rem 0 1rem;padding-top:1.2rem;border-top:1px solid var(--border); }
.pet-strategy>.pet-small { margin:.5rem 0 1rem; }
@media(min-width:700px) { .pet-review-list { grid-template-columns:repeat(3,minmax(0,1fr)); } .pet-wave-preview { grid-template-columns:repeat(2,minmax(0,1fr)); } .pet-context-controls { max-width:700px; } }
@media(min-width:1000px) { .pet-review-list { grid-template-columns:repeat(4,minmax(0,1fr)); } }

.pet-integrated-strategy { border-color:#4a7565;background:linear-gradient(145deg,#1a3028,var(--surface) 65%); }
.pet-integrated-strategy>h2 { font:700 1.15rem/1.3 var(--sans);margin:0 0 .4rem; }
.pet-strategy-family { margin:1rem 0;padding-top:1rem;border-top:1px solid #405448; }
.pet-strategy-family h3 { font:650 .98rem/1.3 var(--sans); }
.pet-strategy-family .pet-session-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); }
.pet-allocation-list { list-style:none;padding:0;margin:.5rem 0;display:grid;gap:.6rem; }
.pet-allocation-list>li { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.55rem;padding:.7rem;border:1px solid #3c5449;border-radius:.65rem;background:#0b181466; }
.pet-allocation-head { display:flex;gap:.6rem;align-items:center;min-width:0; }
.pet-allocation-head>div { min-width:0; }
.pet-allocation-head strong { font-size:.85rem;overflow-wrap:anywhere; }
.pet-allocation-head p { font-size:.7rem;margin:.25rem 0; }
.pet-allocation-head .pet-quality-pill { font-size:.69rem;padding:.2rem .4rem; }
.pet-allocation-list>li>p { max-width:6rem;font-size:.78rem;color:var(--pet-accent);font-weight:700; }
.pet-allocation-list>li>button { grid-column:1/-1;margin:0;font-size:.82rem; }
.pet-future-reserve>summary strong,.pet-funding-state { display:block; }
.pet-funding-state { font-size:.76rem;font-weight:500;margin:.3rem 0 0;color:#d7c390; }
.pet-future-reserve[data-pet-future-status=READY] { border-color:#4a8b70; }
.pet-future-reserve[data-pet-future-status=READY] .pet-funding-state { color:var(--pet-accent); }
.pet-funding-list { display:grid;gap:.45rem;margin:.7rem 0; }
.pet-funding-list>div { padding:.65rem;background:#0003;border-radius:.5rem; }
.pet-funding-list strong { font-size:.84rem; }
.pet-funding-list p { margin:.3rem 0 0; }
.pet-roll-stat { padding:.55rem .7rem; }
.pet-roll-receipt { border-left:3px solid var(--pet-accent);padding:.7rem;background:var(--pet-forest);font-size:.85rem; }
.pet-chain-row,.pet-compared-action>summary { display:flex;align-items:center;gap:.65rem;min-width:0; }
.pet-chain-row { margin:.8rem 0 .3rem; }
.pet-chain-row strong,.pet-compared-action strong { font-size:.85rem;overflow-wrap:anywhere; }
.pet-compared-action { margin:.6rem 0;border-top:1px solid var(--border);padding:.4rem 0; }
.pet-compared-action>summary::after { content:'+';margin-left:auto; }
.pet-compared-action[open]>summary::after { content:'−'; }
[data-pet-preparation-options] { margin-top:1rem; }
[data-pet-preparation-options] form { padding-top:.6rem; }
.pet-pending { border-color:#bb9c59;background:#28261c; }
.pet-pending h2 { font-size:1.1rem; }
.pet-pending .pet-portrait { width:56px;height:56px; }
.pet-pending>button { width:100%;margin-top:.5rem; }
.pet-pending .pet-action-head h2 { font-size:1rem; }
.pet-roll-verdict:not(:empty) { border:1px solid #59826f;border-radius:.7rem;background:#14251e;padding:.8rem;margin-top:1rem; }
.pet-roll-verdict h3 { margin:0 0 .35rem;font-size:1.1rem; }
.pet-envelope { border:1px solid var(--border);border-radius:.7rem;padding:.65rem;margin:.7rem 0; }
.pet-envelope summary { min-height:44px;cursor:pointer;align-content:center;color:var(--pet-accent); }
.pet-envelope form { display:grid;gap:.5rem; }
.pet-envelope [type=submit] { background:var(--pet-accent);color:#072a23;font-weight:750; }
.pet-envelope p { overflow-wrap:anywhere; }
/* Game quality families; dark shades preserve contrast. Text labels also identify every tier. */
.pet-workspace [data-quality='0'] { --quality-ink:#e2e4e8;--quality-bg:#30343b;--quality-border:#8d949e; }
.pet-workspace [data-quality='1'] { --quality-ink:#c5f4d2;--quality-bg:#203d2c;--quality-border:#62b97c; }
.pet-workspace [data-quality='2'] { --quality-ink:#cce7ff;--quality-bg:#203952;--quality-border:#68aff0; }
.pet-workspace [data-quality='3'] { --quality-ink:#ead6ff;--quality-bg:#412951;--quality-border:#ba89e5; }
.pet-workspace [data-quality='4'] { --quality-ink:#ffe9ad;--quality-bg:#493b20;--quality-border:#dfb54f; }
.pet-workspace [data-quality='5'] { --quality-ink:#ffd2d5;--quality-bg:#51292e;--quality-border:#ed828c; }
.pet-workspace .pet-refine-stat[data-quality]:not([data-quality='']),
.pet-workspace .pet-quality-pill[data-quality]:not([data-quality='']),
.pet-workspace select[data-quality]:not([data-quality='']),
.pet-workspace option[data-quality]:not([data-quality='']) { color:var(--quality-ink);background:var(--quality-bg);border-color:var(--quality-border); }
.pet-workspace .pet-refine-stat[data-quality]:not([data-quality='']) { border-left-width:4px; }
.pet-refine-stat legend { color:inherit;font-weight:650; }
.pet-refine-stat .pet-quality-hint { color:inherit;opacity:.95;font-size:.72rem;line-height:1.5;margin:.45rem 0 0; }
.pet-signed-input { display:flex;gap:.3rem; }
.pet-signed-input input { min-width:0;flex:1;width:0; }
.pet-signed-input .pet-sign-toggle { flex:0 0 44px;min-width:44px;min-height:44px;margin:0;padding:0;font-size:1.1rem; }
.pet-roll-deltas { display:grid;gap:.4rem;margin:.8rem 0;font-size:.76rem; }
.pet-roll-deltas>div { display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.3rem 0;border-top:1px solid #31453a; }
.pet-roll-deltas>div>strong { white-space:nowrap;font-variant-numeric:tabular-nums; }
.pet-roll-deltas [data-delta=up]>strong { color:#8de5ba; }
.pet-roll-deltas [data-delta=down]>strong { color:#ffc2af; }
.pet-refine-actions { padding:.5rem .5rem calc(.5rem + env(safe-area-inset-bottom));background:#14251e;border-radius:.5rem; }
@media(min-width:700px) { .pet-integrated-strategy { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1rem; } .pet-integrated-strategy>h2,.pet-integrated-strategy>p { grid-column:1/-1; } .pet-funding-list { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* UI v2 keeps every planner/refinement control while sharing the site's gold shell. */
.pet-v2 { --pet-accent: var(--gold-light); --pet-forest: rgba(212,168,63,.12); padding-top: 0; }
.pet-v2-task-bar { margin-bottom: .5rem; }
.pet-v2 .pet-character-form { min-width: 0; margin: 0; }
.pet-v2 .pet-character-form label { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pet-v2 .pet-character-form select { width: 100%; max-width: 100%; border: 0; background: transparent; font: 600 1rem var(--serif); }
.pet-v2-tool-name { color: var(--muted); font-size: .8rem; }
.pet-v2 [data-pet-interactive] { display: flex; flex-direction: column; }
.pet-v2 .pet-tabs { order: -4; margin: 0 0 .5rem; padding: 3px; border-radius: .625rem; background: var(--field); }
.pet-v2 .pet-tabs button { min-height: 44px; }
.pet-v2 .pet-tabs button[aria-selected=true] { border-color: transparent; color: var(--gold-light); background: rgba(212,168,63,.16); }
.pet-v2 .pet-recovery:not([hidden]) { order: -5; }
.pet-v2 .pet-context { order: -3; padding: 0; margin: 0; }
.pet-v2 .pet-context:empty, .pet-v2 [data-pet-stock-start]:empty, .pet-v2 .pet-notice:empty { display: none; }
.pet-v2 .pet-context-controls { gap: .4rem; }
.pet-v2 .pet-context-control > summary { min-height: 44px; }
.pet-v2 .pet-tools { order: -2; margin: .35rem 0 .5rem; }
.pet-v2 .pet-stock-button { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .5rem .7rem; border-color: var(--border); background: var(--surface); font-size: .9rem !important; }
.pet-v2 .pet-stock-button span { font-size: .8rem; }
.pet-v2-verdict { order: -1; display: flex; align-items: center; flex-wrap: wrap; gap: .45rem .6rem; margin-bottom: .7rem; padding: .8rem; border: 1px solid var(--gold-dark); border-radius: .85rem; background: linear-gradient(100deg,rgba(212,168,63,.13),var(--surface)); }
.pet-v2-verdict > strong { margin-right: auto; color: var(--gold-light); font: 600 1rem var(--serif); }
.pet-v2-verdict > p { flex: 0 0 100%; margin: 0; font-size: .9rem; color: var(--muted); }
.pet-v2-materials { display: grid; gap: .3rem; font-size: .85rem; }
.pet-v2-materials .is-missing { color: var(--danger); }
.pet-v2 .pet-card { border-radius: .85rem; }
.pet-v2 .pet-action { border-color: var(--gold-dark); background: linear-gradient(145deg,var(--surface),var(--bg-elevated)); }
.pet-v2 .pet-action h2 { font-family: var(--serif); font-weight: 600; }
.pet-v2 .pet-primary { min-height: 52px; border-color: var(--gold); background: linear-gradient(135deg,var(--gold-light),var(--gold)); color: #17130a; }
.pet-v2 .pet-eyebrow { color: var(--gold-light); }
.pet-v2 .pet-stock-dialog { border-color: var(--border); background: var(--bg-elevated); }
.pet-v2 .pet-stock-dialog > header { touch-action: pan-x; }
.pet-v2 .pet-stock-stepper { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; gap: .4rem; }
.pet-v2 .pet-stock-row { grid-template-columns: minmax(0,2fr) minmax(80px,1fr); }
.pet-v2 .pet-stock-stepper input { min-width: 0; width: 100%; text-align: center; }
.pet-v2 .pet-stock-stepper button { min-width: 44px; padding: .4rem; font-size: 1.15rem; }
.pet-v2 .pet-account-note { margin-top: 1rem; }
.pet-v2 .pet-integrated-strategy { display: block; border-color: var(--border); background: var(--bg-elevated); }
.pet-v2 .pet-integrated-strategy > summary { color: var(--gold-light); font: 600 1.05rem/1.4 var(--serif); }
.pet-v2 .pet-integrated-strategy .pet-strategy-family { margin-top: .75rem; }
.pet-v2 .pet-local-data { margin-top: .75rem; padding: .5rem .75rem; border: 1px solid var(--border); border-radius: .85rem; }
.pet-v2 .pet-action h2 { font-size: 1.25rem; }
.pet-v2 .pet-action .pet-portrait { width: 96px; height: 96px; }
.pet-v2 [data-tools-snapshot] { overflow-wrap: anywhere; }
.pet-v2 [data-tools-snapshot] dd { margin: .2rem 0 .6rem; }
/* Tour 6 and the prototype: a compact verdict, one current action and stock at hand. */
.pet-v2 .pet-tabs button > span { display: none; }
.pet-v2 .pet-context-controls { gap: .5rem; }
.pet-v2 .pet-context-control > summary { display: flex; align-items: center; gap: .4rem; min-height: 44px; padding: .4rem .65rem; }
.pet-v2 .pet-context-control > summary > span { display: none; }
.pet-v2 .pet-context-control > summary > strong { font-size: .75rem; }
.pet-v2 .pet-context-control[open] > summary > span { display: inline; }
.pet-v2 .pet-context-control > summary::after { margin-left: auto; }
.pet-v2-verdict { margin-top: .65rem; gap: .55rem; padding: .85rem 1rem; }
.pet-v2-verdict > strong { color: var(--gold); font: 800 .6875rem/1.4 var(--sans); text-transform: uppercase; letter-spacing: .16em; }
.pet-v2-verdict > p { color: var(--text); font-size: .875rem; }
.pet-v2 .pet-action { padding: .85rem 1rem; }
.pet-v2 .pet-action .pet-portrait { width: 64px; height: 64px; }
.pet-v2 .pet-action-head { gap: .75rem; }
.pet-v2 .pet-action h2 { font-size: 1.125rem; }
.pet-v2 .pet-action-target { font-size: .9375rem; }
.pet-v2 .pet-action > .pet-small { font-size: .8125rem; }
.pet-v2 .pet-eyebrow { font-size: .6875rem; letter-spacing: .12em; }
.pet-v2 .pet-costs { margin: .65rem 0; gap: .5rem; }
.pet-v2 .pet-cost { padding: .55rem .65rem; border: 1px solid var(--border); background: rgba(11,13,16,.5); }
.pet-v2 .pet-cost strong { color: var(--gold-light); font-size: .9375rem; }
.pet-v2 .pet-cost span { font-size: .75rem; }
.pet-v2 [data-pet-action=ready] .pet-action-target { margin: .3rem 0; color: var(--text); font-weight: 500; }
.pet-v2 [data-pet-action=ready] .pet-action-head .pet-small { margin: 0; }
.pet-v2 [data-pet-action=ready] .pet-costs { display: flex; flex-wrap: wrap; }
.pet-v2 [data-pet-action=ready] .pet-cost { display: flex; align-items: baseline; gap: .35rem; }
.pet-v2 .pet-tools.pet-v2-action-bar { order: 0; margin: .25rem 0 .75rem; padding: 0; border: 0; background: transparent; }
.pet-v2 [data-pet-plan-action]:empty { display: none; }
.pet-v2:not([data-pet-active-tab=plan]) [data-pet-plan-action] { display: none; }
.pet-v2 .pet-stock-button span:last-child { color: var(--muted); }
.pet-v2 .pet-stock-inline { border-color: var(--border); color: var(--gold-light); background: var(--surface); }
.pet-v2 .pet-plan-grid > details, .pet-v2 [data-pet-plan] > details { padding-block: .5rem; }
.pet-v2 [data-pet-plan] > details > summary { font-size: .9375rem; }
.pet-v2 .pet-animal-tile { border-color: var(--border); background: var(--bg-elevated); }
.pet-v2 .pet-path li { border-color: var(--gold-dark); background: var(--bg-elevated); }
.pet-v2 .pet-v2-materials { display: flex; flex-wrap: wrap; gap: .4rem; width: 100%; }
.pet-v2 .pet-v2-materials > span { padding: .4rem .55rem; border: 1px solid var(--border); border-radius: .5rem; background: rgba(11,13,16,.5); }
@media (max-width: 63.999rem) {
    .page-shell:has(.pet-v2-task-bar) { padding-top: 0; }
    .pet-workspace.pet-v2 { padding-bottom: 6rem; }
    .pet-v2-task-bar { width: calc(100% + 2rem); margin-inline: -1rem; }
    .pet-v2 .pet-tools.pet-v2-action-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 35; display: flex; gap: .5rem; margin: 0; padding: .6rem max(1rem,env(safe-area-inset-right)) max(.6rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left)); border-top: 1px solid var(--border); background: rgba(11,13,16,.96); }
    .pet-v2 [data-pet-plan-action] { flex: 1; min-width: 0; }
    .pet-v2 [data-pet-plan-action] .pet-primary { min-height: 52px; margin: 0; font-size: .9375rem; }
    .pet-v2 .pet-stock-button { flex: 1; min-height: 52px; width: auto; }
    .pet-v2 [data-pet-plan-action]:not(:empty) + .pet-stock-button { flex: 0 1 auto; }
    .pet-v2[data-pet-active-tab=plan] [data-pet-plan-action]:not(:empty) + .pet-stock-button [data-pet-stock-count] { display: none; }
    .pet-v2 .pet-notice:not(:empty) { padding: .55rem .65rem; border: 1px solid var(--border); border-radius: .65rem; background: var(--bg-elevated); }
}
body:has(.pet-v2 .pet-stock-dialog[open]) { overflow: hidden; }
@media (min-width: 64rem) {
    .pet-workspace.pet-v2 { max-width: 74rem; }
    .pet-v2 [data-pet-plan] { display: grid; grid-template-columns: minmax(0,1fr) 22rem; gap: 1rem 1.5rem; align-items: start; }
    .pet-v2 [data-pet-plan] > * { grid-column: 1; min-width: 0; margin: 0; }
    .pet-v2 [data-pet-plan] > .pet-integrated-strategy { grid-column: 2; grid-row: 1 / span 5; }
    .pet-v2 [data-pet-plan] > [data-strategy-primary=true] { grid-column: 1 / -1; grid-row: auto; }
    .pet-v2 [data-strategy-primary=true] .pet-strategy-families { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; align-items: start; }
    .pet-v2 .pet-plan-grid { grid-template-columns: minmax(0,1fr); }
    .pet-v2 .pet-costs { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .pet-v2 .pet-tabs { max-width: 40rem; }
    .pet-v2 .pet-context { max-width: 50rem; }
    .pet-v2 .pet-tools { max-width: 22rem; }
    .pet-v2 .pet-v2-verdict { margin-bottom: 1rem; }
    .pet-v2 .pet-account-note { max-width: 50rem; }
    .pet-v2 .pet-tools.pet-v2-action-bar { align-self: flex-end; margin-top: -3.25rem; margin-bottom: .5rem; width: 22rem; max-width: 22rem; order: -2; min-height: 44px; }
    .pet-v2 .pet-context { max-width: calc(100% - 24rem); }
    .pet-v2 .pet-action .pet-portrait { width: 80px; height: 80px; }
}
@media (max-width: 40rem) {
    .pet-v2 .pet-stock-dialog { width: 100%; max-width: 100%; max-height: 88dvh; margin: auto 0 0; border-radius: 1.375rem 1.375rem 0 0; padding-bottom: max(1rem,env(safe-area-inset-bottom)); }
    .pet-v2 .pet-context-controls { flex-wrap: wrap; }
}