.field-guide{margin:20px 0;border:1px solid var(--line,#dfe5da);border-radius:10px;background:var(--panel,#fffef8);color:var(--ink,#263f36);overflow:hidden}
.field-guide-summary{display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;list-style:none;padding:20px 24px;min-height:82px}
.field-guide-summary::-webkit-details-marker{display:none}
.field-guide-summary:after{content:'+';font:24px var(--mono,monospace);color:var(--green,#466b4e)}
.field-guide[open]>.field-guide-summary:after{content:'−'}
.field-guide-heading{display:grid;gap:5px;flex:1}.field-guide-heading .eyebrow{font-size:9px;letter-spacing:1.4px;color:#607450}.field-guide-heading strong{font-size:21px;font-weight:600;letter-spacing:-.5px}
.field-guide-count{font:11px var(--mono,monospace);color:#52664c;white-space:nowrap}
.field-guide-body{padding:0 24px 20px;border-top:1px solid var(--line,#dfe5da)}
.field-guide-intro{max-width:74ch;font-size:13px;line-height:1.7;color:#52664c;margin:20px 0}
.field-guide-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
.field-guide-entry{display:flex;align-items:center;gap:16px;min-width:0;padding:20px 0;border-top:1px solid var(--line,#dfe5da)}
.field-guide-entry canvas,.field-guide-bonus canvas{width:112px;height:88px;flex:0 0 112px;image-rendering:pixelated;background:#eff1e6;border-radius:6px}
.field-guide-entry.is-found canvas{background:#eef2df}
.field-guide-entry-label{font:8px var(--mono,monospace);letter-spacing:1.1px;color:#64765a}
.field-guide-entry h3,.field-guide-bonus h3{font-size:15px;font-weight:600;line-height:1.35;margin:5px 0 6px}
.field-guide-entry p,.field-guide-bonus p{font-size:12px;line-height:1.6;margin:0;color:#52664c;max-width:44ch}
.field-guide-entry time,.field-guide-bonus time{font:9px var(--mono,monospace);line-height:1.6;color:#64765a;display:block;margin-top:9px}
.field-guide-bonus{border-top:1px dashed #c5cfb7;border-bottom:1px solid var(--line,#dfe5da);padding:20px 0;display:flex;align-items:center;gap:16px;margin-top:4px}
.field-guide-bonus p{max-width:70ch}.field-guide-privacy{font-size:11px;line-height:1.7;max-width:90ch;color:#64705d;margin:20px 0 12px}
.field-guide-actions{display:flex;flex-wrap:wrap;gap:9px}.field-guide-actions button{min-height:40px;padding:9px 13px;border:1px solid #cdd6bd;border-radius:6px;background:#f6f7ed;font-size:11px;color:#395746}
.field-guide-save-status{font-size:11px;line-height:1.6;color:#52664c;min-height:18px;margin:10px 0 0}
.field-guide-feedback{margin:0;font-size:12px;line-height:1.5;color:#395746}.field-guide-feedback:not(:empty){padding:10px 14px;margin:0 0 16px;border-left:3px solid #8da768;background:#eef2e2}
@media(max-width:700px){.field-guide-summary{padding:17px 16px;gap:12px}.field-guide-body{padding:0 16px 17px}.field-guide-heading strong{font-size:19px}.field-guide-heading .eyebrow{font-size:8px;letter-spacing:.8px}.field-guide-count{font-size:10px}.field-guide-list{grid-template-columns:1fr}.field-guide-entry{gap:13px;padding:17px 0}.field-guide-entry canvas,.field-guide-bonus canvas{width:88px;height:70px;flex-basis:88px}.field-guide-entry h3{font-size:14px}.field-guide-entry p{font-size:12px}}
@media(max-width:370px){.field-guide-summary{flex-wrap:wrap}.field-guide-count{font-size:9px}.field-guide-entry{gap:10px}.field-guide-entry canvas,.field-guide-bonus canvas{width:72px;height:57px;flex-basis:72px}}
/* Give the journal title its own line on phones, including the completed state. */
@media(max-width:700px){.field-guide-summary{display:grid;grid-template-columns:minmax(0,1fr) auto;row-gap:9px}.field-guide-heading{grid-column:1;grid-row:1}.field-guide-count{grid-column:1;grid-row:2}.field-guide-summary:after{grid-column:2;grid-row:1 / 3}.field-guide-privacy,.field-guide-save-status{font-size:12px}.field-guide-actions button{font-size:12px}}