.record-guide{width:min(1420px,96vw);max-width:none;max-height:94dvh;padding:0;border:1px solid #ffffff30;border-radius:20px;background:#17131f;color:#f4f3f7;overflow:auto;overscroll-behavior:contain}
.record-guide::backdrop{background:#05040bdf;backdrop-filter:blur(6px)}
.record-guide-header{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 28px;background:#17131ff5;border-bottom:1px solid #ffffff20}
.record-guide-header p{margin:0 0 6px;color:#b8f16b;font-size:13px}.record-guide-header h2{margin:0;font-size:clamp(19px,2.2vw,28px);line-height:1.4}
.record-guide-close{flex-shrink:0;width:42px;height:42px;border:1px solid #ffffff40;border-radius:50%;background:#ffffff08;color:white;font-size:28px;cursor:pointer}
.record-guide-tools{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:16px 28px;font-size:13px;color:#c0bbc9}.record-guide-tools>div{display:flex;align-items:center;flex-wrap:wrap;gap:16px}.record-guide a{color:#b8f16b;text-underline-offset:4px}.guide-toggle{padding:8px 12px;border:1px solid #ffffff45;border-radius:8px;background:#ffffff08;color:#f4f3f7;font:inherit;cursor:pointer}
.record-guide-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,1fr);gap:26px;align-items:start;padding:0 28px 28px}.record-guide figure{margin:0;min-width:0}.record-guide-image{position:relative;max-width:780px;margin:auto}.record-guide-image img{display:block;width:100%;height:auto;border-radius:4px}.record-guide-image svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.record-guide figcaption{margin-top:12px;font-size:12px;line-height:1.6;color:#aaa5b3;text-align:center}
.mark-0{--guide-color:#55dcef}.mark-1{--guide-color:#ff619b}.mark-2{--guide-color:#ffc36d}.guide-mark rect{fill:none;stroke:var(--guide-color);stroke-width:3;vector-effect:non-scaling-stroke}.guide-mark circle{fill:var(--guide-color);stroke:#16121c;stroke-width:1}.guide-mark text{fill:#121018;font-size:18px;font-weight:900;font-family:system-ui,sans-serif}.guide-mark{transition:opacity .15s}.guide-mark.is-muted{opacity:.12}.marks-hidden .record-guide-image svg{visibility:hidden}
.record-guide-notes{display:grid;gap:14px}.guide-note{display:flex;align-items:flex-start;gap:12px;width:100%;padding:20px;text-align:left;color:inherit;background:#ffffff04;border:1px solid #ffffff25;border-left:3px solid var(--guide-color);border-radius:12px;font:inherit;cursor:pointer}.guide-note:hover,.guide-note[aria-pressed=true]{background:#ffffff0b;border-color:var(--guide-color)}.guide-number{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:var(--guide-color);color:#15101b;font-size:16px;font-weight:900}.guide-note-content{display:block;min-width:0}.guide-note small{display:block;color:var(--guide-color);font-size:13px;font-weight:700}.guide-note b{display:block;margin:7px 0 10px;font-size:clamp(20px,2vw,27px);line-height:1.35}.guide-note-content>span{display:block;font-size:14px;line-height:1.85;word-break:keep-all;overflow-wrap:anywhere}.record-guide-notes aside{font-size:12px;line-height:1.8;color:#b3adbd;padding:4px 6px}.record-guide-notes aside a{display:block;margin-top:12px;font-size:13px}
.record-guide button:focus-visible,.record-guide a:focus-visible{outline:3px solid #b8f16b;outline-offset:4px}
@media(max-width:760px){.record-guide{width:96vw;max-height:95dvh;border-radius:14px}.record-guide-header{padding:16px}.record-guide-tools{padding:14px 16px;font-size:12px}.record-guide-layout{grid-template-columns:1fr;padding:0 16px 22px;gap:20px}.guide-note{padding:17px}.guide-note b{font-size:23px}.guide-note-content>span{font-size:15px}.record-guide-image{max-width:500px}.record-guide-notes aside{font-size:13px}}