*{box-sizing:border-box}body{margin:0;background:#0d171b;color:#e7f1ee;font:16px/1.6 system-ui}main{max-width:1180px;margin:auto;padding:24px 16px}a{color:#7de7c7}h1{font-size:clamp(28px,5vw,48px);line-height:1.15}h2{line-height:1.3}.tag{color:#7de7c7;font-weight:700;letter-spacing:.15em}.intro{max-width:780px;color:#b9cec6}button,select{font:inherit;background:#203c35;color:#f1fff9;border:1px solid #577d70;border-radius:10px;padding:12px;cursor:pointer}button:hover,button:focus-visible{background:#30634f;outline:2px solid #a2fadd}nav,.controls{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.card{padding:20px;background:#17292a;border:1px solid #304c48;border-radius:16px;margin:20px 0}.note{color:#baccc4}iframe{display:block;width:100%;height:900px;border:1px solid #527063;border-radius:18px;background:#101824}.app-frame{max-width:1000px;margin:auto}footer{padding:24px 0;color:#a5bfb4}summary{cursor:pointer}
iframe{height:min(780px,80svh);min-height:400px}