*{box-sizing:border-box}html{font-family:Arial,sans-serif;background:#edf4f8;color:#173246}body{margin:0}a{color:#11639a}header{background:linear-gradient(115deg,#073447,#067d83);color:white;display:flex;align-items:center;gap:14px;padding:10px clamp(14px,3vw,36px)}header img{width:56px;height:56px;object-fit:contain;border-radius:8px;background:#ffffff1c}header strong{font-size:1.36rem}header small{display:block;opacity:.87;margin-top:4px}nav{background:#123b55;display:flex;overflow:auto;padding:0 clamp(10px,3vw,30px);gap:4px}nav a{padding:13px 17px;white-space:nowrap;color:#e9f7fc;text-decoration:none;font-weight:bold;border-bottom:3px solid transparent}nav a[aria-current=page]{background:#ffffff18;border-color:#64d4d5}main{padding:22px clamp(12px,3vw,36px);margin:auto;max-width:1550px}h1{font-size:1.65rem;margin:0 0 10px}h2{font-size:1.2rem;margin:0 0 12px}.subtitle{color:#527183;line-height:1.5;margin:0 0 20px}.panel{background:white;border:1px solid #d0e0e8;border-radius:13px;padding:16px;margin-bottom:18px;box-shadow:0 3px 18px #0d52620a}.panel p{line-height:1.55}.notice{background:#fff8e9;border:1px solid #edd8a0;padding:11px 13px;border-radius:8px;margin:12px 0;color:#694b15}.frame{display:block;width:100%;border:1px solid #c9dce6;border-radius:8px;background:#e4edf4;height:min(75dvh,820px);min-height:450px}.frame--tall{height:calc(100dvh - 255px);min-height:550px}.frame--shom{height:820px}.action{display:inline-block;border-radius:7px;background:#09678f;padding:10px 15px;color:white;text-decoration:none;font-weight:bold;margin:6px 6px 6px 0}.actions{display:flex;gap:10px;flex-wrap:wrap}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:16px}.grid .frame{height:420px;min-height:300px}.chips{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.chips button{background:#edf6fa;border:1px solid #b9d2e0;color:#154e68;padding:10px;border-radius:8px;cursor:pointer;font:inherit}.chips button[aria-pressed=true]{background:#176b91;color:white}.tiny{font-size:.86rem;color:#627c8b}footer{padding:20px 30px;text-align:center;color:#567686;font-size:.84rem} @media(max-width:650px){header{padding:9px 12px}header strong{font-size:1.1rem}header img{width:43px;height:43px}nav a{padding:12px}main{padding:14px 10px}.frame--tall{height:calc(100dvh - 245px);min-height:440px}.frame--shom{height:650px}.grid .frame{height:360px}h1{font-size:1.4rem}}