.studies-view{max-width:1320px;margin:0 auto;padding:34px 24px 72px}.studies-hero{display:flex;justify-content:space-between;gap:30px;align-items:end;padding:34px;border:1px solid #273550;border-radius:20px;background:linear-gradient(135deg,#0d1422,#10172a 58%,#12102a)}.studies-hero h1{font-size:clamp(2rem,5vw,3.5rem);margin:8px 0}.studies-hero p{max-width:720px;color:#a8b5ca;font-size:1rem}.studies-source{padding:18px 22px;border-radius:14px;background:#07101d;border:1px solid #283a58;min-width:235px}.studies-source strong,.studies-source span{display:block}.studies-source strong{color:#30d9ec}.studies-source span{font-size:.82rem;color:#92a0b5;margin-top:5px}.study-tabs{display:flex;gap:9px;overflow:auto;margin:22px 0;padding-bottom:5px}.study-tabs button,.study-filter{white-space:nowrap;border:1px solid #2a3852;background:#0a101c;color:#b7c3d6;border-radius:999px;padding:10px 15px;font-weight:800}.study-tabs button.active,.study-filter.active{background:#22d3e6;color:#041017;border-color:#22d3e6}.study-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:17px}.study-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.study-card{display:flex;flex-direction:column;min-height:235px;padding:20px;border:1px solid #263550;border-radius:17px;background:#0b111e}.study-card .tag{color:#39dced;font-size:.74rem;letter-spacing:.12em;font-weight:900}.study-card h2{font-size:1.18rem;margin:12px 0 8px}.study-card p{color:#a8b5ca;line-height:1.5;margin:0 0 14px}.study-card .study-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}.study-meta span{font-size:.76rem;border:1px solid #30405c;border-radius:7px;padding:5px 8px;color:#c6d1e3}.study-card button{margin-top:14px}.lab-controls{display:flex;gap:13px;align-items:end;flex-wrap:wrap;padding:20px;background:#0b111e;border:1px solid #263550;border-radius:16px}.lab-controls label{display:grid;gap:7px;color:#91a1b9;font-weight:800}.lab-controls select{min-width:190px}.theory-result{margin-top:16px;padding:28px;border:1px solid #263550;border-radius:18px;background:linear-gradient(135deg,#0b111e,#10172a)}.theory-result h2{font-size:2rem;margin:0 0 8px}.theory-result .formula{color:#36def0;font-weight:900;font-size:1.1rem}.note-run{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.note-run span{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#17243a;border:1px solid #38d9ec;font-weight:900}.interval-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}.interval-card{padding:16px;text-align:left;border:1px solid #2b3953;border-radius:13px;background:#0b111e;color:#e8eef8}.interval-card.active{border-color:#36def0;box-shadow:0 0 0 2px #36def033}.interval-card strong,.interval-card span{display:block}.interval-card span{color:#93a2b8;margin-top:4px;font-size:.82rem}.cycle-labs{display:grid;grid-template-columns:1fr 1fr;gap:16px}.cycle-labs article{padding:25px;border:1px solid #293852;border-radius:18px;background:#0b111e}.cycle-labs article>span{color:#36def0;font-weight:900;letter-spacing:.12em}.cycle-labs p{color:#9aa9bd}.cycle-notes{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.cycle-notes button{width:46px;height:46px;border-radius:50%;border:1px solid #354765;background:#15223a;color:#fff;font-weight:900}.task-open{border:1px solid #33445f;background:#101929;color:#39dced;border-radius:8px;padding:6px 9px;font-size:.72rem;font-weight:900}.study-item{display:grid!important;grid-template-columns:auto 1fr auto auto!important;align-items:center;gap:9px}
@media(max-width:850px){.study-grid{grid-template-columns:1fr 1fr}.interval-grid{grid-template-columns:1fr 1fr}.cycle-labs{grid-template-columns:1fr}.studies-hero{align-items:start;flex-direction:column}.studies-source{min-width:0;width:100%}}@media(max-width:560px){.studies-view{padding:20px 12px 60px}.studies-hero{padding:22px}.study-grid{grid-template-columns:1fr}.study-item{grid-template-columns:auto 1fr auto!important}.task-open{grid-column:2}.interval-grid{grid-template-columns:1fr 1fr}}
.cycle-labs p{line-height:1.6}.cycle-explanation{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}.cycle-explanation article{padding:22px;border:1px solid #293852;border-radius:16px;background:linear-gradient(145deg,#0d1524,#0a101b)}.cycle-step{color:#5cffaa;font-size:.73rem;font-weight:900;letter-spacing:.12em}.cycle-explanation h3,.cycle-region-study h3{margin:9px 0;font-size:1.15rem}.cycle-explanation p,.cycle-region-study p{margin:0;color:#9aa9bd;line-height:1.65}.cycle-region-study{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.4fr);gap:24px;margin-top:18px;padding:25px;border:1px solid #2d405e;border-radius:18px;background:linear-gradient(135deg,#0c1827,#10132a)}.cycle-region-study ol{display:grid;gap:9px;margin:0;padding:0;list-style:none;counter-reset:cycle-steps}.cycle-region-study li{counter-increment:cycle-steps;display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;padding:11px 13px;border-radius:10px;background:#080f1b}.cycle-region-study li:before{content:counter(cycle-steps);grid-row:1/3;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#21d5e8;color:#051018;font-weight:900}.cycle-region-study li strong,.cycle-region-study li span{grid-column:2}.cycle-region-study li span{color:#90a0b7;font-size:.82rem;margin-top:2px}.cycle-practice-plan{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px;padding:16px 18px;border:1px solid #285448;border-radius:14px;background:#0b1c1a}.cycle-practice-plan strong{color:#5cffaa;margin-right:auto}.cycle-practice-plan span{padding:7px 10px;border-radius:8px;background:#102825;color:#b8cac6;font-size:.83rem}@media(max-width:850px){.cycle-explanation,.cycle-region-study{grid-template-columns:1fr}}@media(max-width:560px){.cycle-practice-plan{align-items:stretch;flex-direction:column}.cycle-practice-plan strong{margin-right:0}}
.scale-level,.mode-family,.stretched-penta{margin-top:20px;padding:24px;border:1px solid #29405f;border-radius:18px;background:linear-gradient(145deg,#0b1524,#10142a)}.scale-level header span,.mode-family header span{color:#41deef;font-size:.72rem;font-weight:900;letter-spacing:.14em}.scale-level h2,.mode-family h2{margin:7px 0}.scale-level p,.mode-family p{color:#9eacc0}.scale-level.advanced,.mode-family.advanced{border-color:#463765;background:linear-gradient(145deg,#111226,#17112b)}.scale-family-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-top:16px}.scale-family-grid button{display:grid;gap:5px;text-align:left;padding:16px;border:1px solid #30415f;border-radius:13px;background:#08101c;color:#fff}.scale-family-grid button:hover{border-color:#38dceb;transform:translateY(-1px)}.scale-family-grid span{color:#8fa0b8;font-size:.78rem}.mode-family{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center}.mode-chip-grid{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.mode-chip-grid button{padding:9px 12px;border:1px solid #334763;border-radius:999px;background:#09111e;color:#d9e5f5}.stretched-toolbar{display:flex;align-items:end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin:18px 0}.stretched-toolbar label{display:grid;gap:7px;color:#98a9c0;font-weight:800}.stretched-toolbar select{min-width:180px}.stretched-legend{display:flex;gap:10px;flex-wrap:wrap}.stretched-legend span{display:flex;align-items:center;gap:6px;color:#adbbce;font-size:.78rem}.stretched-legend i{display:grid;place-items:center;min-width:27px;height:27px;padding:0 4px;border:1px solid #7688a4;border-radius:50%;color:#fff;font-size:.68rem;font-style:normal;font-weight:900}.stretched-legend i.root{background:#2dd7e8;border-color:#2dd7e8;color:#061219}.stretched-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.stretched-card{overflow:hidden;padding:16px;border:1px solid #2c3e5b;border-radius:15px;background:#070f1b}.stretched-card header span,.stretched-card header strong,.stretched-card header small{display:block}.stretched-card header span{color:#37dced;font-size:.72rem;font-weight:900;letter-spacing:.12em}.stretched-card header strong{margin-top:5px}.stretched-card header small{margin-top:4px;color:#8293aa}.stretched-board{display:block;width:100%;margin-top:12px}.stretched-string{stroke:#8290a3;stroke-width:2}.stretched-fret{stroke:#41506a;stroke-width:1.5}.stretched-string-label,.stretched-fret-number{fill:#718199;font-size:11px;text-anchor:middle}.stretched-note circle{fill:#0b111e;stroke:#dce7f7;stroke-width:2}.stretched-note text{fill:#fff;font-size:10px;font-weight:900;text-anchor:middle;dominant-baseline:middle}.stretched-note.root circle{fill:#29d5e7;stroke:#71f0ff}.stretched-note.root text{fill:#051118}.stretched-tip{margin:17px 0 0;color:#aab8ca;line-height:1.6}.stretched-tip strong{color:#5cffaa}@media(max-width:900px){.scale-family-grid{grid-template-columns:1fr 1fr}.mode-family{grid-template-columns:1fr}.mode-chip-grid{justify-content:flex-start}.stretched-grid{grid-template-columns:1fr}}@media(max-width:560px){.scale-family-grid{grid-template-columns:1fr}.stretched-penta{padding:16px}.stretched-card{padding:10px;overflow-x:auto}.stretched-board{min-width:520px}}
.base-scale-lab{margin-top:20px;padding:26px;border:1px solid #2c4969;border-radius:20px;background:linear-gradient(145deg,#0a1524,#10162b)}.base-scale-controls{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin:20px 0}.base-scale-controls label{display:grid;gap:7px;color:#9cacc1;font-size:.82rem;font-weight:900}.base-scale-controls select{min-width:210px}.study-mode-tabs{display:flex;gap:7px;flex-wrap:wrap}.study-mode-tabs button{padding:10px 13px;border:1px solid #344661;border-radius:10px;background:#08101c;color:#b8c5d7;font-weight:800}.study-mode-tabs button.active{border-color:#2ed8e9;background:#2ed8e9;color:#061219}.base-scale-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:15px}.base-scale-summary div{padding:14px;border:1px solid #2b3d59;border-radius:12px;background:#07101c}.base-scale-summary span,.base-scale-summary strong{display:block}.base-scale-summary span{color:#39dceb;font-size:.66rem;font-weight:900;letter-spacing:.1em}.base-scale-summary strong{margin-top:6px;font-size:.86rem}.base-model-board{display:block;width:100%;min-width:650px}.base-scale-lab>#baseScaleBoard{overflow-x:auto;padding:12px;border:1px solid #263852;border-radius:15px;background:#050c16}.base-string{stroke:#8290a4;stroke-width:2}.base-fret{stroke:#3c4d67;stroke-width:1.5}.base-fret.nut{stroke:#dce8f7;stroke-width:5}.base-string-label,.base-fret-number{fill:#718198;font-size:11px;text-anchor:middle}.base-note circle{fill:#0b111d;stroke:#dce8f7;stroke-width:2}.base-note text{fill:#fff;font-size:9px;font-weight:900;text-anchor:middle;dominant-baseline:middle}.base-note.root circle{fill:#2fd8e9;stroke:#7cf3ff}.base-note.root text{fill:#061219}.base-shapes-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin:24px 0 12px}.base-shapes-head span{color:#39dceb;font-size:.7rem;font-weight:900;letter-spacing:.12em}.base-shapes-head h3{margin:5px 0}.base-shapes-head p{max-width:470px;margin:0;color:#8f9fb5}.base-scale-shapes{display:grid;grid-template-columns:repeat(5,minmax(240px,1fr));gap:10px;overflow-x:auto;padding-bottom:8px}.base-scale-shapes article{padding:12px;border:1px solid #2a3c57;border-radius:13px;background:#070f1b}.base-scale-shapes header span,.base-scale-shapes header strong{display:block}.base-scale-shapes header span{color:#35d9ea;font-size:.68rem;font-weight:900}.base-scale-shapes header strong{margin-top:4px;font-size:.83rem}.base-scale-shapes .base-model-board{min-width:0;margin-top:8px}.base-scale-instruction{margin-top:16px;padding:17px 19px;border:1px solid #2b5f50;border-radius:14px;background:#0a1d1a}.base-scale-instruction strong{color:#5cffaa}.base-scale-instruction p{margin:6px 0 0;color:#adbbb9;line-height:1.55}@media(max-width:900px){.base-scale-summary{grid-template-columns:1fr 1fr}}@media(max-width:560px){.base-scale-lab{padding:16px}.base-scale-summary{grid-template-columns:1fr}.base-shapes-head{align-items:start;flex-direction:column}.study-mode-tabs{display:grid;grid-template-columns:1fr 1fr;width:100%}.base-scale-controls label{width:100%}.base-scale-controls select{width:100%}}
.base-scale-shapes{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;overflow:visible}.base-scale-shapes article{padding:18px;border-radius:15px}.base-scale-shapes header span{font-size:.75rem}.base-scale-shapes header strong{font-size:.95rem}.base-scale-shapes .base-note circle{r:17px}.base-scale-shapes .base-note text{font-size:12px}.base-scale-shapes article:last-child{grid-column:1/-1;max-width:calc(50% - 7px)}@media(max-width:720px){.base-scale-shapes{grid-template-columns:1fr}.base-scale-shapes article:last-child{grid-column:auto;max-width:none}}
.advanced-scale-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.advanced-scale-card{min-width:0;padding:18px;border:1px solid #344568;border-radius:15px;background:#07101c}.advanced-scale-card header{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:start}.advanced-scale-card header span{color:#3bdeef;font-size:.68rem;font-weight:900;letter-spacing:.11em}.advanced-scale-card h3{margin:5px 0 3px;font-size:1.15rem}.advanced-scale-card header p{margin:0;color:#91a1b8;font-size:.82rem}.advanced-scale-card header>strong{max-width:220px;color:#dce8f7;font-size:.72rem;line-height:1.5;text-align:right}.advanced-scale-board{overflow-x:auto;margin:13px 0 12px;padding:8px;border:1px solid #263852;border-radius:12px;background:#050c16}.advanced-scale-board .base-model-board{display:block;width:100%;min-width:430px}.advanced-scale-card>button{width:100%}@media(max-width:900px){.advanced-scale-grid{grid-template-columns:1fr}}@media(max-width:560px){.advanced-scale-card{padding:13px}.advanced-scale-card header{grid-template-columns:1fr}.advanced-scale-card header>strong{text-align:left;max-width:none}}

.base-scale-shapes .base-fret-number{fill:#edf5ff;font-size:26px;font-weight:800}
@media(max-width:720px){.base-scale-shapes .base-fret-number{font-size:46px}.base-scale-shapes .base-string-label{fill:#cbd8e8;font-size:28px}.base-scale-shapes .base-model-board{overflow:visible}}
.base-scale-shapes article{background:radial-gradient(circle at 50% 42%,#0b2016,#030b07 72%);border-color:#285f43}.base-scale-shapes .base-string{stroke:#a9beb3}.base-scale-shapes .base-fret{stroke:#456454}.base-scale-shapes .base-note circle{fill:#25cf78;stroke:#9dffca;filter:drop-shadow(0 0 5px rgba(48,213,129,.38));transition:fill .12s ease,stroke .12s ease,filter .12s ease}.base-scale-shapes .base-note text{fill:#04160d}.base-scale-shapes .base-note.root circle{fill:#65efac;stroke:#effff6;stroke-width:2.5}.base-scale-shapes .base-note.active circle{fill:#f4fff8;stroke:#30d581;stroke-width:4;filter:drop-shadow(0 0 13px #30d581)}.base-scale-shapes .base-note.active text{fill:#06351f}.base-shape-play{width:100%;margin-top:10px;border-color:#2c8b5d;color:#7cf3b3;background:#07170f}