@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Noto+Sans+TC:wght@400;500;700;900&display=swap');
:root{--bg:#080b14;--panel:#111522;--ink:#edf2ee;--muted:#8993a8;--cyan:#66e8e5;--lime:#d8ff53;--orange:#ff704a;--line:#273044}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'Noto Sans TC',sans-serif;min-height:100vh}body:before{content:'';position:fixed;inset:0;background:linear-gradient(90deg,transparent 49.9%,rgba(102,232,229,.035) 50%,transparent 50.1%),linear-gradient(0deg,transparent 49.9%,rgba(102,232,229,.035) 50%,transparent 50.1%);background-size:80px 80px;pointer-events:none}.noise{position:fixed;inset:0;opacity:.06;pointer-events:none;background-image:repeating-linear-gradient(0deg,#fff 0,#fff 1px,transparent 1px,transparent 4px)}.shell{max-width:1080px;margin:auto;padding:28px 34px 22px}.topbar{display:flex;justify-content:space-between;align-items:center;font:500 11px 'IBM Plex Mono',monospace;letter-spacing:.08em;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:20px}.brand{display:flex;align-items:center;gap:13px}.brand-mark{color:var(--bg);background:var(--lime);font-weight:600;padding:5px 7px;letter-spacing:0}.status{color:var(--cyan)}.status-dot{display:inline-block;width:7px;height:7px;background:var(--orange);border-radius:50%;margin-right:7px;box-shadow:0 0 9px var(--orange)}.hero{padding:78px 0 45px;max-width:730px}.eyebrow,.stage-label{font:500 11px 'IBM Plex Mono',monospace;color:var(--cyan);letter-spacing:.1em}.hero h1{font-size:clamp(44px,8vw,86px);line-height:1.07;letter-spacing:-.07em;margin:20px 0 24px;font-weight:900}.hero h1 em{color:var(--lime);font-style:normal;text-shadow:0 0 22px rgba(216,255,83,.18)}.hero-copy{max-width:490px;color:var(--muted);font-size:15px;line-height:1.9;margin:0}.mission-line{display:flex;align-items:center;gap:13px;margin-top:34px;color:var(--lime);font:500 11px 'IBM Plex Mono',monospace}.mission-line i{height:1px;width:90px;background:var(--lime);opacity:.5}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:35px}.tab{appearance:none;border:1px solid var(--line);background:rgba(17,21,34,.7);color:var(--muted);padding:17px 18px;text-align:left;cursor:pointer;transition:.2s}.tab span{font:500 11px 'IBM Plex Mono';color:var(--orange);display:block;margin-bottom:7px}.tab b{display:block;color:var(--ink);font-size:16px}.tab small{display:block;font:10px 'IBM Plex Mono';margin-top:6px;letter-spacing:.1em}.tab:hover,.tab.active{border-color:var(--cyan);background:rgba(102,232,229,.08);box-shadow:inset 3px 0 var(--cyan)}.stage-label{margin-bottom:12px;color:var(--muted)}.stage-label span{color:var(--orange)}.challenge-card{background:rgba(17,21,34,.91);border:1px solid var(--line);padding:32px 36px;position:relative;overflow:hidden;box-shadow:0 15px 50px rgba(0,0,0,.24)}.challenge-card:after{content:'';position:absolute;right:0;top:0;border-top:35px solid var(--cyan);border-left:35px solid transparent;opacity:.7}.hidden{display:none}.card-top{display:flex;justify-content:space-between;align-items:center;font:10px 'IBM Plex Mono';letter-spacing:.08em}.chip{border:1px solid #3e485c;color:var(--cyan);padding:5px 8px}.lock{color:var(--lime)}.challenge-card h2{font-size:30px;margin:28px 0 16px;letter-spacing:-.04em}.question{font-size:16px;line-height:2;color:#c9d1dc;max-width:700px;margin:0 0 23px}.question strong{color:var(--ink);font-weight:700}.hint{font:13px 'IBM Plex Mono',monospace;color:var(--muted);border-left:2px solid var(--orange);padding:7px 12px;margin:0 0 33px}.hint span{color:var(--orange);margin-right:10px}.hint code{color:var(--lime)}.answer-form label{display:block;color:var(--muted);font:11px 'IBM Plex Mono';margin-bottom:8px}.input-row{display:flex;gap:9px}.input-row input{width:100%;min-width:0;background:#080b14;border:1px solid #354056;color:var(--ink);font:16px 'IBM Plex Mono';padding:15px 16px;outline:none}.input-row input:focus{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(102,232,229,.13)}button[type=submit]{border:0;background:var(--lime);color:#111522;font:700 14px 'Noto Sans TC';padding:0 23px;cursor:pointer;white-space:nowrap}button[type=submit]:hover{background:#efffa8}.feedback{min-height:23px;margin-top:15px;font:12px 'IBM Plex Mono';color:var(--orange)}.feedback.success{color:var(--lime)}.image-frame{position:relative;max-width:280px;background:#080b14;border:1px solid #354056;margin:6px 0 20px;padding:7px}.image-frame img{width:100%;display:block;filter:saturate(.75) contrast(1.1)}.image-tag{position:absolute;bottom:13px;left:13px;background:var(--bg);color:var(--cyan);font:10px 'IBM Plex Mono';padding:5px}footer{display:flex;justify-content:space-between;color:#536077;font:10px 'IBM Plex Mono';letter-spacing:.08em;padding-top:26px}
@media(max-width:620px){.shell{padding:18px 17px 18px}.topbar{padding-bottom:15px;align-items:flex-start;gap:12px}.brand{font-size:10px;gap:8px}.account-area{display:block;text-align:right}.status{display:block;font-size:9px;line-height:1.5}.user-badge{display:block;width:max-content;margin:8px 0 0 auto;font-size:9px}.tab{padding:12px 10px}.hero{padding:56px 0 32px}.hero h1{font-size:53px;margin:17px 0 20px}.hero-copy{font-size:14px;line-height:1.8}.mission-line{margin-top:25px}.tabs{gap:5px;margin-bottom:25px}.tab b{font-size:13px}.tab small{font-size:8px}.challenge-card{padding:24px 19px}.challenge-card h2{font-size:25px;margin-top:24px}.question{font-size:15px;line-height:1.9}.input-row{display:block}.input-row input{font-size:15px;padding:14px 13px}.input-row button{width:100%;margin-top:8px;padding:14px}.card-top{font-size:9px}.chip{font-size:8px}.hint{line-height:1.7;margin-bottom:26px}footer{display:block;line-height:2.1}footer span{display:block}}
.account-area{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.user-badge.hidden{display:none}
.solved{border-color:var(--lime)!important;box-shadow:inset 3px 0 var(--lime),0 0 16px rgba(216,255,83,.12)!important}.tab.solved:after{content:' ✓';color:var(--lime);font:600 12px 'IBM Plex Mono'}.challenge-card.is-solved{border-color:var(--lime);box-shadow:0 0 25px rgba(216,255,83,.1)}.challenge-card.is-solved:before{content:'SOLVED // 已解鎖';position:absolute;right:44px;top:14px;color:var(--lime);font:10px 'IBM Plex Mono';letter-spacing:.08em}.auth-backdrop,.completion-backdrop{position:fixed;z-index:10;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(4,6,12,.86);backdrop-filter:blur(8px)}.auth-backdrop.hidden,.completion-backdrop.hidden,.user-badge.hidden{display:none}.auth-modal,.completion-modal{width:min(100%,430px);background:var(--panel);border:1px solid var(--cyan);padding:34px 32px;box-shadow:0 0 45px rgba(102,232,229,.15),inset 0 0 35px rgba(102,232,229,.035);position:relative}.auth-modal:after,.completion-modal:after{content:'';position:absolute;right:0;top:0;border-top:28px solid var(--lime);border-left:28px solid transparent}.auth-kicker{font:11px 'IBM Plex Mono';color:var(--cyan);letter-spacing:.1em}.auth-modal h2,.completion-modal h2{font-size:32px;line-height:1.25;letter-spacing:-.05em;margin:22px 0 13px}.auth-modal h2 em{font-style:normal;color:var(--lime)}.auth-modal p,.completion-modal p{font-size:13px;color:var(--muted);line-height:1.8;margin:0 0 24px}.auth-modal label{display:block;color:var(--muted);font:11px 'IBM Plex Mono';margin:14px 0 7px}.auth-modal input{display:block;width:100%;background:var(--bg);border:1px solid #354056;color:var(--ink);font:15px 'IBM Plex Mono';padding:13px;outline:none}.auth-modal input:focus{border-color:var(--cyan)}.auth-modal form button,.completion-modal button{width:100%;border:0;background:var(--lime);color:#111522;font:700 14px 'Noto Sans TC';padding:14px;margin-top:22px;cursor:pointer}.auth-switch{display:block;background:none;border:0;color:var(--cyan);font:12px 'Noto Sans TC';padding:16px 0 0;cursor:pointer}.auth-feedback{min-height:20px;color:var(--orange);font:11px 'IBM Plex Mono';margin-top:14px}.completion-modal{text-align:center;border-color:var(--lime);box-shadow:0 0 45px rgba(216,255,83,.2)}.completion-icon{width:56px;height:56px;border:1px solid var(--lime);border-radius:50%;display:grid;place-items:center;color:var(--lime);font-size:30px;margin:0 auto 22px}.completion-modal h2{color:var(--lime);margin-top:18px}.completion-modal p{margin-bottom:5px}.completion-modal p strong{color:var(--ink)}