:root{--paper:#f4f0e6;--paper-deep:#e9e3d5;--ink:#24231f;--muted:#7d786c;--line:#d8d1c2;--accent:#b55238;--accent-deep:#8d3928;--dark:#2e302c;--serif:'Noto Serif SC','Songti SC',serif;--sans:'Noto Sans SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);letter-spacing:0}
button,input{font:inherit}
button,a{touch-action:manipulation}
.hidden{display:none!important}
.auth-page{position:relative;isolation:isolate;min-height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:0 clamp(22px,5vw,76px);overflow:hidden;background-image:linear-gradient(rgba(81,75,64,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(81,75,64,.035) 1px,transparent 1px);background-size:100% 88px,88px 100%;box-shadow:inset 0 0 0 16px rgba(216,209,194,.2),inset 0 0 90px rgba(62,52,40,.06)}
.auth-page::before{content:"";position:absolute;z-index:3;inset:16px 20px;border:1px solid rgba(216,209,194,.72);pointer-events:none}
.auth-page::after{content:"";position:absolute;z-index:0;top:68px;right:0;bottom:40px;width:49%;border-left:1px solid rgba(216,209,194,.62);background:rgba(233,227,213,.32);pointer-events:none}
.auth-masthead,.auth-main,.auth-footer{position:relative;z-index:2}
.auth-masthead{min-height:68px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.auth-brand{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none}
.auth-brand-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--dark);color:var(--paper);font:700 21px/1 var(--serif)}
.auth-brand span:last-child{display:grid;gap:4px}
.auth-brand b{font:700 19px/1 var(--serif)}
.auth-brand small{color:var(--muted);font:8px/1 var(--sans);letter-spacing:2px}
.auth-language{position:relative}
.auth-language-trigger{display:flex;align-items:center;gap:8px;min-height:36px;padding:0 8px;border:0;background:transparent;color:var(--ink);cursor:pointer;font-size:11px}
.auth-language-trigger:focus-visible,.auth-language-options button:focus-visible,.auth-modes button:focus-visible,.auth-primary:focus-visible,.auth-quiet:focus-visible,.auth-guest:focus-visible,.auth-back:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.auth-language-options{position:absolute;z-index:10;top:42px;right:0;width:128px;padding:5px;border:1px solid var(--line);background:var(--paper);box-shadow:0 12px 30px rgba(41,38,32,.14)}
[dir=rtl] .auth-language-options{right:auto;left:0}
.auth-language-options button{width:100%;min-height:36px;padding:0 10px;border:0;background:transparent;color:var(--muted);text-align:left;cursor:pointer;font-size:11px}
[dir=rtl] .auth-language-options button{text-align:right}
.auth-language-options button:hover,.auth-language-options button[aria-checked=true]{background:var(--paper-deep);color:var(--accent)}
.auth-main{width:min(1120px,100%);height:100%;min-height:0;margin:auto;display:grid;grid-template-columns:minmax(280px,.86fr) minmax(380px,1.14fr);align-items:center;gap:clamp(42px,7vw,96px);padding:clamp(8px,1.6vh,20px) 0}
.auth-emblem{height:100%;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid var(--line)}
[dir=rtl] .auth-emblem{border-right:0;border-left:1px solid var(--line)}
.auth-emblem-core{position:relative;width:clamp(230px,min(31vw,46vh),340px);aspect-ratio:1;flex:0 0 auto}
.auth-emblem-core::before{content:"";position:absolute;inset:-12px;border-radius:50%;background:repeating-conic-gradient(from -1deg,rgba(125,120,108,.62) 0 2deg,transparent 2deg 45deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 7px));mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 7px));opacity:.58;pointer-events:none}
.auth-orbit{position:absolute;border:1px solid var(--line);border-radius:50%}
.auth-orbit-outer{inset:0}
.auth-orbit-inner{inset:12.5%;border-color:#cbbda8}
.auth-trigrams{position:absolute;z-index:2;inset:0;direction:ltr;color:var(--muted);font-family:var(--serif);pointer-events:none}
.auth-trigrams span{position:absolute;width:42px;height:34px;display:grid;grid-template-rows:18px 10px;place-items:center;align-content:center;gap:2px;white-space:nowrap;transform:translate(-50%,-50%)}
.auth-trigrams b{color:#5f5b52;font:500 18px/1 var(--serif)}
.auth-trigrams small{font:600 10px/1 var(--serif)}
.auth-trigrams span:nth-child(1){top:-4%;left:50%}
.auth-trigrams span:nth-child(2){top:11.816%;left:88.184%}
.auth-trigrams span:nth-child(3){top:50%;left:104%}
.auth-trigrams span:nth-child(4){top:88.184%;left:88.184%}
.auth-trigrams span:nth-child(5){top:104%;left:50%}
.auth-trigrams span:nth-child(6){top:88.184%;left:11.816%}
.auth-trigrams span:nth-child(7){top:50%;left:-4%}
.auth-trigrams span:nth-child(8){top:11.816%;left:11.816%}
.auth-hexagram{position:absolute;z-index:1;top:50%;left:50%;width:38%;display:grid;gap:10px;transform:translate(-50%,-50%)}
.auth-hexagram i{display:block;height:9px;background:var(--dark)}
.auth-hexagram i.broken{display:grid;grid-template-columns:1fr 1fr;gap:19px;background:transparent}
.auth-hexagram i.broken b{display:block;background:var(--dark)}
.auth-emblem-copy{z-index:2;width:min(340px,86%);margin-top:15px;text-align:center}
.auth-emblem-copy>span{color:var(--accent);font:600 10px var(--sans)}
.auth-emblem-copy blockquote{margin:7px 0 0;font:600 16px/1.55 var(--serif)}
.auth-emblem-copy cite{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:3px;color:#9a9387;font:9px/1.4 var(--serif);font-style:normal}
.auth-emblem-copy cite::before{content:"";width:15px;height:1px;background:var(--accent);opacity:.7}
.auth-panel{position:relative;isolation:isolate;width:min(400px,100%);justify-self:center}
.auth-panel::before{content:"觀";position:absolute;z-index:-1;top:-34px;right:-20px;color:rgba(46,48,44,.045);font:800 174px/.8 var(--serif);pointer-events:none}
[dir=rtl] .auth-panel::before{right:auto;left:-20px}
.auth-panel-heading>span{display:block;margin-bottom:7px;color:var(--accent);font:600 10px var(--sans)}
.auth-panel-heading h1{margin:0;font:700 clamp(34px,3.3vw,46px)/1.12 var(--serif)}
.auth-panel-heading p{max-width:410px;margin:9px 0 14px;color:var(--muted);font:12px/1.65 var(--sans)}
.auth-modes{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line);margin-bottom:10px}
.auth-modes button{min-height:40px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);cursor:pointer;font:600 13px var(--sans)}
.auth-modes button[aria-selected=true]{border-color:var(--accent);color:var(--ink)}
.auth-form{display:grid;gap:8px}
.auth-form label{display:grid;gap:5px;color:var(--muted);font-size:11px}
.auth-form input{width:100%;height:40px;padding:0 13px;border:1px solid #cfc5b5;border-radius:8px;background:rgba(255,255,255,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.48);color:var(--ink);direction:ltr;font-size:14px}
.auth-form input:focus{outline:2px solid color-mix(in srgb,var(--accent) 44%,transparent);outline-offset:1px;border-color:var(--accent)}
.auth-form label small{font-size:9px;color:#9d9589}
.auth-error{min-height:12px;margin:0;color:var(--accent);font:11px/1.4 var(--sans)}
.auth-primary{width:100%;min-height:42px;border:1px solid var(--accent);border-radius:8px;background:var(--accent);box-shadow:0 6px 15px rgba(141,57,40,.14);color:#fff;cursor:pointer;font:600 13px var(--sans)}
.auth-primary:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.auth-primary:disabled,.auth-guest:disabled{cursor:wait;opacity:.62}
.auth-divider{display:flex;align-items:center;gap:13px;margin:10px 0;color:#a39b8f;font-size:10px}
.auth-divider::before,.auth-divider::after{content:"";height:1px;flex:1;background:var(--line)}
.auth-guest{width:100%;min-height:52px;display:grid;grid-template-columns:28px 1fr;align-items:center;gap:10px;padding:7px 13px;border:1px solid var(--line);border-radius:8px;background:rgba(244,240,230,.44);color:var(--ink);text-align:left;cursor:pointer}
[dir=rtl] .auth-guest{text-align:right}
.auth-guest>span:first-child{display:grid;place-items:center;width:24px;height:24px;border:1px solid #9f9688;border-radius:50%;color:var(--accent);font-size:15px}
.auth-guest>span:last-child{display:grid;gap:4px}
.auth-guest b{font:600 12px var(--sans)}
.auth-guest small{color:var(--muted);font:10px var(--sans)}
.auth-guest:hover{border-color:var(--accent);background:rgba(181,82,56,.04)}
.auth-back{display:inline-flex;align-items:center;gap:8px;margin-top:10px;color:var(--muted);text-decoration:none;font-size:11px}
.auth-back:hover{color:var(--accent)}
.auth-signed{padding:24px 0 0;border-top:1px solid var(--line)}
.auth-status-dot{display:block;width:8px;height:8px;margin-bottom:17px;border-radius:50%;background:#66756a}
.auth-signed p{margin:0 0 8px;color:var(--muted);font-size:11px}
.auth-signed strong{display:block;max-width:100%;overflow-wrap:anywhere;font:700 21px/1.5 var(--serif)}
.auth-signed small{display:block;margin:7px 0 24px;color:var(--muted);font-size:11px}
.auth-quiet{width:100%;min-height:44px;margin-top:9px;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:11px}
.auth-quiet:hover{color:var(--accent)}
.auth-footer{min-height:40px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);color:#a0998c;font-size:9px}
@media(min-width:761px){.auth-emblem{position:relative}.auth-emblem-core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.auth-emblem-copy{position:absolute;top:calc(50% + clamp(115px,min(15.5vw,23vh),170px) + 15px);left:50%;transform:translateX(-50%);margin-top:0}}
@media(max-width:760px){.auth-page{grid-template-rows:auto auto auto;padding:0 16px;background-size:100% 72px,72px 100%;box-shadow:inset 0 0 0 10px rgba(216,209,194,.22),inset 0 0 72px rgba(62,52,40,.055)}.auth-page::before{inset:10px}.auth-page::after,.auth-panel::before{display:none}.auth-masthead{min-height:62px}.auth-brand-mark{width:34px;height:34px;font-size:18px}.auth-brand b{font-size:16px}.auth-main{height:auto;display:block;padding:10px 0 20px}.auth-emblem{height:auto;min-height:128px;margin:0 0 10px;border-right:0;border-left:0!important;border-bottom:1px solid var(--line)}.auth-emblem-core{width:92px}.auth-emblem-core::before{inset:-7px;opacity:.42}.auth-trigrams span{width:14px;height:14px;display:grid;grid-template-rows:1fr;gap:0}.auth-trigrams b{font-size:10px}.auth-trigrams small{display:none}.auth-hexagram{width:42%;gap:4px}.auth-hexagram i{height:3px}.auth-hexagram i.broken{gap:7px}.auth-emblem-copy{margin-top:12px}.auth-emblem-copy blockquote,.auth-emblem-copy cite{display:none}.auth-panel{width:100%}.auth-panel-heading>span{margin-bottom:5px}.auth-panel-heading h1{font-size:30px}.auth-panel-heading p{margin:7px 0 12px;font-size:11px;line-height:1.55}.auth-modes{margin-bottom:10px}.auth-modes button{min-height:38px}.auth-form{gap:8px}.auth-form input{height:42px}.auth-error{min-height:12px}.auth-primary{min-height:44px}.auth-divider{margin:10px 0}.auth-back{margin-top:13px}.auth-footer{min-height:48px;justify-content:center;text-align:center}.auth-footer span:last-child{display:none}}
@media(max-width:380px){.auth-masthead{gap:10px}.auth-brand small{display:none}.auth-language-trigger{padding:0 2px}.auth-main{padding-top:10px}.auth-panel-heading h1{font-size:29px}}
@media(max-width:760px) and (max-height:700px){.auth-main{padding:5px 0 9px}.auth-emblem{min-height:100px;margin-bottom:4px}.auth-emblem-core{width:72px}.auth-emblem-core::before{inset:-5px}.auth-trigrams span{width:12px;height:12px}.auth-trigrams b{font-size:8px}.auth-hexagram{gap:3px}.auth-hexagram i{height:2px}.auth-emblem-copy{margin-top:8px}.auth-footer{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
