:root{--base: #0b0f14;--panel: #121820;--raised: #1a2330;--ink: #d7e0ea;--muted: #7a8794;--accent: #2ec4b6;--goal: #f4a261;--danger: #e76f51;--border: #243041;--sans: "IBM Plex Sans", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace;--radius: 5px}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--base);color:var(--ink);font-family:var(--sans);font-size:13px;line-height:1.45;overflow:hidden}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer;background:var(--raised);border:1px solid var(--border);border-radius:var(--radius);padding:6px 10px;color:var(--ink)}button:hover{border-color:var(--accent);color:var(--accent)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.primary{background:var(--accent);border-color:var(--accent);color:var(--base);font-weight:600}button.primary:hover{filter:brightness(1.08);color:var(--base)}button.ghost{background:transparent}button:disabled{opacity:.45;cursor:not-allowed}.app{display:grid;grid-template-rows:48px 1fr;height:100%;min-height:0}.toolbar{display:flex;align-items:center;gap:12px;padding:0 14px;border-bottom:1px solid var(--border);background:var(--panel);min-width:0}.brand{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-weight:600;font-size:14px;letter-spacing:.02em;color:var(--accent);flex-shrink:0;user-select:none}.brand-logo{width:22px;height:22px;display:block;flex-shrink:0;border-radius:5px}.brand span{color:var(--muted);font-weight:400}.level-title{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.level-meta{color:var(--muted);font-family:var(--mono);font-size:11px;flex-shrink:0}.toolbar-actions{margin-inline-start:auto;display:flex;gap:8px;flex-wrap:wrap;align-items:center;position:relative}.lang-menu{position:relative;display:inline-flex}.lang-btn{min-width:3.2rem;min-height:36px;padding:6px 10px;font-size:12px;letter-spacing:.04em;border:1px solid var(--border);border-radius:8px;background:transparent;color:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:var(--sans);font-weight:600}.lang-btn:hover{border-color:var(--accent)}.lang-caret{width:0;height:0;border-inline-start:4px solid transparent;border-inline-end:4px solid transparent;border-top:5px solid currentColor;opacity:.7}.lang-dropdown{display:none;position:absolute;top:calc(100% + 6px);inset-inline-end:0;flex-direction:column;gap:4px;min-width:100px;padding:6px;background:var(--panel);border:1px solid var(--border);border-radius:10px;box-shadow:0 16px 40px #00000073;z-index:60}.lang-dropdown.is-open{display:flex}.lang-option{min-height:34px;padding:6px 10px;border:1px solid transparent;border-radius:6px;background:transparent;color:inherit;cursor:pointer;text-align:start;font-size:12px;font-weight:500;display:flex;align-items:center;justify-content:space-between;width:100%}.lang-option:hover{background:var(--raised);color:var(--ink)}.lang-option.on{border-color:var(--accent);background:#2ec4b626;color:var(--accent);font-weight:700}.nav-toggle{display:none;width:40px;height:40px;border:1px solid var(--border);border-radius:8px;background:transparent;color:var(--ink);cursor:pointer;align-items:center;justify-content:center;padding:0}.nav-bars,.nav-bars:before,.nav-bars:after{display:block;width:18px;height:2px;background:currentColor;border-radius:1px;position:relative}.nav-bars:before,.nav-bars:after{content:"";position:absolute;inset-inline-start:0}.nav-bars:before{top:-6px}.nav-bars:after{top:6px}.nav-drawer{display:flex;align-items:center;gap:8px}.help-btn{width:36px;height:36px;min-width:36px;min-height:36px;padding:0;border:1px solid var(--border);border-radius:var(--radius);background:var(--raised);color:var(--ink);font-family:var(--sans);font-size:15px;font-weight:600;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.help-btn:hover{border-color:var(--accent);color:var(--accent)}.tb-link{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 12px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--ink);text-decoration:none;font-size:12.5px;box-sizing:border-box}.tb-link:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}.tb-link.gh{gap:0;justify-content:center;width:36px;min-width:36px;height:36px;padding:0}.tb-link .gh-mark{display:block;flex:0 0 18px}.tb-link.support{border-color:color-mix(in srgb,var(--goal) 55%,var(--border));color:#ffe6b0;background:color-mix(in srgb,var(--goal) 14%,var(--panel));font-weight:500}.tb-link.support:hover{background:color-mix(in srgb,var(--goal) 24%,var(--panel));border-color:var(--goal)}@media (max-width: 1080px){.nav-toggle{display:inline-flex}.nav-drawer{display:none;position:absolute;top:calc(100% + 6px);inset-inline-end:0;flex-direction:column;align-items:stretch;gap:6px;min-width:min(240px,calc(100vw - 24px));padding:10px;background:var(--panel);border:1px solid var(--border);border-radius:10px;box-shadow:0 16px 40px #00000080;z-index:55}.nav-drawer.is-open{display:flex}.nav-drawer button,.nav-drawer .tb-link{width:100%;justify-content:flex-start;min-height:40px}}.main{display:grid;grid-template-columns:1fr minmax(420px,520px);min-height:0;overflow:hidden}.side-rail{display:grid;grid-template-rows:1fr 1fr;min-height:0;overflow:hidden;border-left:1px solid var(--border);background:var(--panel)}[dir=rtl] .side-rail{border-left:none;border-right:1px solid var(--border)}.side-rail .panel,.side-rail .goal-panel{min-height:0;height:100%;border-left:none!important;border-right:none!important}.side-rail .panel:last-child{border-top:1px solid var(--border)}.panel{background:var(--panel);min-height:0;display:flex;flex-direction:column;overflow:hidden}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;border-bottom:1px solid var(--border);color:var(--muted);font-family:var(--mono);font-size:11px;text-transform:none;letter-spacing:.04em}.panel-body{flex:1;min-height:0;overflow:auto}.table-card{border-bottom:1px solid var(--border);padding:10px 12px}.table-card h3{margin:0 0 6px;font-family:var(--mono);font-size:12px;font-weight:600;color:var(--accent);display:flex;justify-content:space-between;gap:8px}.table-card h3 em{font-style:normal;color:var(--muted);font-weight:400;font-size:11px}.col-row{display:flex;justify-content:space-between;gap:8px;font-family:var(--mono);font-size:11px;padding:2px 0;color:var(--ink)}.col-row .type{color:var(--muted)}.col-row .pk{color:var(--goal)}.workbench{display:grid;grid-template-rows:auto minmax(120px,.9fr) minmax(140px,1.1fr);min-height:0;background:var(--base)}.pipeline-section{display:flex;flex-direction:column;border-bottom:1px solid var(--border);background:var(--panel)}.pipeline-header{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;border-bottom:1px solid rgba(255,255,255,.04);font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.03em}.pipeline-title{font-weight:600;color:var(--accent)}.pipeline{display:flex;align-items:center;gap:0;padding:8px 12px;overflow-x:auto}.pipe-stage{font-family:var(--mono);font-size:11px;padding:5px 10px;border:1px solid var(--border);border-radius:var(--radius);color:var(--muted);background:var(--raised);white-space:nowrap;transition:all .2s ease}.pipe-stage.active{color:#0b0f14;background:var(--accent);border-color:var(--accent);font-weight:700}.pipe-stage.matched{color:#0b0f14;background:var(--goal);border-color:var(--goal);font-weight:700}.pipe-arrow{color:var(--border);padding:0 6px;font-family:var(--mono);font-size:11px;transition:color .2s ease}.pipe-arrow.active{color:var(--accent);font-weight:700;text-shadow:0 0 8px rgba(46,196,182,.4)}.editor-wrap{display:flex;flex-direction:column;min-height:0;border-bottom:1px solid var(--border)}.editor-toolbar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--border)}.editor-toolbar .hint-text{color:var(--muted);font-family:var(--mono);font-size:11px;margin-left:auto}.sql-editor-container{position:relative;flex:1;min-height:0;width:100%;background:var(--base);overflow:hidden}.sql-editor-textarea,.sql-highlight-overlay{position:absolute;inset:0;width:100%;height:100%;padding:12px 14px;font-family:var(--mono);font-size:13px;line-height:20px;tab-size:2;border:0;margin:0;box-sizing:border-box;white-space:pre-wrap;word-wrap:break-word;overflow:auto}.sql-highlight-overlay{pointer-events:none;background:transparent;color:var(--ink);z-index:1}.sql-editor-textarea{z-index:2;background:transparent;color:transparent;caret-color:var(--accent);resize:none;outline:none}.sql-editor-textarea::selection{background:#2ec4b647;color:transparent}.sql-editor-textarea:focus{outline:none}.sql-tok-keyword{color:#38bdf8;font-weight:600}.sql-tok-function{color:#c084fc;font-weight:600}.sql-tok-table{color:#34d399}.sql-tok-column{color:#f6ad55}.sql-tok-string{color:#e2e8f0;background:#e2e8f014;border-radius:2px}.sql-tok-number{color:#f472b6}.sql-tok-comment{color:#64748b;font-style:italic}.sql-tok-operator,.sql-tok-punctuation{color:#94a3b8}.sql-tok-identifier{color:var(--ink)}.ssms-popup{position:absolute;z-index:50;width:260px;max-height:220px;background:#111827;border:1px solid #374151;border-radius:6px;box-shadow:0 10px 25px -5px #0009,0 8px 10px -6px #0009;display:flex;flex-direction:column;overflow:hidden;font-family:var(--sans);animation:fadeInFast .1s ease-out}@keyframes fadeInFast{0%{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}.ssms-popup-header{display:flex;justify-content:space-between;align-items:center;padding:4px 8px;background:#1f2937;border-bottom:1px solid #374151;font-size:10.5px;color:#9ca3af;font-family:var(--mono)}.ssms-list{flex:1;overflow-y:auto;max-height:180px;padding:2px}.ssms-item{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:4px;cursor:pointer;font-size:12px;color:#e5e7eb}.ssms-item:hover,.ssms-item.active{background:#2563eb;color:#fff}.ssms-icon{width:16px;height:16px;border-radius:3px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10px;font-weight:700;flex-shrink:0;line-height:1}.ssms-icon.table{background:#34d39933;color:#34d399;border:1px solid rgba(52,211,153,.4)}.ssms-icon.column{background:#f6ad5533;color:#f6ad55;border:1px solid rgba(246,173,85,.4)}.ssms-icon.function{background:#c084fc33;color:#c084fc;border:1px solid rgba(192,132,252,.4)}.ssms-icon.keyword{background:#38bdf833;color:#38bdf8;border:1px solid rgba(56,189,248,.4)}.ssms-item.active .ssms-icon{border-color:#fff;color:#fff}.ssms-label{font-family:var(--mono);font-weight:500;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ssms-detail{font-size:10px;color:#9ca3af;margin-left:auto;font-family:var(--mono)}.ssms-item.active .ssms-detail{color:#dbeafe}.result-wrap{display:flex;flex-direction:column;min-height:0;background:var(--panel)}.result-status{padding:6px 12px;font-family:var(--mono);font-size:11px;color:var(--muted);border-bottom:1px solid var(--border);display:flex;gap:12px}.result-status .ok{color:var(--accent)}.result-status .err{color:var(--danger)}.grid-scroll{overflow:auto;flex:1;min-height:0}.data-grid{border-collapse:collapse;width:max-content;min-width:100%;font-family:var(--mono);font-size:12px}.data-grid th,.data-grid td{border-bottom:1px solid var(--border);border-right:1px solid var(--border);padding:6px 10px;text-align:left;white-space:nowrap}.data-grid th{position:sticky;top:0;background:var(--raised);color:var(--muted);font-weight:500;z-index:1}.data-grid td{color:var(--ink)}.data-grid td.null{color:var(--muted);font-style:italic}.data-grid td.match{color:var(--goal)}.data-grid td.miss{color:var(--danger)}.data-grid tr.row-match td{background:#f4a2610f}.empty-state{padding:24px 16px;color:var(--muted);font-family:var(--mono);font-size:12px}.goal-panel.solved{box-shadow:inset 3px 0 0 var(--goal);animation:goalPulse .7s ease}@keyframes goalPulse{0%{box-shadow:inset 3px 0 0 var(--goal),0 0 #f4a26100}40%{box-shadow:inset 3px 0 0 var(--goal),0 0 24px #f4a26159}to{box-shadow:inset 3px 0 0 var(--goal),0 0 #f4a26100}}.goal-body{padding:10px 12px;display:flex;flex-direction:column;gap:10px;height:100%;min-height:0}.goal-body pre{margin:0;padding:10px;background:var(--base);border:1px solid var(--border);border-radius:var(--radius);font-family:var(--mono);font-size:11px;overflow:auto;max-height:40%}.goal-status{font-family:var(--mono);font-size:11px;color:var(--muted)}.goal-status.solved{color:var(--goal)}.goal-status.fail{color:var(--danger)}.modal-backdrop{position:fixed;inset:0;background:#05080cb8;display:flex;align-items:center;justify-content:center;z-index:40;padding:24px}.modal{background:var(--panel);border:1px solid var(--border);border-radius:6px;width:min(680px,100%);max-height:min(88vh,720px);display:flex;flex-direction:column;box-shadow:0 16px 48px #00000073}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border)}.modal-header h2{margin:0;font-size:15px;font-weight:600}.modal-body{padding:14px 16px;overflow:auto}.modal-body h3{margin:0 0 8px;font-size:14px}.modal-body p{margin:0 0 10px;color:var(--ink)}.modal-body code{font-family:var(--mono);font-size:12px;color:var(--accent);background:var(--raised);padding:1px 5px;border-radius:3px}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--border)}.seq-block,.series-block{margin-bottom:16px}.seq-block h3,.series-block h3{color:var(--accent);font-family:var(--mono);font-size:13px;margin-bottom:4px}.seq-block .about,.series-block .about{color:var(--muted);font-size:12px;margin-bottom:8px}.pick-challenge-p{color:var(--muted);font-size:13px;margin-top:0;margin-bottom:12px}.legend-box{border:1px solid var(--border);background:var(--base);border-radius:8px;padding:12px 16px;margin:0 0 16px}.legend-title{font-family:var(--sans);font-weight:700;color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}.legend-list{margin:0;padding-inline-start:18px;display:flex;flex-direction:column;gap:12px;font-size:13px;color:var(--ink);list-style-type:disc}.legend-list li{line-height:1.45}.legend-symbol{display:inline-block;margin-inline-end:8px;vertical-align:middle}.legend-symbol.par-preview{font-family:var(--mono);font-size:12px;color:var(--muted)}.legend-text{vertical-align:middle;color:var(--muted)}.legend-text strong{color:var(--ink);font-weight:600}.diff-dots{display:inline-flex;align-items:center;gap:4px;vertical-align:middle;line-height:1}.diff-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:transparent;border:1px solid #4a5568;box-sizing:border-box;flex:0 0 7px}.diff-dot.on{background:#f59e0b;border-color:#f59e0b}.diff-dots-wrap{display:inline-flex;align-items:center}.level-list{display:grid;gap:6px}.level-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;border:1px solid var(--border);border-radius:8px;padding:10px 14px;background:var(--base);text-align:start;width:100%;transition:border-color .15s ease,background .15s ease}.level-row:hover{border-color:var(--accent);background:var(--raised)}.level-row.current{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.level-row.solved{border-color:#2ec4b68c}.level-row .id{font-family:var(--mono);color:var(--muted);font-size:12px}.level-row .name{font-weight:600;color:var(--ink);font-size:13px}.level-row .par-note{color:var(--muted);font-family:var(--mono);font-size:12px}.level-row .chip{display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;padding:4px 10px;border-radius:12px;background:var(--raised);border:1px solid var(--border);color:var(--ink);line-height:1}.level-row .chip.ok,.legend-symbol .chip.ok{background:#2ec4b61f;border:1px solid var(--accent);border-radius:12px;color:var(--accent);font-weight:500;padding:3px 10px;font-family:var(--mono);font-size:11px;display:inline-flex;align-items:center;line-height:1.2}@media (max-width: 600px){.level-row{grid-template-columns:1fr auto;grid-template-areas:"id dots" "name name" "par par";gap:4px 8px}.level-row .id{grid-area:id}.level-row .name{grid-area:name}.level-row .par-note{grid-area:par}.level-row .chip{grid-area:dots;justify-self:end}}.level-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius);background:var(--base);text-align:left;width:100%}.level-item:hover{border-color:var(--accent)}.level-item.solved{border-color:#f4a26173}.level-item .idx{font-family:var(--mono);color:var(--muted);font-size:11px;width:1.5rem}.level-item .name{flex:1}.level-item .badge{font-family:var(--mono);font-size:10px;color:var(--goal)}@media (max-width: 960px){.main{grid-template-columns:1fr;grid-template-rows:140px 1fr 180px}.panel+.panel{border-left:0;border-top:1px solid var(--border)}.goal-panel{border-left:0}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.welcome-modal{width:min(640px,100%);max-height:min(88vh,720px)}.welcome-body{font-size:14px;line-height:1.55}.welcome-body h1.welcome-title{display:flex;align-items:center;gap:12px;margin:0 0 12px;font-size:28px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}.welcome-logo{width:36px;height:36px;display:block;flex-shrink:0;border-radius:8px}.welcome-h2{margin:18px 0 6px;font-size:15px;font-weight:600;color:var(--ink)}.welcome-body p{margin:0 0 12px}.welcome-list{margin:0 0 12px;padding-left:1.2em}.welcome-list li{margin-bottom:6px}.wd-code{font-family:var(--mono);font-size:12px;color:var(--ink);background:var(--raised);border:1px solid var(--border);border-radius:4px;padding:1px 6px;white-space:nowrap}.welcome-body a{color:var(--accent)}.bmc-btn-container{display:inline-block;margin:6px 0}.bmc-btn{min-width:210px;color:#fff!important;background-color:#2a3a4a!important;height:52px;border-radius:12px;font-size:26px;font-weight:400;border:1px solid rgba(255,255,255,.25);padding:0 22px;line-height:27px;text-decoration:none!important;display:inline-flex!important;align-items:center;font-family:Cookie,cursive!important;-webkit-box-sizing:border-box!important;box-sizing:border-box!important;box-shadow:0 4px 14px #00000059;transition:transform .15s ease,background-color .15s ease,box-shadow .15s ease;direction:ltr!important}.bmc-btn:hover,.bmc-btn:active,.bmc-btn:focus{text-decoration:none!important;cursor:pointer;background-color:#384e63!important;transform:translateY(-2px);box-shadow:0 6px 20px #00000073}.bmc-btn svg{height:32px!important;width:auto!important;margin-bottom:0!important;box-shadow:none!important;border:none!important;vertical-align:middle!important;transform:scale(.9);flex-shrink:0}.bmc-btn-text{text-align:left;margin-left:8px;display:inline-block;line-height:0;width:100%;flex-shrink:0;font-family:Cookie,cursive!important;white-space:nowrap;font-size:26px;color:#fff}.coffee-btn{display:inline-flex;align-items:center;text-decoration:none}.cs-container{background:#0b1320;border:1px solid #23354d;border-radius:8px;padding:12px 14px;margin:12px 0 16px;box-shadow:0 4px 18px #0006;font-family:var(--sans);direction:ltr}.cs-title-bar{display:flex;align-items:center;border-bottom:1px solid #1c2b3e;padding-bottom:8px;margin-bottom:12px;font-size:13px;color:#e2e8f0}.cs-flow{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:6px 0}.cs-table-card{background:#141c27;border:1px solid #233246;border-radius:6px;overflow:hidden;min-width:135px;box-shadow:0 2px 6px #00000040}.cs-table-card.result{border-color:#2ec4b6;background:#101c26;box-shadow:0 0 14px #2ec4b62e}.cs-th-header{background:#233246;color:#f1f5f9;font-weight:600;font-size:11px;padding:5px 8px;text-align:center;border-bottom:1px solid #33465e}.cs-th-header.highlight{background:#173252;color:#38bdf8;border-bottom-color:#2563eb}.cs-th-header.result{background:#0d4a46;color:#2ec4b6;border-bottom-color:#2ec4b6}.cs-row-header{display:flex;justify-content:space-between;padding:3px 8px;background:#00000040;font-size:10px;color:#94a3b8;font-family:var(--mono);border-bottom:1px solid #1f2c3d}.cs-table-rows{display:flex;flex-direction:column}.cs-row{display:flex;align-items:center;gap:8px;padding:4px 8px;font-size:11px;font-family:var(--mono);border-bottom:1px solid rgba(255,255,255,.04)}.cs-row:last-child{border-bottom:none}.cs-row.dropped{opacity:.42;background:#ef444414;text-decoration:line-through}.cs-row.preserved{background:#38bdf817}.cs-row.null-padded{background:#f4a26117}.cs-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 4px;border-radius:3px;font-size:10px;font-weight:700;line-height:1}.cs-badge.cs-null{background:#94a3b81f;border:1px dashed #64748b;color:#94a3b8;font-style:italic;font-size:9px}.cs-drop-flag{margin-left:auto;font-size:9px;color:#ef4444;font-weight:600;text-decoration:none}.cs-keep-flag{margin-left:auto;font-size:9px;color:#38bdf8;font-weight:600}.cs-symbol{font-size:18px;font-weight:700;color:#f4a261;padding:0 2px}.cs-arrow{font-size:18px;font-weight:700;color:#2ec4b6;padding:0 2px}.cs-footer{margin-top:12px;padding-top:9px;border-top:1px solid #1c2b3e;display:flex;gap:10px;align-items:flex-start;font-size:12px;line-height:1.55;color:#cbd5e1;direction:rtl;text-align:right}.cs-rule-icon{font-size:16px;flex-shrink:0}.cs-rule-text code{color:#2ec4b6;background:#182434;padding:1px 5px;border-radius:3px;font-size:11px}.lesson-callout{background:#2ec4b614;border-right:3px solid var(--accent);border-left:none;padding:9px 12px;border-radius:5px 0 0 5px;margin:10px 0;font-size:12.5px;line-height:1.55}.lesson-callout.warning{background:#e76f511a;border-right-color:var(--danger)}.lesson-callout.tip{background:#f4a2611a;border-right-color:var(--goal)}.lesson-list{margin:6px 0 10px;padding-right:20px;padding-left:0}.lesson-list li{margin-bottom:5px;line-height:1.5}.modal-backdrop.is-closing{pointer-events:none;transition:opacity .2s ease;opacity:0}.ui-tour-on{outline:2px dashed var(--goal);outline-offset:3px;border-radius:var(--radius);animation:tour-pulse 1.2s ease-in-out infinite}@keyframes tour-pulse{0%,to{outline-color:color-mix(in srgb,var(--goal) 45%,transparent)}50%{outline-color:var(--accent)}}@media (prefers-reduced-motion: reduce){.ui-tour-on{animation:none}}.ui-help-intro{margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.5}.ui-help-item{border:1px solid var(--border);background:var(--raised);border-radius:var(--radius);padding:10px 12px;margin-bottom:10px}.ui-help-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.ui-help-head h3{margin:0;font-size:13.5px;font-weight:600;color:var(--accent)}.ui-help-focus{font-size:11px;padding:4px 8px;min-height:28px;white-space:nowrap}.ui-help-what p,.ui-help-how p{margin:0;font-size:12.5px;line-height:1.5}.ui-help-what{color:var(--ink)}.ui-help-how{margin-top:4px;color:var(--muted)}.ui-help-how strong{color:var(--goal)}.confetti-canvas{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:999}.overlay-celebrate{background:#060a0ed6;backdrop-filter:blur(3px)}.modal-celebrate{width:min(500px,92vw);text-align:center;border-color:color-mix(in srgb,var(--accent) 45%,var(--border));box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 25%,transparent),0 24px 80px #2ec4b629,0 20px 60px #0009;animation:celebrate-pop .42s cubic-bezier(.2,.9,.25,1.2);padding:20px}.celebrate{text-align:center;padding:4px 2px 2px}.celebrate-visual{position:relative;width:84px;height:84px;margin:0 auto 10px;display:grid;place-items:center}.celebrate-ring{position:absolute;inset:0;border-radius:50%;border:2px solid color-mix(in srgb,var(--accent) 55%,transparent);background:radial-gradient(circle,color-mix(in srgb,var(--accent) 25%,transparent),transparent 70%);animation:ring-pulse 1.8s ease-out infinite}.celebrate-star{position:relative;font-size:40px;line-height:1;color:var(--goal);text-shadow:0 0 18px color-mix(in srgb,var(--goal) 65%,transparent);animation:star-bounce .7s cubic-bezier(.2,.9,.3,1.4)}.celebrate-badge{display:inline-block;font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:.14em;color:#062016;background:linear-gradient(135deg,var(--accent),var(--goal));border-radius:999px;padding:5px 14px;margin-bottom:10px;box-shadow:0 2px 10px #2ec4b64d}.celebrate-title{margin:0 0 4px;font-size:22px;font-weight:700;color:var(--ink)}.celebrate-sub{margin:0 0 10px;color:var(--muted);font-family:var(--mono);font-size:12px}.celebrate-sub code{color:var(--accent);background:var(--raised);padding:2px 6px;border-radius:4px;border:1px solid var(--border)}.celebrate-cheer{margin:0 0 14px;color:var(--ink);font-size:14.5px}.celebrate-stats{margin:0 auto 12px;max-width:420px;border:1px solid var(--border);background:var(--raised);border-radius:8px;padding:9px 12px;font-size:12.5px;color:var(--goal)}.celebrate-progress{margin:0 auto 14px;max-width:320px}.prog-track{height:8px;border-radius:999px;background:var(--raised);border:1px solid var(--border);overflow:hidden;margin-bottom:6px}.prog-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--goal));border-radius:inherit;transition:width .6s ease}.share-block{border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border));background:color-mix(in srgb,var(--accent) 8%,var(--panel));border-radius:10px;padding:12px;margin-bottom:12px;text-align:center}.share-title-text{font-size:12px;font-weight:600;color:var(--ink);margin-bottom:8px}.share-row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.share-btn{min-height:34px;border-radius:6px;font-weight:600;font-size:12px;border:1px solid var(--border);cursor:pointer;padding:6px 12px;transition:all .15s ease}.share-btn:hover{filter:brightness(1.1);transform:translateY(-1px)}.share-btn.linkedin{background:#0a66c2;border-color:#0a66c2;color:#fff}.share-btn.x{background:#111;border-color:#333;color:#fff}.share-btn.facebook{background:#1877f2;border-color:#1877f2;color:#fff}.share-btn.copy{background:var(--raised);color:var(--ink)}.share-status{margin-top:8px;color:var(--accent);font-family:var(--mono);font-size:11.5px;font-weight:600}.celebrate-next{color:var(--muted);font-size:12.5px;margin-top:4px}.celebrate-footer{display:flex;justify-content:space-between;gap:12px;padding-top:14px}@keyframes celebrate-pop{0%{opacity:0;transform:scale(.88) translateY(18px)}to{opacity:1;transform:none}}@keyframes ring-pulse{0%{transform:scale(.85);opacity:.9}70%{transform:scale(1.18);opacity:.2}to{transform:scale(1.22);opacity:0}}@keyframes star-bounce{0%{transform:scale(.3) rotate(-20deg);opacity:0}60%{transform:scale(1.15) rotate(6deg)}to{transform:scale(1) rotate(0);opacity:1}}
