@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&family=Noto+Serif+KR:wght@300;400;600;700&display=swap";:root{--midnight:#11131d;--indigo:#171c30;--ink:#0b0d14;--moon:#f8f6ef;--silk:#d8d1c3;--silk-soft:#d8d1c3b8;--amber:#f0d088;--sage:#8fa58a;--plum:#6d4e63;--danger:#d97473;--line:#f8f6ef29;--panel:#ffffff0e;--panel-strong:#ffffff18;--shadow:0 22px 70px #00000057;--serif-display:"Cormorant Garamond", Georgia, serif;--serif-kr:"Noto Serif KR", "Apple SD Gothic Neo", "Malgun Gothic", serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:geometricprecision}*{box-sizing:border-box}html{min-height:100%}body{color:var(--silk);font-family:var(--serif-kr);background:linear-gradient(#090b12e0 0%,#11131df5 42%,#0b0d14fc 100%),url(/assets/dal-lumen-channel-art-hero.jpg) 100% 0/min(1600px,145vw) no-repeat,radial-gradient(circle at 88% 4%,#f0d08829,#0000 28rem),linear-gradient(#11131d 0%,#171923 46%,#0b0d14 100%);min-height:100%;margin:0;line-height:1.7;overflow-x:hidden}body::selection{background:var(--amber);color:var(--ink)}button,input,select{font:inherit}button{-webkit-tap-highlight-color:transparent}img{max-width:100%;display:block}.app-shell{min-height:100svh;padding:max(92px, calc(74px + env(safe-area-inset-top))) max(5vw, env(safe-area-inset-right)) max(3rem, env(safe-area-inset-bottom)) max(5vw, env(safe-area-inset-left));gap:clamp(1rem,2.6vw,1.45rem);margin:0 auto;display:grid}.app-header{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);z-index:70;background:#0a0c14c7;border-bottom:1px solid #f8f6ef24;justify-content:space-between;align-items:center;min-height:72px;padding:0 5vw;display:flex;position:fixed;top:0;left:0;right:0;box-shadow:0 14px 36px #0000003d}.brand-mark{color:var(--moon);font-family:var(--serif-display);letter-spacing:.18em;white-space:nowrap;align-items:center;gap:.62rem;font-size:1.1rem;font-weight:600;text-decoration:none;display:inline-flex}.brand-mark img{filter:drop-shadow(0 0 14px #f0d08857);width:34px;height:34px}.app-header p{color:#f0d088d1;font-family:var(--serif-display);text-align:right;margin:0;font-size:clamp(.82rem,3.4vw,.98rem);font-style:italic}.practice-layout{grid-template-columns:minmax(0,1fr);gap:clamp(.9rem,2.4vw,1.2rem);width:100%;max-width:1180px;margin:0 auto;display:grid}.control-panel,.hand-panel,.safety-band,.last-result,.completion-panel{border:1px solid var(--line);box-shadow:var(--shadow);background:radial-gradient(circle at 96% 0,#f0d08814,#0000 20rem),linear-gradient(#1e202de6,#0e1018f2);border-radius:8px}.control-panel{gap:.95rem;padding:clamp(.95rem,2.6vw,1.25rem);display:grid;position:relative;overflow:hidden;container-type:inline-size}.control-panel:after{content:"";opacity:.06;pointer-events:none;background:url(/assets/dal-lumen-logo-mark-512.png) 50%/contain no-repeat;width:min(42vw,360px);height:min(42vw,360px);position:absolute;top:50%;right:-6%;transform:translateY(-50%)}.control-panel>*{z-index:1;position:relative}.section-heading{gap:.35rem;display:grid}.eyebrow{color:var(--amber);font-family:var(--serif-display);letter-spacing:.08em;margin:0;font-size:clamp(.92rem,3.2vw,1.08rem);font-style:italic}h1,h2,h3{color:var(--moon);font-family:var(--serif-display);letter-spacing:0;margin:0;font-weight:600;line-height:1.06}h1{word-break:keep-all;font-size:clamp(1.85rem,5.3vw,2.9rem)}.control-panel h1{font-family:var(--serif-kr);overflow-wrap:normal;white-space:nowrap;max-width:920px;font-size:clamp(1.28rem,6.2cqw,2.55rem);font-weight:700;line-height:1.16}h2{font-size:clamp(1.45rem,5.8vw,2.35rem)}.subcopy,.level-note,.completion-panel p,.grounding-panel li,.safety-band p,.last-result p{color:var(--silk-soft);margin:0}.field-grid{grid-template-columns:repeat(2,minmax(180px,1fr));gap:.68rem .78rem;display:grid}.field,fieldset.field{border:0;gap:.45rem;min-width:0;margin:0;padding:0;display:grid}.field span,legend{color:#f8f6efe0;font-size:.82rem;font-weight:600}.field input:not([type=range]),.field select{appearance:none;color:var(--moon);background:#0b0d14b8;border:1px solid #f8f6ef2e;border-radius:8px;width:100%;min-width:0;min-height:42px;padding:.68rem .82rem}.field select{background:linear-gradient(45deg, transparent 50%, var(--amber) 50%) calc(100% - 17px) 50% / 6px 6px no-repeat, linear-gradient(135deg, var(--amber) 50%, transparent 50%) calc(100% - 12px) 50% / 6px 6px no-repeat, #0b0d14b8;padding-right:2.15rem}.field option{background:var(--midnight);color:var(--moon)}.custom-emotion-input{margin-top:.08rem}.speed-field,.intensity-field{grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:.75rem}.speed-field span,.intensity-field span{grid-column:1/-1}input[type=range]{accent-color:var(--amber);cursor:pointer;width:100%;min-width:0}.speed-field strong,.intensity-field strong{color:var(--amber);font-family:var(--serif-display);text-align:right;min-width:1.5rem;font-size:1.3rem}.segmented-control{background:#ffffff0a;border:1px solid #f8f6ef1f;border-radius:999px;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem;padding:.28rem;display:grid}.segmented-control button,.button{cursor:pointer;border-radius:999px;justify-content:center;align-items:center;gap:.42rem;min-height:44px;transition:background .18s,border-color .18s,color .18s,transform .18s;display:inline-flex}.segmented-control button{color:#f8f6efad;white-space:nowrap;background:0 0;border:1px solid #0000;min-width:0;padding:.52rem;font-size:.82rem}.segmented-control button.is-selected{color:var(--amber);background:#f0d08826;border-color:#f0d08885}.cue-rule-card{background:#ffffff0a;border:1px solid #f8f6ef1f;border-radius:999px;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem;min-height:44px;padding:.28rem;display:grid}.cue-rule-card span{color:#f8f6efa8;text-align:center;white-space:nowrap;background:#f0d08814;border:1px solid #f0d0883d;border-radius:999px;place-items:center;gap:.02rem;min-width:0;padding:.4rem .3rem;font-size:.68rem;line-height:1.1;display:grid}.cue-rule-card strong{color:var(--amber);font-family:var(--serif-kr);font-size:.82rem;font-weight:700}.button{color:var(--moon);white-space:nowrap;border:1px solid #0000;min-width:0;padding:.62rem .82rem;font-size:.9rem}.button:hover,.button:focus-visible,.segmented-control button:hover,.segmented-control button:focus-visible{outline:0;transform:translateY(-1px)}.button-primary{background:var(--amber);border-color:var(--amber);color:#19150d}.button-secondary{background:#ffffff0a;border-color:#f8f6ef47}.button-danger{color:#ffd6d5;background:#d9747324;border-color:#d974737a}.button-quiet{color:#f8f6efdb;background:#f0d08814;border-color:#f0d0883d}button:disabled,input:disabled,select:disabled{cursor:not-allowed;opacity:.58}.action-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;display:grid}.level-note{background:#0b0d1457;border:1px solid #f8f6ef1a;border-left-color:#f0d0887a;border-radius:8px;padding:.8rem}.level-note strong{color:var(--amber);font-family:var(--serif-display);margin-right:.35rem}.completion-panel,.grounding-panel{background:radial-gradient(circle at 12% 0,#f0d0881a,#0000 18rem),linear-gradient(#1c1d27f0,#0a0c13fa);border:1px solid #f8f6ef1f;border-radius:8px;gap:.85rem;padding:clamp(.9rem,2.4vw,1rem);display:grid}.delta-card{color:var(--moon);background:#f0d0881a;border:1px solid #f0d0883d;border-radius:8px;align-items:center;gap:.55rem;min-height:48px;padding:.7rem .82rem;display:flex}.grounding-panel{align-content:start}.modal-layer{padding:max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));z-index:120;place-items:center;display:grid;position:fixed;inset:0}.modal-scrim{cursor:pointer;background:radial-gradient(circle at 50% 34%,#f0d0881f,#0000 24rem),#07090fb8;border:0;width:100%;padding:0;position:absolute;inset:0}.center-dialog{z-index:1;width:min(520px,100%);max-height:min(720px,100svh - 2rem);position:relative;overflow:auto}.center-dialog .grounding-panel{box-shadow:0 28px 90px #00000094}.grounding-panel-top{justify-content:space-between;align-items:start;gap:1rem;display:flex}.grounding-icon{color:var(--amber);background:#f0d0881a;border:1px solid #f0d08852;border-radius:50%;justify-content:center;align-items:center;width:74px;height:74px;display:inline-flex}.icon-button{color:#f8f6efd1;cursor:pointer;background:#0b0d1494;border:1px solid #f8f6ef29;border-radius:999px;justify-content:center;align-items:center;width:38px;height:38px;padding:0;transition:background .16s,border-color .16s,color .16s;display:inline-flex}.icon-button:hover,.icon-button:focus-visible{color:var(--amber);background:#f0d0881f;border-color:#f0d0885c;outline:0}.grounding-panel ol{gap:.65rem;margin:0;padding-left:1.2rem;display:grid}.grounding-actions{grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);gap:.62rem;display:grid}.hands-stage{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.85rem,2.4vw,1.2rem);width:100%;max-width:1180px;margin:0 auto;display:grid;position:relative}.hands-stage.has-stage-dialog .hand-panel{filter:saturate(.74)brightness(.58);opacity:.48;pointer-events:none}.stage-dialog{z-index:20;background:radial-gradient(circle at 50% 34%,#f0d08829,#0000 18rem),#07090f7a;border:1px solid #f0d0882e;border-radius:8px;place-items:center;padding:clamp(.65rem,2vw,1rem);display:grid;position:absolute;inset:clamp(.7rem,2vw,1rem)}.stage-dialog .completion-panel{width:min(520px,100%);max-height:100%;overflow:auto;box-shadow:0 24px 70px #00000085}.hand-panel{align-content:start;gap:.65rem;padding:clamp(.8rem,2.5vw,1rem);transition:border-color .18s,box-shadow .18s,filter .18s,opacity .18s;display:grid;overflow:hidden}.hand-panel.is-active{box-shadow:var(--shadow), 0 0 0 1px #f0d0881a, 0 0 28px #f0d0881a;border-color:#f0d0886b}.hand-header{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.46rem;display:grid}.hand-header svg{color:var(--amber)}.hand-header h2{min-width:0;font-size:clamp(1.08rem,4.5vw,1.36rem)}.hand-header span{color:var(--amber);text-align:center;background:#f0d0881a;border:1px solid #f0d08838;border-radius:999px;min-width:50px;padding:.26rem .52rem;font-size:.78rem}.active-count{color:#f8f6efeb;font-family:var(--body);letter-spacing:0;background:#8fa58a24;border:1px solid #8fa58a6b;border-radius:999px;grid-column:2/4;justify-self:start;padding:.18rem .46rem;font-size:.68rem;font-weight:700}.hand-canvas{--hand-direction:1;aspect-ratio:2/3;background:linear-gradient(#0c0e16bd,#0b0d14e6),url(/assets/dal-lumen-channel-art-hero.jpg) 50%/cover;border:1px solid #f0d08833;border-radius:8px;justify-self:center;place-items:center;width:min(100%,clamp(200px,24vw,270px));min-height:0;display:grid;position:relative;overflow:hidden}.hand-left .hand-canvas,.hand-right .hand-canvas{--hand-direction:-1}.hand-canvas img{filter:sepia(.18)saturate(.92)drop-shadow(0 20px 34px #00000052);object-fit:contain;opacity:.9;height:97%;transform:scaleX(var(--hand-direction));transform-origin:50% 58%;z-index:1;width:97%}.hand-canvas.has-mudra img{opacity:.96}.finger-light{animation:fingerLightPulse var(--cue-duration,.72s) ease-in-out infinite;pointer-events:none;z-index:2;background:radial-gradient(circle,#f8f6eff5 0 13%,#f0d088db 14% 34%,#f0d0883d 45%,#0000 72%);border:1px solid #f0d088eb;border-radius:50%;width:clamp(52px,12vw,76px);height:clamp(52px,12vw,76px);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 6px #f0d0881f,0 0 28px #f0d0889e}.finger-light.is-target{background:radial-gradient(circle,#f8f6eff0 0 13%,#b9c9a6e0 14% 34%,#8fa58a3d 45%,#0000 72%);border-color:#b9c9a6f0;box-shadow:0 0 0 6px #8fa58a21,0 0 28px #8fa58a8f}.finger-dot{color:#f8f6ef80;z-index:4;background:#0b0d14a3;border:1px solid #f8f6ef24;border-radius:50%;justify-content:center;align-items:center;width:clamp(24px,5.7vw,34px);min-width:24px;height:clamp(24px,5.7vw,34px);min-height:24px;transition:background .16s,border-color .16s,box-shadow .16s,color .16s,transform .16s;display:inline-flex;position:absolute;transform:translate(-50%,-50%)}.finger-dot span{white-space:nowrap;font-size:clamp(.55rem,2vw,.66rem);line-height:1}.finger-dot.is-enabled{color:#f8f6efdb;border-color:#f0d0886b}.finger-dot.is-active-finger:after{animation:activeFingerHalo var(--cue-duration,.72s) ease-in-out infinite;content:"";pointer-events:none;border:1px solid #f0d088b8;border-radius:50%;position:absolute;inset:-5px}.finger-dot.is-active-finger{color:var(--moon);background:#f0d08824;border-color:#f0d088b8;transform:translate(-50%,-50%)scale(1.04);box-shadow:0 0 0 4px #f0d08817,0 0 16px #f0d08842}.hand-cue-board{justify-items:center;gap:.45rem;width:100%;padding-top:.1rem;display:grid}.finger-button-row{justify-content:center;align-items:start;gap:clamp(.28rem,1.1vw,.5rem);width:100%;display:flex}.finger-cue-button{color:#f8f6ef6b;cursor:default;text-align:center;background:0 0;border:0;place-items:center;gap:.24rem;min-width:0;padding:0;display:grid}.finger-cue-button:disabled{opacity:.32}.finger-cue-button.is-enabled{color:#f8f6efb8;opacity:1}.finger-cue-orb{background:#141722c7;border:2px solid #f8f6ef24;border-radius:50%;width:clamp(30px,6.2vw,42px);height:clamp(30px,6.2vw,42px);transition:background .16s,border-color .16s,box-shadow .16s,filter .16s;display:block;box-shadow:inset 0 0 18px #00000042}.finger-cue-label{white-space:nowrap;font-size:clamp(.56rem,1.8vw,.68rem);line-height:1}.finger-cue-button.is-enabled .finger-cue-orb{border-color:#f0d0885c}.finger-cue-button.is-active-finger .finger-cue-orb{animation:fingerButtonPulse var(--cue-duration,.72s) ease-in-out infinite;background:radial-gradient(circle at 48% 42%,#f8f6efe6 0 10%,#f0d08885 13%,#f0d0882e 58%),#f0d08829;border-color:#f0d088eb;box-shadow:0 0 0 4px #f0d0881c,0 0 18px #f0d08857,inset 0 0 16px #f0d08829}.finger-cue-button.is-active-finger.is-target .finger-cue-orb{background:radial-gradient(circle at 48% 42%,#f8f6efe6 0 10%,#b9c9a68a 13%,#8fa58a33 58%),#8fa58a24;border-color:#b9c9a6e6;box-shadow:0 0 0 4px #8fa58a1f,0 0 18px #8fa58a57,inset 0 0 16px #8fa58a26}.finger-cue-button.is-active-finger .finger-cue-label{color:var(--amber);font-weight:700}.finger-cue-button.is-active-finger.is-target .finger-cue-label{color:#d5e2c5f5}.hand-action-cue{color:#f8f6ef8f;cursor:default;background:#0b0d148c;border:1px solid #f8f6ef24;border-radius:999px;justify-self:center;place-items:center;gap:.08rem;width:min(220px,82%);min-height:48px;padding:.48rem .75rem;display:grid}.hand-action-cue span{font-size:.76rem;font-weight:700;line-height:1}.hand-action-cue strong{color:#f8f6ef9e;font-family:var(--serif-display);font-size:.84rem;font-weight:600;line-height:1.1}.hand-action-cue.is-active{animation:cueButtonPulse var(--cue-duration,.72s) ease-in-out infinite;color:#19150d;background:#f0d088eb;border-color:#f0d088fa;box-shadow:0 0 0 5px #f0d0881f,0 0 24px #f0d08857}.hand-action-cue.is-active strong{color:#2a2111}.status-row{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(.5rem,1vw,.72rem);width:100%;max-width:1180px;margin:0 auto;display:grid}.status-row.is-single{grid-template-columns:minmax(0,1fr)}.safety-band,.last-result{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.5rem;width:100%;min-height:46px;margin:0;padding:.46rem .64rem;display:grid}.safety-band p,.last-result p{font-size:.76rem;line-height:1.38}.safety-band strong,.last-result strong{color:var(--amber);font-family:var(--serif-display);white-space:nowrap;margin-right:.28rem;font-size:.86rem}.safety-band svg,.last-result svg{color:var(--amber);width:16px;height:16px}.last-result{background:radial-gradient(circle at 4% 0,#8fa58a1f,#0000 15rem),linear-gradient(#1b2022e0,#0e1018f0)}@keyframes activeFingerHalo{0%,to{opacity:.38;transform:scale(.9)}50%{opacity:.9;transform:scale(1.08)}}@keyframes fingerLightPulse{0%{opacity:.72;transform:translate(-50%,-50%)scale(.82)}48%,62%{opacity:1;transform:translate(-50%,-50%)scale(1.04)}to{opacity:.72;transform:translate(-50%,-50%)scale(.82)}}@keyframes cueButtonPulse{0%,to{filter:brightness(.98);box-shadow:0 0 0 4px #f0d0881a,0 0 18px #f0d08842}50%{filter:brightness(1.04);box-shadow:0 0 0 5px #f0d08824,0 0 26px #f0d0885c}}@keyframes fingerButtonPulse{0%,to{filter:brightness(.98);opacity:.94}50%{filter:brightness(1.08);opacity:1}}@container (width<=560px){.control-panel{gap:.82rem}.control-panel h1{font-size:clamp(1.24rem,6.1cqw,2.35rem)}.field-grid{grid-template-columns:1fr}.field-level select{min-height:44px}.action-row{grid-template-columns:repeat(3,minmax(0,1fr))}.button{padding-left:.48rem;padding-right:.48rem;font-size:.82rem}}@media (width<=900px){.grounding-panel{min-height:auto}}@media (width>=901px){.field-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=620px){.app-shell{padding-left:.72rem;padding-right:.72rem}.app-header p{display:none}.field-grid,.action-row,.hands-stage,.status-row{grid-template-columns:1fr}.hands-stage{gap:.85rem}.hand-canvas{width:min(100%,clamp(188px,56vw,230px));min-height:0}.action-row .button{width:100%}.center-dialog{width:min(100%,430px)}.grounding-actions{grid-template-columns:1fr}}@media (width<=390px){.control-panel,.completion-panel,.grounding-panel,.hand-panel{padding:.82rem}.segmented-control{grid-template-columns:1fr}.hand-canvas{width:min(100%,190px);min-height:0}}@media (width>=980px){.hands-stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.hand-canvas{width:min(78%,270px);max-height:none}}@media (width>=1100px){.app-shell{max-width:1440px;padding-bottom:clamp(.75rem,1.4vw,1.2rem);padding-left:clamp(1rem,2.5vw,2.25rem);padding-right:clamp(1rem,2.5vw,2.25rem);padding-top:max(86px, calc(72px + env(safe-area-inset-top)));grid-template-columns:minmax(360px,430px) minmax(0,1fr) minmax(0,1fr);grid-template-areas:"setup hands hands""setup status status";align-items:start;gap:clamp(.8rem,1.4vw,1.15rem)}.practice-layout{grid-area:setup;gap:.75rem;max-width:none;margin:0}.control-panel{gap:.68rem;padding:.85rem}.section-heading{gap:.2rem}.eyebrow{font-size:.95rem}.control-panel h1{font-size:clamp(1.28rem,6.2cqw,1.58rem);line-height:1.14}.subcopy{font-size:.82rem;line-height:1.5}.practice-layout .field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem .58rem}.practice-layout .field-level,.practice-layout .speed-field,.practice-layout .intensity-field{grid-column:1/-1}.field,fieldset.field{gap:.32rem}.field span,legend{font-size:.76rem}.field input:not([type=range]),.field select{min-height:38px;padding-top:.54rem;padding-bottom:.54rem}.segmented-control button,.button{min-height:40px}.segmented-control button{padding:.44rem .38rem;font-size:.78rem}.cue-rule-card{min-height:40px}.cue-rule-card span{padding:.34rem .24rem;font-size:.62rem}.cue-rule-card strong{font-size:.76rem}.action-row{gap:.5rem}.button{padding:.52rem .54rem;font-size:.82rem}.level-note{padding:.62rem .7rem;font-size:.78rem;line-height:1.5}.completion-panel,.grounding-panel{gap:.62rem;padding:.75rem}.hands-stage{grid-area:hands;grid-template-columns:repeat(2,minmax(0,1fr));align-self:start;gap:clamp(.72rem,1.2vw,.95rem);max-width:none;margin:0}.hand-panel{gap:.5rem;padding:.78rem}.hand-header{gap:.34rem}.hand-header h2{font-size:1.08rem}.hand-header span{min-width:46px;padding:.2rem .42rem;font-size:.72rem}.active-count{padding:.14rem .38rem;font-size:.64rem}.hand-canvas{width:min(76%,260px);height:auto;min-height:0;max-height:none}.safety-band,.last-result{max-width:none;min-height:42px;margin:0;padding:.42rem .58rem;font-size:.72rem;line-height:1.34}.status-row{grid-area:status;max-width:none;margin:clamp(-1.2rem,-1.2vw,-.55rem) 0 0}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
