#loginView{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#28415b;background:#f8fcfd;font-synthesis:none;-webkit-font-smoothing:antialiased}
#loginView *{box-sizing:border-box}#loginView{margin:0}#loginView button,#loginView input{font:inherit}:where(#loginView) a{color:inherit;text-decoration:none}#loginView button{cursor:pointer}#loginView button,#loginView a,#loginView input{-webkit-tap-highlight-color:transparent}#loginView button:focus-visible,#loginView a:focus-visible,#loginView input:focus-visible{outline:2px solid #2e7cb0;outline-offset:4px}
#loginView .world{position:relative;isolation:isolate;min-height:calc(100svh - var(--oy-header-height));overflow:hidden}#loginView .landscape{position:fixed;inset:0;z-index:-1;pointer-events:none;background:#fbfdfd}#loginView .landscape picture,#loginView .landscape picture img,#loginView #water{position:absolute;width:100%;height:100%;object-fit:cover}#loginView .landscape picture img{object-position:center bottom}#loginView #water{opacity:0}#loginView #river-notes{position:absolute;inset:0;width:100%;height:100%;overflow:visible;color:#fcffff}#loginView .river-note{filter:drop-shadow(0 1px 2px rgba(176,221,236,.45));will-change:transform;transform-origin:0 0}#loginView .airship{position:absolute;top:40%;left:49%;width:112px;will-change:transform}#loginView .airship img{display:block;width:100%;height:auto}#loginView .content{max-width:1000px;margin:48px auto 0;display:grid;grid-template-columns:1fr 330px;gap:100px;padding:0 24px;align-items:start}#loginView .invitation{padding-top:54px}#loginView .invitation h1{font-size:32px;line-height:1.55;letter-spacing:1px;font-weight:450;margin:0 0 18px;color:#2c5270}#loginView .invitation p{font-size:14px;line-height:1.9;color:#3f5b72;margin:0 0 26px}#loginView .course{font-size:13px;color:var(--oy-blue);display:inline-flex;gap:20px;align-items:center}#loginView .course:hover{color:#174f79}#loginView .glass{padding:29px 28px 25px;border:1px solid rgba(255,255,255,.9);border-radius:16px;background:rgba(249,252,255,.76);box-shadow:0 8px 28px rgba(43,75,85,.065),inset 0 1px 0 rgba(255,255,255,.65);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}#loginView .glass h2{font-size:20px;font-weight:600;margin:0 0 8px;letter-spacing:.6px}#loginView .members{font-size:11px;color:var(--oy-muted);line-height:1.7;margin:0 0 23px}#loginView form>label:not(.consent){display:block;font-size:11px;font-weight:550;margin:0 0 7px}#loginView form>input,#loginView .password{margin-bottom:17px}#loginView input[type=tel],#loginView input[type=password],#loginView input[type=text]{width:100%;height:40px;padding:0 12px;border:1px solid #c2d4df;border-radius:7px;background:rgba(255,255,255,.55);font-size:12px;color:#254664}#loginView input::placeholder{color:var(--oy-muted)}#loginView input:focus{border-color:#6698ba}#loginView .password{display:flex;position:relative}#loginView .password input{padding-right:48px}#loginView .password button{position:absolute;right:3px;top:3px;bottom:3px;border:0;background:transparent;padding:0 10px;color:var(--oy-muted);font-size:11px}#loginView .consent{display:flex;align-items:flex-start;gap:8px;font-size:10px;line-height:1.8;color:var(--oy-muted);margin:1px 0 19px}#loginView .consent input{margin:3px 0 0;width:12px;height:12px;flex:none;accent-color:#326cad}#loginView .inline{border:0;background:transparent;padding:0;color:var(--oy-blue);font-size:inherit;text-decoration:underline;text-underline-offset:3px}#loginView .enter{width:100%;height:40px;border:0;border-radius:7px;background:var(--oy-blue);color:white;font-size:12px;font-weight:550;display:flex;align-items:center;justify-content:center;gap:18px;transition:background 150ms}#loginView .enter:hover{background:#123f91}#loginView .forgot{margin-top:14px;padding:0;border:0;background:transparent;color:var(--oy-blue);font-size:11px}#loginView .help{font-size:10px;line-height:1.8;color:var(--oy-muted);margin:23px 0 0}#loginView #status{font-size:11px;line-height:1.7;color:#356082;margin:15px 0 0}#loginView .motion{position:absolute;bottom:18px;left:24px;display:flex;align-items:center;gap:7px;color:#426571;border:1px solid rgba(255,255,255,.6);border-radius:20px;background:rgba(255,255,255,.65);backdrop-filter:blur(8px);height:30px;padding:0 12px;font-size:10px}#loginView .motion>span:first-child{font-size:12px;letter-spacing:-1px}#loginView .preview-label{position:absolute;bottom:25px;right:24px;font-size:9px;color:#4c6861;text-shadow:0 1px 3px #fff}#loginView dialog{border:1px solid #d3dfe7;border-radius:12px;padding:24px;max-width:320px;font-size:13px;line-height:1.8;color:#37526b}#loginView dialog::backdrop{background:rgba(34,58,77,.15)}#loginView dialog p{margin:0 0 20px}#loginView dialog button{border:0;border-radius:6px;background:var(--oy-blue);color:#fff;padding:9px 20px}
@media(max-width:1000px){#loginView .content{gap:44px;max-width:760px;margin-top:88px;grid-template-columns:1fr 306px}#loginView .glass{padding:27px 24px}#loginView .invitation h1{font-size:28px}#loginView .invitation{padding-top:38px}#loginView .airship{left:47%;top:11%;width:120px}}
@media(max-width:699px){#loginView .content{display:block;padding:0 24px;margin-top:25px;max-width:424px}#loginView .invitation{padding-top:0}#loginView .invitation h1{font-size:25px;line-height:1.5;letter-spacing:.5px;margin-bottom:11px}#loginView .invitation p{font-size:12px;line-height:1.8;margin-bottom:15px}#loginView .course{font-size:11px;gap:16px}#loginView .glass{margin-top:25px;padding:23px 24px 22px;border-radius:13px;background:rgba(249,252,255,.82)}#loginView .glass h2{font-size:18px}#loginView .members{font-size:10px;margin-bottom:19px}#loginView .help{margin-top:20px}#loginView .airship{left:auto;right:12px;top:115px;width:79px}#loginView .motion{left:15px;bottom:12px;height:27px;padding:0 9px}#loginView .motion-label{display:none}#loginView .preview-label{bottom:19px;right:16px}#loginView .world{padding-bottom:100px}}
@media(max-width:359px){#loginView .content{padding:0 18px}#loginView .invitation h1{font-size:23px}#loginView .glass{padding:21px 20px}#loginView .airship{width:64px;right:8px}}
@media(min-width:700px) and (max-height:600px){#loginView .content{margin-top:0;gap:45px;max-width:920px;grid-template-columns:1fr 300px}#loginView .invitation{padding-top:16px}#loginView .glass{padding:19px 23px}#loginView .members{margin-bottom:16px}#loginView .help{margin-top:16px}#loginView .world{padding-bottom:45px}#loginView .airship{top:18%;left:49%;width:96px}}
@media(prefers-reduced-motion:reduce){#loginView .river-note,#loginView .airship{will-change:auto}#loginView .enter{transition:none}}

@media(max-width:699px){#loginView .content{margin-top:23px}#loginView .invitation h1{font-size:23px;margin-bottom:8px}#loginView .invitation p{margin-bottom:10px}#loginView .glass{margin-top:19px;padding:20px 22px}#loginView .members{margin-bottom:14px}#loginView form>input,#loginView .password{margin-bottom:13px}#loginView .consent{margin-bottom:14px}#loginView .help{margin-top:16px}#loginView .glass h2{margin-bottom:6px}#loginView .world{padding-bottom:140px}#loginView .preview-label{font-size:8px}}

/* Spacious desktop composition; keep the headline restrained. */
@media(min-width:1001px) and (min-height:601px){
 #loginView .content{max-width:clamp(1000px,calc(15vw + 790px),1160px);margin-top:max(48px,calc(33svh - 190px));grid-template-columns:1fr 360px;gap:clamp(80px,8vw,144px)}
 #loginView .invitation{padding-top:54px;text-shadow:0 1px 8px rgba(255,255,255,.85)}
 #loginView .members{font-size:12px;color:var(--oy-muted)}
 #loginView form>label:not(.consent){font-size:12px}
 #loginView input[type=tel],#loginView input[type=password],#loginView input[type=text]{height:42px;font-size:14px}
 #loginView input::placeholder{color:var(--oy-muted)}
 #loginView .password button,#loginView .forgot{font-size:12px;color:#315e80}
 #loginView .consent{font-size:11px;color:var(--oy-muted)}
 #loginView .enter{height:42px;font-size:13px}
 #loginView .help{font-size:11px;color:var(--oy-muted)}
 #loginView .airship{width:clamp(112px,6.5vw,150px)}
}

#loginView .skip-link{position:fixed;top:8px;left:20px;z-index:60;padding:10px 14px;background:var(--oy-paper);color:var(--oy-ink);transform:translateY(-150%)}#loginView .skip-link:focus{transform:none}
#loginView .oy-login[aria-current="page"]{color:var(--oy-blue)}

#loginView /* Strengthen small text over translucent scenery without darkening the scene. */
.glass :is(.members,.consent,.help){color:#46617a}

#loginView .ground-grid{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

@media(min-width:700px) and (max-aspect-ratio:13/10){#loginView .airship{top:11%;left:47%;width:120px}}
@media(max-width:359px){#loginView .airship{right:12px}}

@media(min-width:700px) and (max-height:600px){#loginView .invitation{position:relative;isolation:isolate;padding:16px 18px 18px}#loginView .invitation::before{content:"";position:absolute;inset:-10px 0 -35px -18px;z-index:-1;background:linear-gradient(90deg,rgba(249,252,255,.95),rgba(249,252,255,.85) 65%,transparent);mask-image:linear-gradient(180deg,transparent,#000 12px,#000 calc(100% - 35px),transparent)}}

#loginView [hidden]{display:none!important}
#loginView form{margin:0;padding:0;background:none;border:0;box-shadow:none}
#loginView form>label:not(.consent){margin:0 0 7px}
#loginView input:not([type=checkbox]){min-width:0;box-shadow:none}
#loginView .password-row{gap:0;margin-top:0}
#loginView .password button{border-radius:4px;min-height:0;box-shadow:none}
#loginView .consent{font-weight:400}
#loginView .consent a{color:var(--oy-blue);text-decoration:underline;text-underline-offset:3px}
#loginView .message:empty{display:none}
#loginView .message:not(:empty){min-height:0;margin:0 0 14px;padding:8px 10px;font-size:11px;line-height:1.7}
#loginView #recoveryForm h2{font-size:20px;margin:0 0 8px}
#loginView #recoveryForm>.muted{font-size:11px;line-height:1.7;margin:0 0 18px}
#loginView #recoveryForm>input{margin-bottom:13px}
#loginView #recoveryForm .consent{margin:0 0 14px}
#loginView #recoveryForm button.secondary{position:static;flex:none;font-size:11px;padding:0 10px;border:1px solid #c2d4df;border-radius:7px;margin-left:6px;white-space:nowrap}
#loginView #recoveryForm .password input{padding-right:12px}
#loginView #recoveryForm .primary{width:100%;height:40px;font-size:12px;border-radius:7px}
#loginView #cancelRecovery{font-size:11px;margin-top:12px;padding:0;color:var(--oy-blue)}
#loginView #localNotice{font-size:11px;margin-top:18px}

#loginView{line-height:normal}
#loginView .enter{min-height:0;padding:0}

/* A quiet closing line for the garden invitation. */
#loginView .invitation h1{margin-bottom:12px}
#loginView .invitation .garden-invitation{font-size:16px;line-height:1.6;font-weight:400;color:#55718a;margin:0 0 20px}
@media(max-width:699px){#loginView .invitation .garden-invitation{font-size:14px}}