:root{--bg: #f8f6ef;--card: #ffffff;--ink: #342421;--text: #6f5651;--text-muted: #9b726c;--border: #e7dacf;--border-soft: #f4dfdc;--hover-bg: #fff4f0;--btn-dark: #3d302c;--green: #559c68;--focus: #67c5bf;--accent: #E8A888;--shadow: 0 12px 28px rgba(78,64,55,.1);--shadow-sm: 0 4px 10px rgba(78,64,55,.12);--radius-lg: 1.7rem;--radius-md: 1.15rem}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:SF Pro Rounded,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}.shell{max-width:1500px;margin:0 auto;flex:1;display:grid;grid-template-columns:1fr;gap:0;padding:1.5rem 1rem 3rem}@media(min-width:1536px){.shell{grid-template-columns:300px minmax(0,1fr) 300px;gap:1.5rem;padding:2rem}}.main{max-width:72rem;width:100%;margin:0 auto}.site-header{position:sticky;top:0;z-index:30;border-bottom:1px solid var(--border-soft);background:#ffffffeb;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.header-inner{max-width:80rem;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:4rem;padding:0 1rem}.brand{display:flex;align-items:center;gap:.75rem}.brand-logo{width:2.25rem;height:2.25rem;border-radius:.5rem;box-shadow:var(--shadow-sm);display:grid;place-items:center;font-size:1.4rem;overflow:hidden}.brand-logo img{width:100%;height:100%;object-fit:cover}.brand-name{line-height:1.1}.brand-name .big{font-weight:900;color:var(--ink);font-size:1.05rem;display:block}.brand-name .small{font-weight:600;color:var(--text-muted);font-size:.75rem}.nav{display:flex;align-items:center;gap:.25rem}.nav a{border-radius:.375rem;padding:.5rem .75rem;font-size:.875rem;font-weight:700;color:var(--text)}.nav a:hover{background:var(--hover-bg);color:var(--ink)}.nav .hamburger{display:none;font-size:1.4rem;padding:.5rem;cursor:pointer;background:none;border:none;color:var(--text)}@media(max-width:768px){.nav a:not(.hamburger){display:none}.nav .hamburger{display:block}}.card{background:var(--card);border-radius:var(--radius-lg);box-shadow:var(--shadow),inset 0 0 0 1px var(--border);padding:1.5rem}.section{margin-top:2.5rem}.section-title{font-size:1.5rem;font-weight:800;color:var(--ink);margin-bottom:1rem}.section-title .accent{color:var(--green)}.game-card{padding:0;overflow:hidden}.game-topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.75rem;padding:1rem 1.25rem;border-bottom:1px solid var(--border-soft);width:100%}@media(max-width:640px){.game-topbar{grid-template-columns:1fr;gap:.5rem;text-align:center}.game-topbar>:first-child{justify-self:center}.game-topbar>:last-child{justify-self:center}}.level-badge{display:inline-flex;align-items:center;gap:.4rem;background:var(--card);border:1px solid var(--border);border-radius:999px;padding:.3rem .8rem;font-weight:700;color:var(--ink);font-size:.85rem;box-shadow:var(--shadow-sm)}.level-badge .count{color:var(--green)}.game-center-info{display:flex;flex-direction:column;align-items:center;gap:.4rem}.level-title{font-size:1.25rem;font-weight:900;color:var(--ink);text-align:center}@media(min-width:640px){.level-title{font-size:1.875rem}}.health-display{display:flex;gap:.3rem;font-size:1.5rem}.heart{transition:all .3s ease;filter:drop-shadow(0 2px 4px rgba(200,168,232,.3))}.heart svg{width:24px;height:24px}.heart.lost{filter:grayscale(1) opacity(.4);transform:scale(.8)}.progress{text-align:center;font-size:.85rem;color:var(--text-muted);min-height:1.4rem}.game-actions{display:flex;gap:.5rem}.icon-btn{position:relative;width:2.4rem;height:2.4rem;border-radius:999px;background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow-sm);cursor:pointer;display:grid;place-items:center;font-size:1rem;transition:transform .15s ease;color:var(--text)}.icon-btn:hover{transform:translateY(-2px);color:var(--ink)}.icon-btn .tip{position:absolute;top:100%;margin-top:.5rem;left:50%;transform:translate(-50%);white-space:nowrap;background:var(--btn-dark);color:#fff;font-size:.72rem;padding:.2rem .6rem;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .15s}.icon-btn:hover .tip{opacity:1}.game-stage{display:flex;justify-content:center;padding:1rem;background:linear-gradient(135deg,#fdfbf7,#f6f1e9)}.grid-wrapper{display:flex;justify-content:center}.puzzle-grid{display:inline-grid;gap:3px;background:linear-gradient(145deg,#e8ddd8,#d8c8c0);padding:6px;border-radius:16px;box-shadow:0 8px 32px #7b6b8a26,0 2px 8px #7b6b8a1a}.cell{display:flex;align-items:center;justify-content:center;border-radius:10px;user-select:none;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.cell:hover{transform:scale(1.05);box-shadow:0 4px 12px #7b6b8a33}.cell-black{background:linear-gradient(145deg,#8b7b9a,#6b5b7a);cursor:default;box-shadow:inset 0 3px 6px #0000004d,0 2px 4px #7b6b8a33}.cell-number{font-weight:800;color:#f0e8ff;text-shadow:0 1px 2px rgba(0,0,0,.3)}.cell-lit,.cell-cat{background:linear-gradient(145deg,#fff8f0,#fff0e0);box-shadow:inset 0 0 8px #fff8f080}.cell-x{background:#fafafa;box-shadow:inset 0 0 4px #0000000d}.cell-dark{background:linear-gradient(145deg,#f0ebe5,#e8e0d8);box-shadow:inset 0 2px 4px #00000014}@keyframes hint-pulse{0%,to{box-shadow:inset 0 0 0 3px #e8a888}50%{box-shadow:inset 0 0 0 3px #e8a888,0 0 16px #e8a88880}}.cell-hint{animation:hint-pulse .8s ease-in-out infinite}@keyframes cat-place{0%{transform:scale(0) rotate(-10deg);opacity:0}50%{transform:scale(1.2) rotate(5deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}.cell-cat-new{animation:cat-place .4s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes flash-red{0%,to{box-shadow:none}50%{box-shadow:inset 0 0 0 3px #e74c3c,0 0 8px #e74c3c66}}.cell-violation{animation:flash-red .5s ease}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-3px)}40%,80%{transform:translate(3px)}}.cell-shake{animation:shake .4s ease}.difficulty-badge{display:inline-block;padding:2px 10px;border-radius:12px;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;margin-left:6px;vertical-align:middle}.badge-tutorial,.badge-easy{background:#e8f5e9;color:#2e7d32}.badge-medium{background:#fff3e0;color:#e65100}.badge-medium-hard{background:#ffe0b2;color:#bf360c}.badge-hard{background:#ffcdd2;color:#c62828}.badge-expert{background:#f3e5f5;color:#6a1b9a}.toast{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#e74c3c;color:#fff;padding:.6rem 1.2rem;border-radius:12px;font-size:.9rem;font-weight:600;z-index:1000;opacity:0;transition:opacity .3s;pointer-events:none}.toast.show{opacity:1}.toast.success{background:var(--green)}.win-overlay{position:fixed;inset:0;background:#f8f6eff2;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:999;opacity:0;transition:opacity .4s;pointer-events:none;overflow:hidden}.win-overlay.show{opacity:1;pointer-events:auto}.win-cat{animation:cat-pop .8s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes cat-pop{0%{transform:scale(0) rotate(-10deg)}50%{transform:scale(1.3) rotate(5deg)}to{transform:scale(1) rotate(0)}}.win-glow{position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(200,168,232,.3) 0%,transparent 70%);animation:glow-pulse 2s ease-in-out infinite}@keyframes glow-pulse{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.3);opacity:1}}.win-text{font-size:2rem;font-weight:800;color:var(--ink);margin-top:1.5rem;animation:text-pop .6s .3s cubic-bezier(.34,1.56,.64,1) both}@keyframes text-pop{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.win-sub{font-size:1.1rem;color:var(--text);margin-top:.5rem;animation:fade-up .5s .5s ease both}@keyframes fade-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.win-btn{margin-top:1.5rem;padding:.7rem 2rem;background:var(--accent);color:#fff;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;font-family:inherit}.win-btn:hover{background:#d09070}.win-share-row{display:flex;gap:.5rem;margin-top:.8rem;flex-wrap:wrap;justify-content:center}.share-btn{padding:.5rem 1rem;border:none;border-radius:10px;cursor:pointer;font-size:.85rem;font-weight:600;font-family:inherit;transition:transform .1s}.share-btn:active{transform:scale(.95)}.share-copy{background:#f0e8ff;color:#7b6b8a}.share-copy:hover{background:#e0d0f0}.share-twitter{background:#1da1f2;color:#fff}.share-twitter:hover{background:#0d8ddb}.share-reddit{background:#ff4500;color:#fff}.share-reddit:hover{background:#e03e00}.confetti{position:absolute;width:12px;height:12px;border-radius:3px;animation:confetti-fall linear forwards}@keyframes confetti-fall{0%{transform:translateY(-100vh) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.paw-confetti{position:absolute;font-size:24px;animation:paw-fall linear forwards}@keyframes paw-fall{0%{transform:translateY(-100vh) rotate(0) scale(1);opacity:.8}to{transform:translateY(100vh) rotate(360deg) scale(.5);opacity:0}}.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.25rem}.video-card{border:1px solid var(--border);border-radius:1rem;overflow:hidden;background:var(--card);transition:transform .15s ease;display:block}.video-card:hover{transform:translateY(-3px);box-shadow:0 18px 45px #4226201f}.video-card .thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--hover-bg)}.video-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.video-card:hover .thumb img{transform:scale(1.05)}.video-card .thumb .level-tag{position:absolute;left:.75rem;top:.75rem;border-radius:.375rem;background:var(--accent);padding:.25rem .5rem;font-size:.75rem;font-weight:900;color:#fff}.video-card .meta{padding:.75rem .9rem}.video-card .meta h3{font-weight:700;color:var(--ink);font-size:.9rem}.video-card .meta small{display:block;color:var(--text-muted);font-weight:500;font-size:.78rem;margin-top:.25rem}.tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.tip-card{display:block;border-radius:.5rem;border:1px solid var(--border);background:var(--card);padding:1.25rem;box-shadow:0 1px 3px #0000000a;transition:all .15s;text-decoration:none;color:inherit}.tip-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #4226201a}.tip-card .tip-icon{font-size:1.5rem;margin-bottom:.5rem}.tip-card h3{font-size:.95rem;font-weight:900;color:var(--ink)}.tip-card p{margin-top:.375rem;font-size:.85rem;line-height:1.6;color:var(--text)}.featured-tip{margin-top:2rem;padding:1.5rem;border-radius:1rem;background:linear-gradient(135deg,#fffaf8,#fff4f0);border:1px solid var(--border)}.featured-tip-label{font-size:.8rem;font-weight:900;color:var(--accent);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.featured-tip h3{font-size:1.15rem;font-weight:900;color:var(--ink);margin-bottom:.5rem}.featured-tip p{font-size:.95rem;line-height:1.7;color:var(--text);margin-bottom:.75rem}.featured-tip-link{font-size:.9rem;font-weight:900;color:var(--accent);text-decoration:none}.featured-tip-link:hover{text-decoration:underline}.strategy-list{margin-top:2rem}.strategy-list-title{font-size:1rem;font-weight:900;color:var(--ink);margin-bottom:.75rem}.strategy-item{display:block;padding:.75rem 0;border-bottom:1px solid var(--border-soft);text-decoration:none;color:inherit;transition:background .15s}.strategy-item:last-child{border-bottom:none}.strategy-item:hover{background:var(--hover-bg);margin:0 -.5rem;padding-left:.5rem;padding-right:.5rem;border-radius:.5rem}.strategy-item strong{display:block;font-size:.95rem;font-weight:700;color:var(--ink)}.strategy-item span{font-size:.85rem;color:var(--text-muted)}.strategy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.75rem}.strategy-grid-item{display:block;padding:1rem;border-radius:.75rem;border:1px solid var(--border);background:var(--card);text-decoration:none;color:inherit;transition:all .15s}.strategy-grid-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #4e40371a;border-color:var(--accent)}.strategy-grid-item strong{display:block;font-size:.9rem;font-weight:900;color:var(--ink);margin-bottom:.25rem}.strategy-grid-item span{font-size:.8rem;color:var(--text-muted);line-height:1.4}.download-box{display:flex;flex-wrap:wrap;align-items:center;gap:2rem;padding:2rem}.download-phone{flex-shrink:0}.download-phone img{width:200px;height:auto;border-radius:16px;box-shadow:0 8px 24px #00000026}.download-text{flex:1;min-width:200px}.download-buttons{display:flex;flex-wrap:wrap;gap:.75rem}.store-btn{display:inline-flex;align-items:center;gap:.6rem;background:var(--btn-dark);color:#fff;font-weight:700;border-radius:.75rem;padding:.7rem 1.4rem;transition:transform .15s ease}.store-btn:hover{transform:translateY(-2px)}.prose h2{font-size:1.35rem;font-weight:800;color:var(--ink);margin:2rem 0 1rem;padding-bottom:.5rem;border-bottom:2px solid var(--border-soft)}.prose h3{font-size:1.15rem;font-weight:700;color:var(--ink);margin:1.5rem 0 .75rem}.prose p{margin-bottom:1rem;font-size:1rem}.prose ul,.prose ol{margin:0 0 1rem 1.5rem}.prose li{margin-bottom:.5rem}.prose strong{color:var(--ink)}.prose a{color:var(--accent);text-decoration:underline;font-weight:600}.prose a:hover{color:#d09070}details.faq-item{border:1px solid var(--border);border-radius:1rem;margin-bottom:.75rem;background:var(--card);overflow:hidden}details.faq-item summary{cursor:pointer;padding:1rem 1.25rem;font-weight:700;color:var(--ink);list-style:none;display:flex;justify-content:space-between;align-items:center}details.faq-item summary:after{content:"+";font-size:1.4rem;color:var(--text-muted);transition:transform .2s ease}details.faq-item[open] summary:after{transform:rotate(45deg)}details.faq-item .faq-answer{padding:0 1.25rem 1.25rem;color:var(--text);line-height:1.75}.site-footer{margin-top:3rem;padding:2rem 1rem;text-align:center;border-top:1px solid var(--border-soft);color:var(--text-muted);font-size:.875rem}.site-footer a{color:var(--ink);font-weight:600}.site-footer a:hover{color:var(--green)}.ad-slot{background:var(--card);border-radius:var(--radius-lg);box-shadow:var(--shadow),inset 0 0 0 1px var(--border);min-height:600px;display:none}@media(min-width:1536px){.ad-slot{display:block}}@media(max-width:480px){.level-title{font-size:1.1rem}.icon-btn{width:2rem;height:2rem;font-size:.85rem}.game-card{border-radius:1.2rem}}
