/* HistoGallery 2.5: lectura, controles y proyección. */
#home #hg14CompareHub.hidden{display:flex!important}
#home #hg25TeacherEntry{display:flex!important}
.hg25QuickStart{min-height:52px;padding:12px 20px;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--ink);font-weight:800;cursor:pointer}
.hg25QuickStart small{display:block;color:var(--muted);font-weight:500;margin-top:4px}
.hg25Rhythm{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:15px;color:var(--muted)}
.hg25Rhythm select,.hg25Difficulty select,.hg25TeacherSearch input,.hg25TeacherSearch select{min-height:46px;max-width:100%;min-width:0;border:1px solid var(--line);border-radius:12px;padding:8px 12px;background:var(--panel);color:var(--ink);font:inherit}
.hg25Rhythm select{flex:1;font-weight:700}
.hg25Difficulty{display:flex;align-items:center;gap:14px;margin:14px 0 22px;flex-wrap:wrap;color:var(--muted)}
.hg25Difficulty p{margin:0;flex:1;font-size:15px;line-height:1.45}
.hg25TeacherSearch{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-bottom:14px;min-width:0}
.hg25TeacherSearch label{font-size:13px;color:var(--muted);display:grid;gap:6px;min-width:0}
.hg25TeacherSearch select{width:100%;font-size:14px}
.hg25TeacherSearch input{width:100%;font-size:16px}
.hg25TeacherSearch label:first-child{grid-column:1/-1}
.hg25TeacherSearch .hg25TeacherResult{grid-column:1/-1;font-size:12px;line-height:1.4;color:var(--muted);margin:0}
.hg25TeacherSearch button{border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ink);padding:8px 12px;min-height:46px;font-weight:700}
.hg12TeacherHead,.hg12TeacherMain,.hg12TeacherPanel,.hg12RevealGrid,.hg12RevealBtn,.hg12TeacherActions,.hg12TeacherReveal,.hg12RevealBox,.hg12Key,.hg12TeacherStage{min-width:0!important;max-width:100%;box-sizing:border-box}
.hg12TeacherShell{width:100%;overflow:hidden}
.hg12TeacherHead{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto!important;gap:12px!important}
.hg12TeacherFilters{min-width:0;display:flex;flex-wrap:wrap}
.hg12TeacherFilters select{min-width:0!important;flex:1 1 150px;max-width:100%!important}
.hg12TeacherMain{grid-template-columns:minmax(0,1.6fr) minmax(330px,.95fr)!important}
.hg12TeacherPanel{overflow-x:hidden!important;overflow-y:auto}
.hg12RevealGrid,.hg12TeacherActions,.hg12TeacherBottom{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.hg12RevealBtn{width:100%;white-space:normal!important;text-align:left}
.hg12RevealBtn b,.hg12RevealBtn span,.hg12RevealBox p,.hg12Key span{white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal;max-width:100%;line-height:1.4!important}
.hg12TeacherPanel .hg12RevealBtn b{font-size:clamp(17px,1.3vw,25px)!important}
.hg12TeacherPanel .hg12TeacherStatus{font-size:clamp(13px,1vw,18px)!important;padding:12px!important}
.hg12TeacherHead .hg12TeacherBrand b{font-size:clamp(21px,1.9vw,32px)!important}
.hg12TeacherHead .hg12TeacherBrand span{font-size:13px!important;line-height:1.4}
.hg12TeacherImageBox{min-width:0}
/* The profile has one layout at every width. Legacy desktop grids live nowhere else. */
#profile .profileShell{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:repeat(6,auto);grid-template-areas:'intro style' 'target target' 'field field' 'picks picks' 'phrases phrases' 'actions actions'!important;align-items:start;gap:14px!important;width:100%!important;max-width:1500px!important;padding:18px clamp(14px,3vw,44px) 12px!important;margin:auto!important}
#profile .profileShell>*,#profile .phrase>*{min-width:0;overflow-wrap:anywhere}
#profile .profileIntro{grid-area:intro;padding:16px 18px!important;text-align:left;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
#profile .profileIntro h2{font-size:clamp(26px,2.5vw,38px)!important;line-height:1.15!important;margin:0 0 8px!important}
#profile .profileIntro p{font-size:clamp(15px,1.15vw,20px)!important;line-height:1.4!important}
#profile .hg19StyleTabs{grid-area:style;display:flex;flex-direction:column;align-items:stretch;gap:8px;margin:0!important;padding:16px 18px!important;align-self:stretch;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
#profile .hg19StyleTabs label{font-size:13px!important}
#profile .hg19StyleTabs select{height:auto!important;min-height:52px!important;padding:12px!important;font-size:clamp(16px,1.3vw,22px)!important}
#profile .styleTarget{grid-area:target;width:100%!important;margin:0!important;padding:12px 16px!important;min-height:0!important}
#profile .styleTarget .big{font-size:30px!important}
#profile .styleTarget b{font-size:clamp(17px,1.35vw,23px)!important}
#profile .styleTarget span{font-size:clamp(14px,1.05vw,18px)!important;line-height:1.4}
#profile .field{grid-area:field;margin:0!important;padding:12px 16px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
#profile .field input{padding:10px 14px!important;min-height:46px!important;font-size:16px!important}
#profile .field label{font-size:12px!important;margin-bottom:5px!important}
#profile .pickTitle{grid-area:picks;position:static;flex-wrap:wrap;margin:0!important;padding:6px 0;gap:10px}
#profile .pickTitle b{font-size:clamp(20px,1.7vw,27px)!important}
#profile .pickCount{font-size:15px!important}
#profile .phraseGrid{grid-area:phrases;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
#profile .phrase{display:block;position:relative;min-width:0;overflow-wrap:anywhere;min-height:94px!important;font-size:clamp(17px,1.35vw,24px)!important;padding:17px 20px!important;line-height:1.35!important;border-radius:17px!important}
.hg25PhraseLabel{display:block;font-weight:850;padding-right:12px}
.hg25PhraseFull{display:block;font-size:.8em;line-height:1.5;margin-top:10px;font-weight:500;color:var(--muted)}
#profile .phrase.selected::after{position:absolute;right:10px;top:8px;font-size:16px}
#profile .profileActions{grid-area:actions;position:sticky!important;bottom:0!important;z-index:15;display:flex!important;align-items:center;gap:14px!important;margin:0 -6px!important;padding:12px 6px calc(12px + env(safe-area-inset-bottom))!important;background:var(--bg)!important;border-top:1px solid var(--line);width:auto!important}
#profile .profileActions .primary{width:auto!important;height:auto;min-width:0;min-height:56px!important;font-size:clamp(18px,1.35vw,24px)!important;padding:12px 20px!important;flex:1}
.hg25ProfileCount{font-size:18px;font-weight:850;min-width:110px}
.hg25PhraseToggle{font-size:14px;min-height:42px;border:1px solid var(--line);border-radius:12px;padding:8px 13px;background:var(--panel);color:var(--ink);cursor:pointer}
#discovery.active{height:100vh;height:100dvh;min-height:0!important;overflow:hidden!important}
#discovery .discoverTop{height:clamp(58px,7dvh,82px)!important;min-height:58px;flex:0 0 auto}
#discovery .discoverWrap{flex:1;min-height:0!important;display:grid!important;grid-template-columns:minmax(0,1.65fr) minmax(300px,.8fr)!important;align-items:stretch!important;gap:18px!important;padding:12px clamp(12px,2vw,30px)!important;overflow:hidden}
#discovery .hg17Stack{display:flex!important;flex-direction:column!important;gap:10px;width:100%!important;height:100%!important;max-height:100%!important;min-height:0!important;overflow:visible!important;padding:0!important}
#discovery .artSwipe{position:relative!important;inset:auto!important;flex:1 1 0;min-height:0!important;max-height:none!important;height:auto!important;width:100%!important;margin:0!important;border-radius:18px!important;box-shadow:none!important}
#discovery .artSwipe>img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;background:#06080b!important}
#discovery .artShade{display:none!important}
#discovery .hg17Back{display:none!important}
.hg25RadarControls{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border:1px solid var(--line);background:var(--panel);border-radius:18px;min-width:0}
#discovery .mystery{position:static!important;font-size:clamp(13px,1.1vw,20px)!important;padding:8px!important;max-width:50%;overflow-wrap:anywhere}
#discovery .artActions{position:static!important;display:flex!important;gap:12px!important;flex-shrink:0;padding:0!important;margin:0!important;height:auto!important;transform:none!important}
#discovery .roundBtn{width:58px!important;height:58px!important;font-size:28px!important}
#discovery .roundBtn.rewind{display:grid!important;width:45px!important;height:45px!important;align-self:center;font-size:23px!important}
#discovery .v16dDeskPanel{display:flex!important;align-self:stretch!important;flex-direction:column;justify-content:flex-start!important;min-height:0;max-height:100%;overflow-y:auto;overflow-x:hidden;padding:18px!important;gap:12px!important}
#discovery .v16dDeskPanel h3{font-size:clamp(23px,2vw,36px)!important;line-height:1.2!important;margin:0!important}
#discovery .v16dDeskPanel>p{font-size:clamp(16px,1.15vw,22px)!important;line-height:1.45!important;margin:0!important}
#discovery .v16dDeskStat{margin:0!important;gap:8px!important}
#discovery .v16dDeskStat b{font-size:clamp(24px,2.5vw,42px)!important}
#discovery .v16dDeskStat span{font-size:clamp(11px,.9vw,15px)!important}
#discovery .v16dDeskHelp{font-size:clamp(13px,1vw,17px)!important;line-height:1.5!important;margin:0!important;padding:10px 0!important}
#discovery .hg17QuickFeedback{position:static!important;display:none!important;opacity:1!important;transform:none!important;pointer-events:auto!important;width:auto!important;margin:0!important;padding:16px!important;border-radius:16px!important;background:var(--panel2)!important;box-shadow:none!important;flex:1 1 auto;min-height:0;max-height:none!important;overflow:hidden}
#discovery .hg17QuickFeedback.show{display:flex!important;flex-direction:column;gap:10px!important}
#discovery .hg17QuickFeedback.show~.v16dDeskHelp{display:none!important}
#discovery .hg28FeedbackBody{display:flex;flex-direction:column;gap:10px;flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-gutter:stable;touch-action:pan-y;overflow-wrap:anywhere}
#discovery .hg28FeedbackBody>*{flex:0 0 auto}
#discovery .hg28FeedbackBody>b{font-size:clamp(19px,1.4vw,27px)!important}
#discovery .hg28RadarAdvance{display:flex;flex-direction:column;gap:8px;flex:0 0 auto;min-width:0;padding-top:10px;border-top:1px solid var(--line);background:var(--panel2)}
#discovery .hg17QuickFeedback span{font-size:clamp(15px,1.1vw,21px)!important;line-height:1.5!important}
#discovery .hg17QuickFeedback .hg18FeedbackWork{font-weight:800}
#discovery .hg17QuickFeedback .hg25FeedbackLook{color:var(--blue);border-top:1px solid var(--line);padding-top:10px}
#hg25RadarNext{min-height:54px;width:100%;font-size:clamp(17px,1.2vw,23px);margin-top:0;flex-shrink:0}
.hg25RadarProof{position:absolute;z-index:4;pointer-events:none;overflow:visible}
.hg25RadarProof rect,.hg25RadarProof polygon,.hg25RadarProof ellipse{fill:rgba(87,217,155,.13);stroke:#74f3b6;stroke-width:2;stroke-dasharray:5 3;vector-effect:non-scaling-stroke}
.hg25AutoNote{font-size:12px!important;color:var(--muted)}
.hg25Framing{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 12px;color:var(--muted);font-size:14px}
.hg25Framing button{min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ink);font-weight:700;cursor:pointer}
.hg25CropFrame{position:absolute;inset:0;margin:auto;overflow:hidden;pointer-events:none}
.hg13aImgBox.hg25Cropped .hg25CropFrame>img{max-width:none!important;max-height:none!important;min-width:0!important;min-height:0!important;object-fit:fill!important;transform:none!important;margin:0!important}
.hg25ProofRetry{display:flex;justify-content:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.hg25ProofRetry button{min-height:44px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:12px;padding:10px 14px;font-weight:700}
#hg13aOverlay.playing .hg25Difficulty{display:none}
@media(min-width:1600px){.hg12TeacherMain{grid-template-columns:minmax(0,1.8fr) minmax(430px,.8fr)!important}.hg25Rhythm{font-size:18px}.hg25Rhythm select{min-height:54px}}
@media(max-width:999px){
 .hg12TeacherHead{grid-template-columns:minmax(0,1fr) auto!important}.hg12TeacherFilters{grid-column:1/-1;grid-row:2}.hg12TeacherMain{display:block!important}
 #profile .phraseGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #discovery .discoverWrap{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(180px,1fr) auto;gap:8px!important;padding:8px!important;overflow-y:auto}
 #discovery .v16dDeskPanel{display:grid!important;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);padding:12px!important;overflow:hidden;max-height:min(60dvh,calc(100dvh - 262px));gap:6px!important}
 #discovery .v16dDeskPanel>.brand,#discovery .v16dDeskPanel>h3,#discovery .v16dDeskPanel>p,#discovery .v16dDeskStat,#discovery .v16dDeskHelp{display:none!important}
 #discovery .hg17QuickFeedback{padding:12px!important}
 #discovery .hg17QuickFeedback span{font-size:15px!important;line-height:1.4!important}
 #discovery .hg17QuickFeedback .hg25FeedbackLook{font-size:14px!important}
 .hg25RadarControls{padding:7px 10px}
 #discovery .roundBtn{width:48px!important;height:48px!important;font-size:25px!important}
 #discovery .roundBtn.rewind{width:40px!important;height:40px!important}
 #discovery .miniProfile{font-size:13px!important}
 .hg25Rhythm{font-size:13px}.hg25Rhythm select{min-height:42px;font-size:14px}
}
@media(max-width:599px){
 #profile .profileShell{grid-template-columns:minmax(0,1fr)!important;grid-template-areas:'intro' 'style' 'target' 'field' 'picks' 'phrases' 'actions'!important;gap:10px!important}
 #profile .phraseGrid{grid-template-columns:minmax(0,1fr)!important;gap:8px!important}
 #profile .phrase{min-height:62px!important;font-size:18px!important;padding:15px!important}
 .hg25ProfileCount{font-size:15px;min-width:78px}
 .hg12TeacherHead .hg12TeacherBrand b{font-size:20px!important}.hg12TeacherPanel{padding:12px!important}
 .hg12TeacherPanel .hg12RevealBtn{padding:12px!important;min-height:75px!important}.hg12TeacherPanel .hg12RevealBtn b{font-size:16px!important}
 .hg12TeacherPanel .hg12TeacherActions button,.hg12TeacherPanel .hg12TeacherBottom button{font-size:14px!important;padding:9px;min-height:48px!important}
 .hg25Framing{font-size:12px;align-items:flex-start}.hg25Framing button{font-size:12px;flex-shrink:0}
}
@media(max-height:650px) and (min-width:1000px){#discovery .v16dDeskPanel{gap:7px!important;padding:12px!important}#discovery .v16dDeskStat,#discovery .v16dDeskHelp{display:none!important}}
@media(min-width:600px) and (max-width:999px) and (max-height:500px){
 #discovery .discoverWrap{grid-template-columns:minmax(0,1.2fr) minmax(260px,1fr)!important;grid-template-rows:minmax(0,1fr);overflow:hidden}
 #discovery .v16dDeskPanel{max-height:100%}
 .hg25RadarControls{gap:6px;padding:6px}
 #discovery .mystery{font-size:12px!important;padding:0!important}
 #discovery .artActions{gap:6px!important}
}