:root{--bg-main:#090f1a;--bg-gradient-a:#0c1628;--bg-gradient-b:#081220;--panel:#101d30;--panel-border:#76adff3d;--text-main:#eaf4ff;--text-subtle:#9db3c9;--accent:#63d6ff;--accent-strong:#34bfff;--shadow-soft:0 14px 38px #0000006b;--shadow-glow:0 0 0 1px #63d6ff59, 0 14px 38px #00000080}*,:before,:after{box-sizing:border-box}html,body,#root{width:100%;min-height:100vh;margin:0}body{color:var(--text-main);background:radial-gradient(circle at 20% 10%, var(--bg-gradient-a), var(--bg-main) 48%, var(--bg-gradient-b));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;overflow-x:hidden}.home-page{place-items:center;min-height:100vh;padding:2rem;display:grid;position:relative;overflow:hidden}.section-page{min-height:100vh;padding:2rem;position:relative;overflow:hidden}.animated-bg{filter:blur(12px);pointer-events:none;background:radial-gradient(circle at 18% 30%,#4a93ff42 0%,#0000 46%),radial-gradient(circle at 80% 74%,#1dd2ff33 0%,#0000 44%);animation:15s ease-in-out infinite alternate floatField;position:absolute;inset:-12%}.animated-bg--section{background:radial-gradient(circle at 10% 15%,#4a93ff33 0%,#0000 45%),radial-gradient(circle at 86% 70%,#1dd2ff29 0%,#0000 44%)}.home-content{z-index:1;width:min(1120px,100%);position:relative}.section-content{z-index:1;width:min(1120px,100%);margin:0 auto;position:relative}.home-nav{justify-content:flex-start;margin-bottom:1.1rem;display:flex}.home-nav--bottom{justify-content:center;margin-top:1.5rem;margin-bottom:0}.home-nav-button{color:var(--text-main);background:#0b1727d6;border:1px solid #7ed3ff59;border-radius:11px;padding:.52rem .9rem;text-decoration:none;transition:transform .2s,border-color .2s,box-shadow .2s}.home-nav-button:hover{border-color:#7ed3ffc7;transform:translateY(-2px);box-shadow:0 0 0 1px #63d6ff59}.home-nav-button:focus-visible{outline:2px solid var(--accent-strong);outline-offset:2px}.home-header{text-align:center;margin-bottom:2.1rem}.home-header h1{letter-spacing:.02em;margin:0;font-size:clamp(2rem,5vw,3.35rem)}.home-header p{color:var(--text-subtle);margin-top:.65rem;font-size:clamp(1rem,2vw,1.2rem)}.category-grid,.demo-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;display:grid}.home-header--section{text-align:left}.section-page{--section-accent:#63d6ff}.section-page--android{--section-accent:#40f6b7}.section-page--ios{--section-accent:#8db7ff}.section-page--other{--section-accent:#ab8cff}.section-page .home-nav-button{border-color:color-mix(in srgb, var(--section-accent) 38%, transparent)}.section-page .home-nav-button:hover{border-color:color-mix(in srgb, var(--section-accent) 74%, white 26%);box-shadow:0 0 0 1px color-mix(in srgb, var(--section-accent) 35%, transparent)}.section-page .home-nav-button:focus-visible{outline-color:var(--section-accent)}@keyframes floatField{0%{transform:translate(-1%,-1%)scale(1)}to{transform:translate(1.5%,1.5%)scale(1.04)}}@media (width<=980px){body{overflow-y:auto}.home-page{min-height:auto;padding:1.5rem}.section-page{padding:1.5rem}.category-grid,.demo-grid{grid-template-columns:1fr}}.app-frame-page{--frame-accent:#63d6ff;--frame-accent-soft:#63d6ff52;background:linear-gradient(155deg,#091120,#08101a 54%,#0a1525);flex-direction:column;min-height:100vh;display:flex}.app-frame-header{border-bottom:1px solid color-mix(in srgb, var(--frame-accent) 38%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0d1828eb;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.4rem;display:flex}.app-frame-title-wrap h1{letter-spacing:.01em;margin:0;font-size:clamp(1.2rem,2.7vw,1.7rem)}.app-frame-title-wrap span{color:var(--text-subtle);font-size:.85rem}.app-frame-nav{gap:.65rem;display:flex}.back-button{color:var(--text-main);border:1px solid color-mix(in srgb, var(--frame-accent) 42%, transparent);border-radius:11px;padding:.55rem .9rem;text-decoration:none;transition:transform .2s,border-color .2s,box-shadow .2s}.back-button:hover{border-color:color-mix(in srgb, var(--frame-accent) 72%, white 28%);box-shadow:0 0 0 1px var(--frame-accent-soft);transform:translateY(-2px)}.back-button:focus-visible{outline:2px solid var(--frame-accent);outline-offset:2px}.app-frame-container{flex:1;padding:.85rem;display:flex}.app-frame-iframe{border:1px solid color-mix(in srgb, var(--frame-accent) 36%, transparent);background:#02060d;border-radius:14px;flex:1;width:100%;min-height:calc(100vh - 96px - 1.7rem)}.app-frame-fallback{border:1px solid color-mix(in srgb, var(--frame-accent) 36%, transparent);width:100%;min-height:calc(100vh - 96px - 1.7rem);color:var(--text-subtle);letter-spacing:.01em;background:linear-gradient(160deg,#0b1626f2,#08101efa);border-radius:14px;place-items:center;font-size:1.05rem;display:grid}.app-frame-page--android{--frame-accent:#40f6b7;--frame-accent-soft:#40f6b74d}.app-frame-page--ios{--frame-accent:#8db7ff;--frame-accent-soft:#8db7ff4d}.app-frame-page--other{--frame-accent:#ab8cff;--frame-accent-soft:#ab8cff4d}@media (width<=640px){.app-frame-header{flex-direction:column;align-items:flex-start}.app-frame-nav{width:100%}}.category-card{--category-accent:#63d6ff;--category-accent-soft:#63d6ff4d;min-height:250px;color:inherit;box-shadow:var(--shadow-soft);background:linear-gradient(160deg,#0d1d31f5,#0a1627fa);border:1px solid #6fbeff3d;border-radius:18px;flex-direction:column;gap:.8rem;padding:1.5rem;text-decoration:none;transition:transform .24s,border-color .24s,box-shadow .24s,background .24s;display:flex;position:relative;overflow:hidden}.category-card h2{margin:0;font-size:1.7rem}.category-card p{color:var(--text-subtle);margin:0;line-height:1.45}.category-card__cta{color:var(--category-accent);letter-spacing:.02em;margin-top:auto;font-size:.92rem}.category-card__shine{background:radial-gradient(circle, var(--category-accent-soft), #63d6ff00);opacity:.76;pointer-events:none;width:180px;height:180px;transition:transform .24s,opacity .24s;position:absolute;top:-75px;right:-75px}.category-card:hover{border-color:color-mix(in srgb, var(--category-accent) 70%, white 30%);box-shadow:0 0 0 1px var(--category-accent-soft), 0 14px 38px #00000080;transform:translateY(-7px)scale(1.015)}.category-card:hover .category-card__shine{opacity:1;transform:scale(1.14)}.category-card:focus-visible{outline:2px solid var(--category-accent);outline-offset:3px}.category-card--android{--category-accent:#40f6b7;--category-accent-soft:#40f6b74a}.category-card--ios{--category-accent:#8db7ff;--category-accent-soft:#8db7ff4a}.category-card--other{--category-accent:#ab8cff;--category-accent-soft:#ab8cff4a}.demo-card{--demo-accent:#63d6ff;--demo-accent-soft:#63d6ff4d;min-height:210px;color:inherit;box-shadow:var(--shadow-soft);background:linear-gradient(155deg,#0d1b2ef2,#091425fa);border:1px solid #6fbeff3d;border-radius:16px;flex-direction:column;gap:.75rem;padding:1.3rem;text-decoration:none;transition:transform .22s,border-color .22s,box-shadow .22s;display:flex;position:relative;overflow:hidden}.demo-card h2{margin:0;font-size:1.28rem}.demo-card p{color:var(--text-subtle);margin:0;line-height:1.45}.demo-card__cta{color:var(--demo-accent);letter-spacing:.015em;margin-top:auto;font-size:.9rem}.demo-card__shine{background:radial-gradient(circle, var(--demo-accent-soft), #63d6ff00);opacity:.72;width:150px;height:150px;transition:transform .22s,opacity .22s;position:absolute;top:-60px;right:-65px}.demo-card:hover{border-color:color-mix(in srgb, var(--demo-accent) 70%, white 30%);box-shadow:0 0 0 1px var(--demo-accent-soft), 0 12px 34px #00000075;transform:translateY(-5px)}.demo-card:hover .demo-card__shine{opacity:1;transform:scale(1.14)}.demo-card:focus-visible{outline:2px solid var(--demo-accent);outline-offset:3px}.demo-card__badge{letter-spacing:.06em;text-transform:uppercase;width:fit-content;color:var(--demo-accent);border:1px solid color-mix(in srgb, var(--demo-accent) 45%, transparent);background:color-mix(in srgb, var(--demo-accent) 14%, transparent);border-radius:999px;padding:.25rem .6rem;font-size:.73rem;font-weight:600}.demo-card--placeholder{cursor:default;opacity:.92}.demo-card--placeholder:hover{transform:none}.demo-card--android{--demo-accent:#40f6b7;--demo-accent-soft:#40f6b74a}.demo-card--ios{--demo-accent:#8db7ff;--demo-accent-soft:#8db7ff4a}.demo-card--other{--demo-accent:#ab8cff;--demo-accent-soft:#ab8cff4a}