.portal-tabs{display:flex;justify-content:center;gap:12px;margin:20px auto 30px;width:min(400px,100% - 32px);background:var(--bg-card);border:1px solid var(--border-subtle);padding:5px;border-radius:var(--radius-full)}.portal-tab{flex:1;background:transparent;border:none;color:var(--text-muted);font-family:var(--font-body);font-weight:500;font-size:var(--text-base);padding:8px 16px;border-radius:var(--radius-full);cursor:pointer;transition:var(--transition);text-align:center;text-decoration:none}.portal-tab.active{background:linear-gradient(135deg,var(--gold-dim),var(--gold));color:var(--on-gold);font-weight:600}.portal-view{display:none}.portal-view.active{display:block}.lessons-grid{display:grid;grid-template-columns:var(--layout-grid-cols);gap:var(--layout-grid-gap);margin-top:24px}.lesson-card{display:flex;gap:18px;align-items:flex-start;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:22px 24px;text-align:left;cursor:pointer;color:inherit;font-family:inherit;width:100%;position:relative;overflow:hidden;transition:var(--transition-smooth)}.lesson-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 10% 10%,var(--purple-glow) 0%,transparent 60%);opacity:0;transition:var(--transition-smooth)}.lesson-card:hover{background:var(--bg-card-hover);border-color:var(--border-gold-hi);transform:translateY(-2px)}.lesson-card:hover:before{opacity:1}.lesson-num{font-family:var(--font-heading);font-size:var(--text-2xl);color:var(--gold);line-height:1;min-width:34px;flex:0 0 auto;opacity:.85;z-index:2}.lesson-card.reviewed{border-color:color-mix(in srgb,var(--gold-bright) 45%,var(--border-subtle))}.lesson-card.reviewed .lesson-num{color:var(--gold-bright);opacity:1;text-shadow:0 0 10px var(--gold-glow)}.lesson-card-body{flex:1;min-width:0;display:flex;flex-direction:column;z-index:2}.lesson-card h3{font-family:var(--font-body);font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary);margin:0 0 6px}.lesson-card p{color:var(--text-secondary);font-size:var(--text-base);line-height:1.5;margin:0 0 14px;flex:1}.lesson-meta-row{display:flex;align-items:center;justify-content:space-between;font-size:var(--text-xs);color:var(--text-muted);z-index:2}.lesson-btn-read{color:var(--text-gold);font-weight:500;transition:var(--transition)}.lesson-card:hover .lesson-btn-read{color:var(--gold-bright);transform:translate(3px)}.lesson-container{display:none;animation:fadeIn .4s ease}.lesson-container.active{display:block}.back-btn-row{margin:10px 0 24px;text-align:left}.back-btn{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid var(--border-gold);color:var(--text-gold);padding:6px 14px;border-radius:var(--radius-full);font-size:var(--text-md);cursor:pointer;transition:var(--transition)}.back-btn:hover{background:var(--gold-glow);border-color:var(--border-gold-hi)}.lesson-navigation-row{display:flex;justify-content:space-between;align-items:center;margin-top:32px;padding-top:24px;border-top:1px solid var(--border-subtle)}.lesson-article{font-family:var(--font-body);text-align:left;line-height:1.75;color:var(--text-secondary);max-width:var(--layout-prose-width);margin:0 auto}.lesson-header{border-bottom:1px solid var(--border-gold-glow);padding-bottom:24px;margin-bottom:30px}.lesson-header h1{font-family:var(--font-heading);color:var(--text-gold);font-size:clamp(1.5rem,5vw,2.3rem);margin:4px 0 8px;line-height:1.25}.lesson-subtitle{color:var(--text-muted);font-size:var(--text-base);margin:0}.lesson-article h2{font-family:var(--font-heading);color:var(--text-gold);font-size:var(--text-2xl);margin:34px 0 16px;border-left:3px solid var(--gold);padding-left:12px}.lesson-article h3{color:var(--text-primary);font-size:var(--text-xl);margin:24px 0 12px}.lesson-article p{margin:0 0 20px;font-size:var(--text-lg)}.lesson-article ul,.lesson-article ol{margin:0 0 20px;padding-left:24px;font-size:var(--text-lg)}.lesson-article li{margin-bottom:8px}.lesson-article strong{color:var(--text-primary)}.lesson-article blockquote{background:var(--purple-glow);border-left:3px solid var(--indigo);margin:24px 0;padding:16px 20px;border-radius:var(--radius-sm);font-style:italic;color:var(--text-primary)}.lesson-article table{width:100%;border-collapse:collapse;margin:24px 0;font-size:var(--text-base);background:hsl(var(--surface-base) / .4)}.lesson-article th,.lesson-article td{border:1px solid var(--border-light);padding:10px 14px;text-align:left}.lesson-article th{background:var(--bg-dark);color:var(--text-gold);font-weight:600;letter-spacing:.05em;text-transform:uppercase;font-size:var(--text-sm)}.lesson-article td strong{color:var(--gold-bright)}.callout{border-radius:var(--radius-sm);padding:16px 20px;margin:24px 0;font-size:var(--text-base)}.callout.note{background:var(--purple-glow);border-left:3px solid var(--indigo)}.callout.tip{background:var(--teal-glow);border-left:3px solid var(--teal)}.callout.important{background:var(--gold-glow);border-left:3px solid var(--gold)}.callout-title{font-weight:600;color:var(--text-primary);margin-bottom:6px;display:flex;align-items:center;gap:8px}.widget-box{background:var(--bg-dark);border:1px solid var(--border-gold-glow);border-radius:var(--radius-md);padding:24px;margin:28px 0;display:flex;flex-direction:column;gap:16px}.btn-action{background:linear-gradient(135deg,var(--gold-dim),var(--gold));color:var(--on-gold);border:none;padding:10px 20px;border-radius:var(--radius-full);font-weight:var(--weight-semibold);font-size:var(--text-base);font-family:var(--font-body);cursor:pointer;transition:var(--transition);display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 2px 12px -4px var(--gold-glow)}.btn-action:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 6px 18px -6px var(--gold-glow)}.btn-action:active,.btn-action.pressed{transform:translateY(0) scale(.97);filter:brightness(.96)}.btn-action.active{background:var(--rose);color:var(--on-accent)}.thaat-chip{background:var(--bg-card);border:1px solid var(--border-subtle);color:var(--text-secondary);font-family:var(--font-body);font-weight:var(--weight-medium);font-size:var(--text-sm);padding:7px 15px;border-radius:var(--radius-full);cursor:pointer;transition:var(--transition);white-space:nowrap}.thaat-chip:hover{border-color:var(--border-gold);background:var(--bg-card-hover);color:var(--text-primary)}.thaat-chip.active{background:linear-gradient(135deg,var(--gold-dim),var(--gold));border-color:transparent;color:var(--on-gold);font-weight:var(--weight-semibold);box-shadow:0 2px 10px -3px var(--gold-glow)}.tap-pad{width:100%;height:60px;font-size:var(--text-xl)}.staircase-wrap{display:flex;flex-direction:column-reverse;gap:6px;max-width:480px;margin:0 auto;width:100%}.staircase-step{display:flex;align-items:center;justify-content:space-between;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:8px 16px;cursor:pointer;transition:var(--transition-smooth);user-select:none}.staircase-step:hover{border-color:var(--border-gold);background:var(--bg-card-hover);transform:translate(4px)}.staircase-step.komal{border-left:5px solid var(--indigo);margin-left:20px;background:hsl(var(--indigo-base) / .05)}.staircase-step.teevra{border-left:5px solid var(--rose);margin-left:20px;background:hsl(var(--indigo-base) / .05)}.staircase-step.shudh{border-left:5px solid var(--gold)}.staircase-step.active{background:linear-gradient(90deg,var(--gold-glow),var(--gold-dim))!important;border-color:var(--border-gold-hi);box-shadow:0 0 12px var(--gold-glow);transform:translate(8px)}.staircase-step.active span{color:var(--on-gold)!important;font-weight:700}.step-note{font-family:var(--font-gurmukhi);font-size:var(--text-xl);color:var(--text-gold)}.step-name{font-size:var(--text-sm);color:var(--text-primary)}.step-ratio{font-family:monospace;font-size:var(--text-xs);color:var(--text-muted)}.drill-display-box{background:var(--bg-deep);border-radius:var(--radius-sm);padding:20px;text-align:center;border:1px solid var(--border-light);min-height:80px}.drill-notes-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:12px}.drill-note-card{background:var(--bg-card);border:1px solid var(--border-gold-glow);border-radius:var(--radius-sm);min-width:44px;padding:8px;font-size:var(--text-2xl);font-weight:600;color:var(--text-gold);transition:var(--transition)}.drill-note-card.highlight{background:var(--gold);color:var(--on-gold);transform:scale(1.1);box-shadow:0 0 10px var(--gold)}.drill-meta{font-size:var(--text-md);color:var(--text-muted)}.decoder-selector-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:16px}.sirlekh-display{font-family:var(--font-gurmukhi);font-size:var(--text-4xl);color:var(--text-gurmukhi);text-align:center;padding:20px;background:var(--bg-deep);border-radius:var(--radius-sm);border:1px solid var(--border-subtle);letter-spacing:.05em;margin-bottom:16px}.decoded-tokens{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}.decoded-token-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:12px;text-align:center;transition:var(--transition-smooth)}.decoded-token-card.highlight-raag{border-color:var(--gold);background:hsl(var(--gold-base) / .06)}.decoded-token-card.highlight-author{border-color:var(--indigo);background:hsl(var(--indigo-base) / .06)}.decoded-token-card.highlight-form{border-color:var(--teal);background:hsl(var(--tint-teal) / .06)}.decoded-token-card.highlight-key{border-color:var(--rose);background:hsl(var(--indigo-base) / .06)}.token-type{font-size:var(--text-2xs);text-transform:uppercase;color:var(--text-muted);letter-spacing:.08em;margin-bottom:4px}.token-val{font-family:var(--font-gurmukhi);font-size:var(--text-xl);color:var(--text-primary);margin-bottom:4px}.token-expl{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.3}.morph-slider{width:100%;accent-color:var(--gold);cursor:pointer}.mixer-grid{display:grid;grid-template-columns:1fr;gap:16px}@media(min-width:600px){.mixer-grid{grid-template-columns:1fr 1fr}}.mixer-channel{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:14px;display:flex;flex-direction:column;gap:8px}.channel-header{display:flex;justify-content:space-between;align-items:center}.channel-name{font-weight:600;font-size:var(--text-base);color:var(--text-gold)}.channel-vol-slider{width:100%;accent-color:var(--gold)}@keyframes pulse{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1;box-shadow:0 0 10px var(--gold)}to{transform:scale(1);opacity:.8}}.thaat-container{background:var(--bg-dark);border:1px solid var(--border-gold-glow);border-radius:var(--radius-md);padding:24px;margin:28px 0}.thaat-selector{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:20px}.thaat-details{text-align:center;margin-bottom:20px;min-height:48px}.thaat-details h4{margin:0 0 4px;font-size:var(--text-xl);color:var(--text-gold);font-family:var(--font-heading)}.thaat-details p{margin:0;font-size:var(--text-md);color:var(--text-muted)}.kb-deck{display:flex;position:relative;height:150px;width:100%;max-width:580px;margin:0 auto;border:1px solid hsla(0,0%,100%,.1);border-radius:0 0 var(--radius-sm) var(--radius-sm);overflow:visible;background:#111;box-shadow:0 10px 30px #00000080}.kb-key{position:relative;flex:1;height:100%;background:linear-gradient(180deg,#fff,#e0e0e0);border-right:1px solid #bbb;border-radius:0 0 4px 4px;cursor:pointer;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:12px;color:#222;font-size:var(--text-sm);font-weight:600;user-select:none;transition:background .1s,opacity .3s}.kb-key:last-child{border-right:none}.kb-key.black{position:absolute;width:6.2%;height:60%;background:linear-gradient(180deg,#333,#111);border:1px solid #000;border-radius:0 0 3px 3px;z-index:2;margin-left:-3.1%;color:var(--text-gold);padding-bottom:8px;font-size:var(--text-2xs)}.kb-key:active,.kb-key.pressed,.kb-key.black:active,.kb-key.black.pressed{background:linear-gradient(180deg,var(--gold-bright),var(--gold))!important;color:#1a1205}.kb-key.highlighted-note{border-bottom:5px solid var(--gold);background:linear-gradient(180deg,#fff,#fffae8);box-shadow:0 4px 10px #d4af3733;color:#b58900;font-weight:700}.kb-key.black.highlighted-note{border-bottom:4px solid var(--gold);background:linear-gradient(180deg,#443c2c,#1f1a10);box-shadow:0 4px 12px #d4af3766;color:var(--text-gold);font-weight:700}.kb-key.dimmed{opacity:.28}.kb-key.dimmed:hover{opacity:.5}.clock-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:28px;margin:28px 0}.clock-svg-wrap{position:relative;width:280px;aspect-ratio:1 / 1;flex:0 0 auto}.clock-radial{position:absolute;inset:0;width:100%;height:100%;display:block}@media(max-width:380px){.clock-svg-wrap{width:240px}}.clock-slice{fill:hsl(var(--gold-base) / .18);stroke:var(--bg-deep);stroke-width:.6;cursor:pointer;transition:fill .25s,transform .25s;transform-origin:50% 50%}.clock-slice.night{fill:hsl(var(--indigo-base) / .16)}.clock-slice:hover{fill:hsl(var(--gold-base) / .4)}.clock-slice.night:hover{fill:hsl(var(--indigo-base) / .38)}.clock-slice.active{fill:var(--gold)!important;filter:drop-shadow(0 0 6px var(--gold-glow))}.clock-slice.night.active{fill:var(--indigo-primary, #8a5cf6)!important}.clock-labels-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.clock-labels-svg text{fill:var(--text-muted);font-family:var(--font-body);font-size:4.5px;letter-spacing:.04em}.clock-details-card{flex:1 1 240px;min-width:220px;max-width:360px;background:var(--bg-card);border:1px solid var(--border-gold-glow);border-radius:var(--radius-md);padding:18px 20px}.clock-details-card h4{font-family:var(--font-heading);color:var(--text-gold);margin:0 0 4px;font-size:var(--text-lg)}.clock-details-card .time{font-family:monospace;color:var(--text-secondary);font-size:var(--text-sm);margin-bottom:10px}.clock-details-card .mood{color:var(--text-primary);font-style:italic;font-size:var(--text-base);margin:0 0 12px;line-height:var(--leading-relaxed)}.clock-details-card .raag-list{font-size:var(--text-sm);color:var(--text-muted);padding-top:10px;border-top:1px solid var(--border-subtle)}.clock-details-card .raag-list b{color:var(--text-gold);font-weight:var(--weight-semibold)}.taal-controls{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin-bottom:8px}.taal-play-btn{background:linear-gradient(135deg,var(--gold-dim),var(--gold));color:var(--on-gold);border:none;padding:7px 18px;border-radius:var(--radius-full);font-family:var(--font-body);font-weight:var(--weight-semibold);font-size:var(--text-sm);cursor:pointer;transition:var(--transition);white-space:nowrap;box-shadow:0 2px 10px -3px var(--gold-glow)}.taal-play-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}.taal-play-btn.active{background:var(--rose);color:var(--on-accent)}.taal-visualizer{position:relative;width:240px;aspect-ratio:1 / 1;margin:4px auto 0}@media(max-width:380px){.taal-visualizer{width:200px}}.taal-circle-svg{position:absolute;inset:0;width:100%;height:100%;display:block}.taal-circle-track{fill:none;stroke:var(--border-subtle);stroke-width:1.5}.taal-circle-progress{fill:none;stroke:var(--gold);stroke-width:1.5;opacity:.5;transition:stroke-dashoffset .1s linear}.taal-beat-node{fill:hsl(var(--ink-hi) / .22);stroke:var(--bg-deep);stroke-width:.5;transition:fill .1s,r .1s}.taal-beat-node.sam{fill:var(--gold)}.taal-beat-node.clap{fill:var(--teal, #2bb3a3)}.taal-beat-node.khali{fill:#99999980}.taal-beat-label{fill:var(--text-secondary);font-family:var(--font-body);font-size:3.4px;text-anchor:middle;dominant-baseline:central;pointer-events:none}.taal-meta{text-align:center;color:var(--text-muted);font-size:var(--text-sm);margin-top:12px;line-height:var(--leading-relaxed)}.taal-meta b{color:var(--text-gold)}@keyframes kirtanDeeplinkFlash{0%{background-color:transparent}14%{background-color:color-mix(in srgb,var(--gold-bright) 30%,transparent)}to{background-color:transparent}}.kirtan-deeplink-flash>td{animation:kirtanDeeplinkFlash 2.2s ease-out}