:root{--navy:#12233c;--navy-2:#1a3552;--ink:#182941;--muted:#75859a;--paper:#f4f7fb;--white:#fff;--teal:#16ad9b;--mint:#d8f7ed;--gold:#eab66b;--line:#e7edf4;--red:#cb5f61;--shadow:0 14px 42px rgba(23,47,76,.06);--radius:22px}
*{box-sizing:border-box}html{font-size:16px;-webkit-text-size-adjust:100%}body{margin:0;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;color:var(--ink);background:var(--paper);-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #67cabb;outline-offset:3px}a{text-decoration:none;color:inherit}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(1.75rem,5vw,2.4rem);letter-spacing:-.045em;line-height:1.13}h2{font-size:1.15rem;letter-spacing:-.02em}small{font-size:.77rem}
.topbar{background:var(--navy);color:white;padding:0 20px}.topbar-inner{max-width:990px;margin:auto;min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:11px}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;color:var(--navy);background:linear-gradient(145deg,#d7fcef,#5ee0cd);font-size:26px;box-shadow:0 5px 20px rgba(20,181,152,.16)}.brand strong{display:block;line-height:1.1;font-size:1.15rem;letter-spacing:.11em}.brand small{display:block;color:#a9bacb;letter-spacing:.11em;font-size:.55rem;padding-top:4px}.header-pill{display:flex;align-items:center;gap:8px;border:1px solid #39516a;border-radius:99px;padding:9px 11px;font-size:.70rem;color:#d3e9e6;white-space:nowrap}.pulse{display:inline-block;width:6px;height:6px;border-radius:50%;background:#66e2c8}
.page{max-width:990px;margin:0 auto;padding:27px 20px 118px;min-height:calc(100svh - 80px)}.eyebrow{font-size:.70rem;letter-spacing:.15em;font-weight:800;text-transform:uppercase;color:var(--teal);margin-bottom:9px}.muted{color:var(--muted)}.intro{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px}.intro h1{margin-bottom:8px}.intro p{color:var(--muted);font-size:.93rem;line-height:1.55;margin:0}.hello-graphic{font-size:52px;opacity:.67;line-height:1;transform:rotate(-13deg)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}.stat{background:white;padding:16px 14px;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.stat .value{font-size:clamp(1.27rem,4.2vw,1.75rem);font-weight:840;letter-spacing:-.04em;display:block;font-variant-numeric:tabular-nums}.stat .name{color:var(--muted);font-size:.75rem;display:block;margin-top:4px}.stat .symbol{color:var(--teal);font-weight:800;font-size:.85rem;margin-right:4px}
.daily{display:flex;justify-content:space-between;align-items:center;gap:12px;border-radius:var(--radius);background:linear-gradient(120deg,var(--navy),var(--navy-2));padding:21px 22px;color:white;margin-bottom:20px;overflow:hidden;position:relative}.daily:after{content:'✧';position:absolute;right:7%;bottom:-62px;color:rgba(255,255,255,.055);font-size:195px;pointer-events:none}.daily .daily-desc{position:relative;z-index:1}.daily .eyebrow{color:#76e8d3;margin-bottom:6px}.daily h2{font-size:1.1rem;margin-bottom:5px}.daily p{font-size:.79rem;color:#c5d4e2;line-height:1.5;margin:0}.daily .btn{position:relative;z-index:1;white-space:nowrap}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.setup{padding:23px;margin-bottom:18px}.setup-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:17px}.setup h2{margin:0}.tag{font-size:.69rem;color:var(--teal);font-weight:800;letter-spacing:.07em;background:#e8f9f5;padding:7px 11px;border-radius:99px;text-transform:uppercase}.levels{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:17px}.level{border:1.5px solid #e3e9f0;border-radius:15px;background:white;padding:15px 5px;text-align:center;min-height:81px}.level strong{display:block;font-size:.95rem;margin-bottom:5px}.level span{color:var(--muted);font-size:.70rem}.level.selected{background:#eafaf5;border-color:var(--teal);box-shadow:0 0 0 2px rgba(22,173,155,.06)}.level:active,.btn:active,.key:active{transform:scale(.98)}
.btn{border:0;border-radius:13px;min-height:44px;padding:12px 17px;font-weight:800;font-size:.87rem;display:inline-flex;align-items:center;justify-content:center;gap:7px}.btn.primary{background:var(--teal);color:white}.btn.primary:hover{background:#109786}.btn.secondary{background:#eaf0f6;color:var(--ink)}.btn.white{color:var(--navy);background:white}.btn.outline{color:var(--navy);background:transparent;border:1px solid #d7e2e9}.btn.danger{color:#a93f46;background:#fff1f1}.btn.full{width:100%}.btn.sm{min-height:38px;padding:9px 12px;font-size:.78rem}.flex-buttons{display:flex;gap:10px;flex-wrap:wrap}.text-action{background:none;color:var(--teal);border:0;font-weight:800;padding:8px 0;font-size:.82rem}.tip{padding:17px 19px;border-radius:17px;background:#eaf1f6;color:#54687b;display:flex;gap:10px;font-size:.81rem;line-height:1.55;margin-bottom:16px}.tip b{color:var(--navy)}.credit{text-align:center;color:#a0adba;font-size:.72rem;margin:20px 0 0}
.play-intro{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:17px}.compact-play{align-items:center;margin-bottom:10px}.compact-play .eyebrow{margin:0}.play-intro h1{margin:0 0 6px}.play-intro p{color:var(--muted);font-size:.84rem;margin:0;line-height:1.45}.small-link{color:var(--teal);background:transparent;border:0;font-weight:800;font-size:.83rem;padding:8px 0;white-space:nowrap}.puzzle-card{padding:22px;margin-bottom:16px}.meta-row{display:flex;justify-content:space-between;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:15px}.meta-row .left{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.meta-tag{border-radius:99px;font-size:.69rem;font-weight:800;letter-spacing:.03em;padding:7px 10px;background:#f0f5f8;color:#647a8c}.meta-tag.medium{background:#e7f9f4;color:#168d7f}.meta-tag.hard{background:#fff3e2;color:#a2722f}.meta-tag.daily-tag{background:#f2eafd;color:#8264aa}
.clue-label{font-size:.71rem;letter-spacing:.11em;font-weight:800;text-transform:uppercase;color:#8798a7;margin:6px 0 10px}.clue{font-size:clamp(1.34rem,4.6vw,1.95rem);font-weight:760;line-height:1.37;letter-spacing:-.035em;color:var(--navy);margin:0 0 15px}.clue-note{font-size:.79rem;line-height:1.5;color:var(--muted);margin-bottom:18px}.answer-row{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin:0 0 19px;user-select:none}.answer-cell{width:min(9%,42px);min-width:27px;height:53px;display:flex;justify-content:center;align-items:center;color:var(--navy);background:#f4f8fa;border:1.5px solid #e0eaf0;border-bottom:3px solid #cbd9e2;border-radius:10px;font-size:1.28rem;font-weight:850;line-height:1;flex:none}.answer-cell.active{border-color:var(--teal);background:#e8fcf5;border-bottom:3px solid #13ad95;box-shadow:0 0 0 2px rgba(22,173,155,.08)}.answer-cell.revealed{background:#ddf8eb;color:#168e73;border-bottom-color:#92daba}.answer-cell.bad{background:#fff0f0;border-color:#d77077}.answer-cell.spacer{width:11px;min-width:11px;background:transparent;border:0}.mistakes{font-size:.81rem;color:#7c8ea0;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center;gap:5px}.dots{font-size:1.09rem;letter-spacing:.07em;color:#d3dde5}.dots .dot-used{color:#d56e70}.keyboard{display:flex;flex-direction:column;gap:7px;margin:12px auto 16px;max-width:560px}.key-row{display:flex;justify-content:center;gap:5px}.key{flex:1;min-width:0;max-width:55px;height:46px;border:1px solid #e4ebf1;border-bottom:2px solid #cad5df;background:#f3f6f9;color:#253b50;border-radius:8px;font-size:.94rem;font-weight:750;display:grid;place-items:center}.key.del{background:#e7edf4;max-width:65px}.key.submit{max-width:65px;background:#e0f7ef;color:#148e7d}.key.used{background:#eaf9f4;color:#168e81}.key:active{background:#d7f5ed}.input-help{font-size:.73rem;text-align:center;color:#8da0af;margin:0 0 15px}.action-row{display:flex;gap:9px;flex-wrap:wrap}.action-row .btn{flex:1 1 96px;min-width:0;white-space:nowrap}.hint-box{background:#f2faf8;border:1px solid #d8f0e8;border-radius:14px;padding:14px 15px;margin-bottom:16px;font-size:.81rem;line-height:1.5;color:#315c55}.hint-box h3{font-size:.84rem;margin:0 0 8px;color:#167f70}.hint-box p{margin:0 0 7px}.hint-box p:last-child{margin:0}.feedback{padding:11px 13px;background:#fff2f2;border:1px solid #f1dcdc;border-radius:12px;color:#a74953;font-size:.81rem;margin-bottom:15px}.under-note{text-align:center;color:#8da0af;font-size:.71rem;margin:15px 0 5px;line-height:1.5}
.end-card{text-align:center;padding:29px 24px;margin-bottom:16px}.end-icon{font-size:3rem;line-height:1.2;margin-bottom:10px}.end-card h2{font-size:1.65rem;margin-bottom:7px}.end-card>p{font-size:.85rem;color:var(--muted);line-height:1.5}.score-big{color:var(--teal);font-size:2.8rem;font-weight:850;letter-spacing:-.055em;margin:15px 0 0}.score-label{font-size:.68rem;letter-spacing:.15em;font-weight:800;color:#8a9cad}.answer-display{font-size:1.7rem;font-weight:880;color:var(--navy);letter-spacing:.11em;margin:15px 0 17px}.explanation{background:#f2f7f9;border-radius:15px;padding:16px;text-align:left;line-height:1.58;font-size:.85rem;margin:18px 0}.explanation b{color:#148b7b}.end-card .flex-buttons{justify-content:center}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.section-title h1{margin:0 0 8px}.section-title p{margin-bottom:0}.history-list{display:grid;gap:11px}.history{padding:16px;display:flex;justify-content:space-between;gap:12px;align-items:center}.history .date{display:block;color:#9aaab7;font-size:.71rem;margin-bottom:6px}.history .phrase{font-size:.95rem;font-weight:720;line-height:1.4;margin:0 0 6px}.history .status{font-size:.74rem;color:var(--muted)}.history .score{text-align:right;color:var(--teal);font-weight:860;white-space:nowrap}.history .score.bad{color:var(--muted)}.history .score small{display:block;font-size:.64rem;color:var(--muted)}.empty{text-align:center;padding:35px 23px}.empty-icon{font-size:2.8rem;margin-bottom:12px;color:#78b9b1}.empty h2{margin:0 0 8px}.empty p{color:var(--muted);line-height:1.55;font-size:.85rem}.profile-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;margin-bottom:17px}.profile-box{padding:20px}.profile-box .big-val{font-size:1.85rem;font-weight:860;color:var(--navy)}.profile-box .descr{font-size:.77rem;color:var(--muted);margin-top:5px}.settings,.lesson{padding:23px;margin-bottom:17px}.settings h2,.lesson h2{margin:0 0 9px}.settings p,.lesson p,.lesson li{color:#657a8e;font-size:.85rem;line-height:1.65}.settings p{margin-bottom:12px}.label{font-size:.77rem;font-weight:800;display:block;margin-bottom:7px}.name-row{display:flex;gap:10px;margin-bottom:23px}.name-input{flex:1;min-width:0;padding:12px 13px;border-radius:12px;border:1px solid #dce6ef;background:#fbfdff}.line{border-top:1px solid var(--line);margin:23px 0}.install-steps{margin:0 0 10px;padding-left:20px}.lesson .example{padding:13px 15px;border-radius:13px;background:#f1f8f8;color:var(--ink);font-size:.91rem;font-weight:750;margin:10px 0}.lesson .small{color:#8396a5;font-size:.75rem}.lesson .answer{color:#118d7d;font-weight:800}.lesson ul{padding-left:20px}
.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:20;display:flex;justify-content:center;background:#fff;border-top:1px solid #e8eff5;box-shadow:0 -7px 29px rgba(17,44,67,.04);padding:7px max(10px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.nav-btn{min-width:0;max-width:190px;flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:7px 5px;background:transparent;border:0;color:#97a9b7;font-size:.72rem;font-weight:700;border-radius:12px}.nav-btn.active{color:var(--teal);background:#eafaf4}.nav-icon{font-size:1.2rem;line-height:1.1}.toast{position:fixed;z-index:40;left:50%;bottom:calc(89px + env(safe-area-inset-bottom));transform:translate(-50%,18px);opacity:0;pointer-events:none;transition:all .19s ease;border-radius:13px;background:#1e354d;color:white;padding:12px 17px;max-width:min(94vw,520px);width:max-content;box-shadow:0 14px 35px #132e4e38;text-align:center;font-size:.83rem;line-height:1.3}.toast.visible{opacity:1;transform:translate(-50%,0)}
@media(max-width:420px){.topbar{padding:0 16px}.topbar-inner{min-height:72px}.brand-mark{width:39px;height:39px}.brand strong{font-size:1.03rem}.brand small{font-size:.48rem}.header-pill{font-size:.63rem;padding:8px 9px}.page{padding:20px 14px 112px}.intro h1{font-size:1.75rem}.stats{gap:7px}.stat{padding:13px 10px}.daily{padding:17px 15px}.daily .btn{font-size:.76rem;padding:9px}.puzzle-card{padding:16px 13px}.clue{font-size:1.47rem}.answer-cell{height:47px;width:calc((100% - 10 * 5px)/10);max-width:36px;min-width:23px;border-radius:7px;font-size:1.08rem}.key{height:45px;font-size:.87rem;border-radius:6px}.key-row{gap:4px}.action-row .btn{font-size:.78rem;padding:10px 8px}.nav-btn{font-size:.67rem}.tag{font-size:.61rem}}
@media(max-width:350px){.header-pill{display:none}.answer-cell{min-width:22px}.clue{font-size:1.30rem}.key-row{gap:3px}.key{font-size:.81rem}.nav-btn{font-size:.63rem}}
@media(min-width:750px){.page{padding-top:35px}.setup{max-width:730px;margin-left:auto;margin-right:auto}.daily{max-width:730px;margin-left:auto;margin-right:auto}.intro,.stats{max-width:730px;margin-left:auto;margin-right:auto}.puzzle-card,.end-card{max-width:730px;margin-left:auto;margin-right:auto}.tip{max-width:730px;margin-left:auto;margin-right:auto}.answer-cell{width:43px}.bottom-nav{left:50%;width:min(620px,100%);transform:translateX(-50%);border:1px solid var(--line);border-radius:18px 18px 0 0}}

/* Pistas progresivas sin filtración de la solución */
.clue-mark{color:inherit;border-radius:5px;box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 3px;font-weight:850;}
.clue-mark.mark-1{background:#d9ecff;box-shadow:0 0 0 1px #9ac4ec}.clue-mark.mark-2{background:#ffedc0;box-shadow:0 0 0 1px #deb45e}.clue-mark.mark-3{background:#d3f4e0;box-shadow:0 0 0 1px #8ecfac}
.def-legend{color:#3274b8}.ind-legend{color:#a56c0b}.mat-legend{color:#208054}
.btn:disabled{opacity:.5;cursor:not-allowed}.hint-box strong{font-weight:850}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
