.header{display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.75rem;background:#0c1218c2;border:1px solid rgba(255,255,255,.1);border-radius:8px;margin-bottom:.75rem;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.header__profile{display:flex;align-items:center;gap:.5rem;min-width:0}.header__avatar{width:40px;height:40px;border-radius:50%;object-fit:cover}.header__title{font-size:1rem;font-weight:600;line-height:1.2}.header__subtitle{font-size:.75rem;color:#b8d8d6}.header__progress{flex:0 0 auto;min-width:74px;padding:.42rem .65rem;border-radius:8px;background:#ffffff1a;border:1px solid rgba(255,255,255,.16);color:#fff7d6;font-size:.95rem;font-weight:700;text-align:center;white-space:nowrap}@media (max-width: 360px){.header{align-items:flex-start;flex-direction:column}.header__progress{width:100%}}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem;padding:.9rem .25rem;background:transparent;border-radius:8px}.grid__item{position:relative;border:2px solid rgba(255,255,255,.72);border-radius:50%;padding:0;width:clamp(58px,18vw,72px);height:clamp(58px,18vw,72px);margin:0 auto;font-weight:700;color:#18212b;background:#f3f6f7;box-shadow:0 10px 22px #00000047,inset 0 -2px #00000014;transition:transform .1s,box-shadow .1s;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.1rem}.grid__item:active{transform:scale(.98);box-shadow:0 5px 12px #00000047,inset 0 -1px #00000014}.grid__item--open{background:#f7fbff;border-color:#d3eef0}.grid__item--solved{background:#ffd34d;border-color:#fff2ad;color:#2a220f}.grid__item--locked{background:#26313d;color:#b7c4cf;border-color:#6f7e8d;opacity:.8}.grid__star,.grid__lock{position:absolute;bottom:-4px;right:-4px;font-size:1rem;text-shadow:0 1px 2px rgba(0,0,0,.5)}.question{padding:1rem;margin-top:0;min-height:calc(100svh - 1.5rem);box-sizing:border-box}.question__back{background:none;border:none;color:#7db2ff;margin-bottom:.5rem;padding:.5rem 0;font-size:1rem}.question__image{width:100%;border-radius:8px;margin-bottom:.75rem;box-shadow:0 4px 12px #0000004d}.question__text{font-size:1.1rem;line-height:1.6;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.question__hint{margin-top:.75rem;padding:1rem;border-radius:8px;background:#26a69a3d;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(128,223,216,.38);color:#fff}.question__input{width:100%;min-height:80px;margin-top:1rem;border-radius:8px;padding:.75rem;background:#00000080;border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1rem}.question__input:focus{outline:none;border-color:#7db2ff;background:#000000b3}.question__actions{display:flex;gap:.75rem;margin-top:1rem;flex-wrap:wrap}.question__button{flex:1;min-width:140px;padding:1rem;border-radius:8px;border:none;font-weight:600;font-size:1rem;background:linear-gradient(135deg,#ffd34d,#60d6c8);color:#1b1b1b;cursor:pointer;transition:transform .1s}.question__button:active{transform:scale(.98)}.question__button--secondary{background:#ffffff1a;border:1px solid rgba(255,255,255,.3);color:#fff;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.question__status{margin-top:.75rem;color:#fff2ad;text-align:center;font-weight:500;text-shadow:0 1px 2px rgba(0,0,0,.8)}.question__result{margin-top:1rem;padding:1rem;border-radius:8px;background:#4be38f33;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(75,227,143,.4);display:flex;flex-direction:column;gap:.75rem;color:#fff}.question__comment{margin-top:.5rem;font-size:.95rem;line-height:1.5}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn .2s ease-out}.modal-content{background:#fff;padding:1.5rem;border-radius:8px;width:85%;max-width:320px;text-align:center;box-shadow:0 4px 20px #0000004d;animation:scaleIn .2s ease-out;color:#333}.modal-title{margin:0 0 .5rem;font-size:1.2rem;font-weight:600}.modal-message{margin:0 0 1.5rem;font-size:.95rem;line-height:1.5;color:#666}.modal-actions{display:flex;flex-direction:column;gap:.75rem}.modal-button{padding:.8rem;border:none;border-radius:8px;font-weight:600;font-size:1rem;cursor:pointer;background:#f0f0f0;color:#333;transition:background .2s}.modal-button:active{transform:scale(.98)}.modal-button--primary{background:#ffd34d;color:#1b1b1b}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.app{position:relative;z-index:0;isolation:isolate;width:100%;max-width:430px;margin:0 auto;padding:.75rem;box-sizing:border-box;overflow-x:hidden;min-height:100svh;box-shadow:0 0 0 1px #ffffff14,0 24px 80px #00000059}.app:before{content:"";position:fixed;inset:0 auto 0 50%;width:min(100vw,430px);transform:translate(-50%);background-image:linear-gradient(180deg,#080c122e,#080c1285),url(/assets/wood-BK9Zte7b.jpg);background-size:cover;background-position:center top;z-index:-1;pointer-events:none}@media (max-width: 430px){.app{max-width:none;box-shadow:none}.app:before{width:100vw}}:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background-color:#111318;color:#f7f7f7}*{box-sizing:border-box}body{margin:0;min-height:100vh;overflow-y:scroll;background:radial-gradient(circle at top left,rgba(38,166,154,.18),transparent 32rem),linear-gradient(180deg,#191b22,#07080c)}#root{min-height:100vh;display:flex;justify-content:center}button{font:inherit;cursor:pointer}