#listening-trainer{--fg-shell-max:900px;--fl-no:#a6414a;--fl-yes:#2f6d47}#listening-trainer .fl-body{gap:18px;display:grid}#listening-trainer .fl-body-docked{padding-bottom:272px}#listening-trainer .fl-lede{text-align:center;color:#566577;margin:-4px 0 0;font-size:12px;font-weight:500;line-height:1.9}#listening-trainer .fl-panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(155deg,#fffffff7,#ffffffbc);border:1px solid #ffffffed;border-radius:21px;padding:18px;position:relative;box-shadow:0 2px #b9c6d24f,0 7px 18px #344a660b,inset 0 1px #fff}#listening-trainer .fl-stack{justify-items:start;gap:13px;display:grid}#listening-trainer .fl-text{color:#4d5c6e;margin:0;font-size:13px;font-weight:500;line-height:1.9}#listening-trainer .fl-note{border:1px solid var(--fg-line);color:#526175;background:#ffffffdf;border-radius:12px;width:100%;padding:12px;font-size:12px;font-weight:500;line-height:1.85}#listening-trainer .fl-note p{margin:0}#listening-trainer .fl-note-title{letter-spacing:.02em;color:var(--fg-ink);margin-bottom:2px;font-size:12px;font-weight:700}#listening-trainer .fl-hint{color:#6b7889;margin:10px 0 0;font-size:11px;font-weight:500;line-height:1.8}#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play){z-index:0;position:relative}#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play):before{content:"";border-radius:calc(var(--fl-radius,13px) + 2px);pointer-events:none;opacity:0;z-index:3;background:conic-gradient(from var(--foster-orbit), #5fd5e0 0deg, #538fea 85deg, #eda6b6 170deg, #e9d38e 250deg, #5fd5e0 360deg);-webkit-mask-composite:xor;padding:2.5px;transition:opacity .18s;animation:3s linear infinite paused foster-border-orbit;position:absolute;inset:-2px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}#listening-trainer .fl-btn{--fl-radius:13px;border-radius:var(--fl-radius);border:1px solid var(--fg-line-soft);font-family:var(--fg-jp);color:#45566a;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:linear-gradient(155deg,#fffffff7,#ffffffc4);place-items:center;padding:11px 16px;font-size:13px;font-weight:700;line-height:1.25;transition:transform .18s,box-shadow .18s,background .18s,border-color .18s;display:inline-grid;box-shadow:0 1px #b9c6d240,inset 0 1px #fff}#listening-trainer .fl-btn-line{border-color:var(--fg-ink);color:var(--fg-ink)}#listening-trainer .fl-chip{--fl-radius:10px;border-radius:var(--fl-radius);border:1px solid var(--fg-line-soft);min-height:36px;font-family:var(--fg-jp);color:#45566a;white-space:nowrap;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:linear-gradient(155deg,#fffffff7,#ffffffc4);justify-content:center;align-items:center;padding:8px 12px;font-size:12px;font-weight:600;line-height:1.2;text-decoration:none;transition:transform .18s,box-shadow .18s,background .18s,border-color .18s,color .18s;display:inline-flex;box-shadow:0 1px #b9c6d240,inset 0 1px #fff}#listening-trainer .fl-chip-icon{width:40px;padding:8px 0;font-size:14px}#listening-trainer .fl-chip-num{font-family:var(--fg-num);letter-spacing:.02em}#listening-trainer .fl-drop{--fl-radius:21px;border-radius:var(--fl-radius);width:100%;font-family:var(--fg-jp);letter-spacing:-.01em;color:#48596f;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:linear-gradient(155deg,#ffffffbf,#f5f9fc99);border:1.5px dashed #abbbcc;place-items:center;padding:40px 18px;font-size:15px;font-weight:700;line-height:1.6;transition:transform .18s,box-shadow .18s,background .18s,border-color .18s,color .18s;display:grid;box-shadow:inset 0 1px #fff}#listening-trainer .fl-slot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}#listening-trainer .fl-slot-name{text-overflow:ellipsis;white-space:nowrap;letter-spacing:-.01em;min-width:0;color:var(--fg-ink);flex:1;font-size:13px;font-weight:700;overflow:hidden}#listening-trainer .fl-slot-actions{flex-shrink:0;gap:8px;display:flex}#listening-trainer .fl-toolbar{align-items:center;gap:8px;margin:14px 0 10px;display:flex}#listening-trainer .fl-pagecount{font-family:var(--fg-num);letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--fg-muted);margin-left:auto;font-size:12px;font-weight:700}#listening-trainer .fl-stage-wrap{position:relative}#listening-trainer .fl-stage-toggle{z-index:2;-webkit-backdrop-filter:blur(8px);color:#45566a;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:#ffffffe8;border:1px solid #dce5eb;border-radius:11px;place-items:center;width:38px;height:38px;padding:9px;transition:background .16s,color .16s,box-shadow .16s;display:grid;position:absolute;top:10px;right:10px;box-shadow:0 2px 8px #34496618,inset 0 1px #fff}#listening-trainer .fl-stage-toggle svg{width:100%;height:100%;display:block}#listening-trainer .fl-stage{border:1px solid var(--fg-stage-border);background:linear-gradient(155deg,#f8fbfddf,#edf2f680);border-radius:13px;width:100%;height:75vh;padding:12px;overflow-y:auto}#listening-trainer .fl-page-wrap{margin:0 auto 12px}#listening-trainer .fl-sheet{background:#fff;border:1px solid #e1e8ef;border-radius:8px;display:block;box-shadow:0 2px 10px #34496614}#listening-trainer .fl-sheet-image{margin:0 auto}#listening-trainer .fl-status{text-align:center;color:#7b8a9c;margin:0;padding:44px 0;font-size:13px;font-weight:600}#listening-trainer .fl-status-error{color:var(--fl-no)}#listening-trainer .fg-app-page.is-material-full{border-radius:0;height:100dvh;min-height:0;padding:0;overflow:hidden}#listening-trainer .is-material-full .fg-app-shell{-webkit-backdrop-filter:none;max-width:none;height:100%;box-shadow:none;background:0 0;border:0;border-radius:0;padding:0}#listening-trainer .is-material-full .fg-app-head{display:none}#listening-trainer .is-material-full .fl-body{height:100%;padding-bottom:0;display:block}#listening-trainer .is-material-full .fl-body>:not(.fl-material-section){display:none}#listening-trainer .is-material-full :is(.fl-material-section,.fl-material){height:100%}#listening-trainer .is-material-full .fl-panel{-webkit-backdrop-filter:none;height:100%;box-shadow:none;background:0 0;border:0;border-radius:0;flex-direction:column;padding:0;display:flex}#listening-trainer .is-material-full .fl-material{flex-direction:column;display:flex}#listening-trainer .is-material-full .fl-slot{display:none}#listening-trainer .is-material-full .fl-toolbar{border-bottom:1px solid var(--fg-stage-border);-webkit-backdrop-filter:blur(10px);background:#ffffffd6;margin:0;padding:8px 12px}#listening-trainer .is-material-full .fl-stage-wrap{flex:1;min-height:0}#listening-trainer .is-material-full .fl-stage{height:100%;padding-bottom:calc(var(--fl-dock-h,0px) + 16px);border:0;border-radius:0}#listening-trainer .fl-dock{inset-inline:0;z-index:40;-webkit-backdrop-filter:blur(20px)saturate(1.4);background:#ffffffdb;border-top:1px solid #ffffffed;position:fixed;bottom:0;box-shadow:0 -1px #fff,0 -14px 40px #3b526b14;container:fl-dock/inline-size}#listening-trainer .fl-dock-inner{max-width:var(--fg-shell-max);margin:0 auto;padding:10px 16px 12px}#listening-trainer .fl-dock-seek{align-items:center;gap:10px;display:flex}#listening-trainer .fl-dock-controls{flex-wrap:wrap;align-items:center;gap:8px;margin-top:9px;display:flex}#listening-trainer .fl-dock-collapsed{align-items:center;gap:10px;padding:8px 0;display:flex}#listening-trainer .fl-dock-mark{color:#9aa8b8;-webkit-user-select:none;user-select:none;font-size:13px}#listening-trainer .fl-range{min-width:0;height:22px;accent-color:var(--fg-ink);cursor:pointer;flex:1}#listening-trainer .fl-time{font-family:var(--fg-num);letter-spacing:.01em;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--fg-muted);font-size:13px;font-weight:700}#listening-trainer .fl-time-flex{flex:1;min-width:0}#listening-trainer .fl-play{--fl-radius:999px;background-color:var(--fg-ink);color:#fff;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-image:linear-gradient(168deg,#3a4a61,#232f42);border:1px solid #1d2739;border-radius:999px;flex-shrink:0;place-items:center;width:44px;height:44px;font-size:15px;line-height:1;transition:transform .18s,box-shadow .18s,background .18s;display:grid;box-shadow:0 2px #161e2c,0 8px 20px #28344926,inset 0 1px #fff3}#listening-trainer .fl-play-sm{width:36px;height:36px;font-size:13px}#listening-trainer .fl-speed{flex:230px;align-items:center;gap:8px;min-width:210px;display:flex}#listening-trainer .fl-speed-label{font-family:var(--fg-num);letter-spacing:.01em;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--fg-muted);font-size:12px;font-weight:700}#listening-trainer .fl-ab-badge{white-space:nowrap;color:var(--fl-yes);background:linear-gradient(155deg,#f4fbf6,#e2f1e7);border:1px solid #bcd9c5;border-radius:999px;align-items:center;padding:6px 10px;font-size:11px;font-weight:700;display:inline-flex}#listening-trainer .fl-dock-spacer{margin-left:auto}#listening-trainer .fl-ab-points{min-height:15px;font-family:var(--fg-num);letter-spacing:.01em;font-variant-numeric:tabular-nums;color:#90a0b2;gap:16px;margin-top:8px;font-size:12px;font-weight:600;display:flex}#listening-trainer .fl-modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(3px);background:#28344959;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}#listening-trainer .fl-modal{-webkit-backdrop-filter:blur(12px);text-align:left;background:linear-gradient(155deg,#fffffffa,#ffffffe6);border:1px solid #ffffffed;border-radius:21px;width:100%;max-width:560px;max-height:85vh;padding:22px;overflow-y:auto;box-shadow:0 2px #b9c6d24f,0 22px 50px #2834492b,inset 0 1px #fff}#listening-trainer .fl-modal-head{border-bottom:1px solid var(--fg-line-soft);justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;padding-bottom:12px;display:flex}#listening-trainer .fl-modal-title{letter-spacing:-.02em;margin:0;font-size:18px;font-weight:800;line-height:1.2}#listening-trainer .fl-modal-close{color:#90a0b2;cursor:pointer;background:0 0;border:0;border-radius:10px;flex-shrink:0;place-items:center;width:34px;height:34px;padding:0;font-size:18px;line-height:1;transition:color .16s,background .16s;display:grid}#listening-trainer .fl-guide{gap:16px;display:grid}#listening-trainer .fl-guide-title{letter-spacing:-.01em;color:var(--fg-ink);margin-bottom:4px;font-size:13px;font-weight:800}#listening-trainer .fl-guide p{color:#4d5c6e;margin:0;font-size:13px;font-weight:500;line-height:1.9}#listening-trainer .fl-guide ul{color:#4d5c6e;margin:0;padding:0;font-size:13px;font-weight:500;line-height:1.95;list-style:none}#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play,.fl-modal-close,.fl-range,.fl-stage-toggle):focus-visible{outline-offset:2px;outline:2px solid #437bba}@media (hover:hover) and (pointer:fine){#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop):is(:hover,:focus-visible){background:linear-gradient(155deg,#fff,#fffffff0);border-color:#cbd6e1;box-shadow:-5px -3px 19px #6ddae12e,6px 4px 22px #e4b7bf38,0 14px 24px #35578216}#listening-trainer .fl-btn-line:is(:hover,:focus-visible){border-color:var(--fg-ink)}#listening-trainer .fl-drop:is(:hover,:focus-visible){color:var(--fg-ink);border-color:#93a6ba}#listening-trainer .fl-play:is(:hover,:focus-visible){background-image:linear-gradient(168deg,#445771,#2b3a51);box-shadow:0 2px #161e2c,-5px -3px 19px #6ddae12e,6px 4px 22px #e4b7bf38,0 14px 24px #2834492e}#listening-trainer .fl-modal-close:hover{color:var(--fg-ink);background:#eef2f7}#listening-trainer .fl-stage-toggle:is(:hover,:focus-visible){color:var(--fg-ink);background:#fff;box-shadow:0 4px 14px #34496626,inset 0 1px #fff}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play):is(:hover,:focus-visible){z-index:2;transform:translateY(-3px)scale(1.012)}#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play):is(:hover,:focus-visible):before{opacity:1;animation-play-state:running}#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play):active{transform:translateY(1px)scale(.992)}#listening-trainer .fl-dock :is(.fl-chip,.fl-play):is(:hover,:focus-visible,:active){transform:none}#listening-trainer .fl-dock :is(.fl-chip,.fl-play):is(:hover,:focus-visible):before{opacity:0;animation-play-state:paused}}@container fg-app-page (min-width:640px){#listening-trainer .fl-body-docked{padding-bottom:208px}}@container fg-app-page (max-width:780px){#listening-trainer .fl-panel{padding:14px}#listening-trainer .fl-body{gap:15px}#listening-trainer .fl-drop{padding:32px 14px;font-size:14px}#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play):is(:hover,:focus-visible,:active){transform:none}#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play):is(:hover,:focus-visible):before{opacity:0;animation-play-state:paused}}@container fg-app-page (max-width:410px){#listening-trainer .fl-panel{border-radius:18px;padding:12px}#listening-trainer .fl-drop{border-radius:18px;padding:28px 12px}#listening-trainer .fl-stage{padding:8px}}@container fl-dock (max-width:560px){#listening-trainer .fl-dock-inner{padding:8px 12px 10px}#listening-trainer .fl-dock-controls{gap:7px}#listening-trainer .fl-speed{flex-basis:100%;min-width:0}#listening-trainer .fl-dock-spacer{margin-left:0}}@media print{#listening-trainer .fl-dock{display:none}}@media (prefers-reduced-motion:reduce){#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play,.fl-modal-close){transition:none}#listening-trainer :is(.fl-btn,.fl-chip,.fl-drop,.fl-play):before{opacity:0;transition:none;animation:none}}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){#listening-trainer .fl-dock,#listening-trainer .fl-modal{background:#fffffffa}}