:root { color-scheme:dark; font-family:ui-monospace,"SFMono-Regular",Consolas,"Microsoft YaHei",monospace; color:#d8e6fb; background:#071522; --bg:#071522; --panel:#0d1b2c; --line:#203a55; --muted:#7188a8; --blue:#4ba6ff; --mint:#2ed5b4; --white:#f3f7ff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; background:var(--bg); }
body.notice-open { overflow:hidden; }
button,input { font:inherit; }
button { cursor:pointer; }
.notice-overlay { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:24px; background:rgba(2,9,17,.86); backdrop-filter:blur(12px); }
.notice-overlay.is-hidden { display:none; }
.notice-dialog { width:min(620px,100%); max-height:calc(100vh - 48px); overflow:auto; padding:42px; color:#b9cce5; border:1px solid #294d6e; border-radius:24px; background:linear-gradient(145deg,#102238,#0b1828); box-shadow:0 32px 100px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.04); }
.notice-icon { width:48px; height:48px; display:grid; place-items:center; margin-bottom:22px; color:#071522; border-radius:15px; background:var(--mint); box-shadow:0 0 34px rgba(46,213,180,.22); font:900 1.45rem/1 ui-sans-serif,system-ui,sans-serif; }
.notice-kicker { color:#4ba6ff; font-size:.72rem; font-weight:850; letter-spacing:.17em; }
.notice-dialog h1 { margin:9px 0 24px; color:#f1f7ff; font:900 clamp(1.8rem,5vw,2.5rem)/1.2 "Microsoft YaHei",sans-serif; letter-spacing:.02em; }
.notice-copy { padding:4px 0 6px; border-top:1px solid #1f3b55; }
.notice-copy p { margin:17px 0; font-family:"Microsoft YaHei",sans-serif; font-size:1rem; line-height:1.8; }
.notice-copy strong { color:#ffffff; font-size:1.07rem; }
.notice-copy b { color:#49ddbe; }
.notice-button { width:100%; min-height:56px; margin-top:18px; display:flex; align-items:center; justify-content:center; gap:12px; color:#fff; border:0; border-radius:12px; background:linear-gradient(135deg,#46a8ff,#247bd4); box-shadow:0 12px 30px rgba(42,137,226,.22); font-weight:850; transition:transform .2s,filter .2s; }
.notice-button:hover { filter:brightness(1.08); transform:translateY(-1px); }
.notice-button:focus-visible { outline:3px solid #6bc6ff; outline-offset:4px; }
.page-shell { min-height:100vh; padding:0 22px; overflow:hidden; background-image:linear-gradient(rgba(84,134,171,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(84,134,171,.065) 1px,transparent 1px),radial-gradient(circle at 15% 0%,rgba(31,190,174,.08),transparent 34rem),radial-gradient(circle at 86% 20%,rgba(43,104,194,.08),transparent 34rem); background-size:68px 68px,68px 68px,auto,auto; }
.hero { width:min(920px,100%); margin:0 auto; padding:68px 0 44px; }
.brand { display:inline-flex; align-items:baseline; gap:13px; text-decoration:none; letter-spacing:-.065em; filter:drop-shadow(4px 5px 0 rgba(1,6,14,.8)); }
.brand-en { color:#f7f3e9; font:900 clamp(3.8rem,9vw,7.5rem)/.86 Impact,"Arial Narrow",sans-serif; -webkit-text-stroke:1px #07131e; }
.brand-cn { color:var(--mint); font:900 clamp(2.8rem,7vw,6rem)/.92 "Microsoft YaHei",sans-serif; }
.subtitle { margin:26px 0 0; color:#c0d0c6; font:700 clamp(1.05rem,2vw,1.45rem)/1.5 KaiTi,STKaiti,"Microsoft YaHei",serif; letter-spacing:.12em; }
.feature-row { display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.feature-pill { display:flex; align-items:center; gap:10px; min-height:48px; padding:0 22px; border:1px solid #28506e; border-radius:999px; color:#9dcbff; background:rgba(8,23,37,.72); font-weight:750; }
.feature-pill b { color:#54b1ff; font-size:1.25rem; }
.steps { width:min(820px,100%); margin:14px auto 32px; display:flex; align-items:center; justify-content:center; color:#637b9e; }
.step { display:flex; align-items:center; gap:11px; white-space:nowrap; }
.step span { width:38px; height:38px; display:grid; place-items:center; border:2px solid #294562; border-radius:50%; font-weight:800; }
.step b { font-size:1rem; letter-spacing:.04em; }
.step.active { color:#64afff; }
.step.active span { color:white; border-color:var(--blue); background:var(--blue); box-shadow:0 0 24px rgba(75,166,255,.2); }
.steps i { width:clamp(38px,10vw,120px); height:2px; margin:0 16px; background:#1d354e; }
.work-card { width:min(920px,100%); margin:0 auto; padding:64px 66px 58px; border:1px solid rgba(71,102,136,.27); border-radius:28px; background:rgba(13,27,44,.94); box-shadow:0 26px 70px rgba(0,5,14,.3); }
.card-label { display:inline-flex; padding:7px 18px; color:#63adff; border-radius:999px; background:#193958; font:800 .85rem/1 "Microsoft YaHei",sans-serif; }
.work-card h1 { margin:20px 0 10px; color:var(--white); font:900 clamp(2rem,5vw,3.2rem)/1.15 KaiTi,STKaiti,"Microsoft YaHei",sans-serif; letter-spacing:.02em; }
.card-copy { margin:0 0 36px; color:#86a3c8; font-size:1rem; line-height:1.7; }
form label { display:block; margin:22px 0 10px; color:#acc7e8; font-size:.95rem; font-weight:800; }
form label span { color:#ff6c79; }
form label small { color:#607b9c; font-size:.78rem; }
input { width:100%; height:62px; padding:0 20px; color:#dfebfb; outline:none; border:1px solid #294662; border-radius:13px; background:#0a1929; font-size:1rem; transition:border-color .2s,box-shadow .2s; }
input::placeholder { color:#50698b; }
input:focus { border-color:#4897df; box-shadow:0 0 0 4px rgba(75,166,255,.09); }
.field-wrap { position:relative; }
.field-wrap input { padding-left:54px; }
.field-icon { position:absolute; left:20px; top:50%; color:#607b9c; transform:translateY(-50%); font-size:1.3rem; pointer-events:none; }
.submit-row { display:flex; align-items:center; gap:20px; margin-top:40px; }
.submit-row button { height:56px; padding:0 24px; display:flex; align-items:center; gap:12px; flex:none; color:white; border:0; border-radius:12px; background:linear-gradient(135deg,#46a8ff,#247bd4); box-shadow:0 12px 30px rgba(42,137,226,.22); font-weight:850; transition:transform .2s,filter .2s; }
.submit-row button:hover { filter:brightness(1.08); transform:translateY(-2px); }
#message { margin:0; color:#657f9f; font-size:.8rem; line-height:1.55; }
.collection { width:min(920px,100%); margin:70px auto 90px; }
.collection-head { display:flex; align-items:end; justify-content:space-between; padding-bottom:20px; border-bottom:1px solid #1b344c; }
.collection-head span { color:#4e7194; font-size:.72rem; letter-spacing:.15em; }
.collection-head h2 { margin:7px 0 0; color:#dce9fa; font-size:1.7rem; }
.collection-head strong { color:#365573; font-size:2.8rem; font-weight:300; }
.empty-state { min-height:210px; display:grid; place-items:center; align-content:center; margin-top:20px; border:1px dashed #26435f; border-radius:20px; background:rgba(10,25,41,.56); text-align:center; }
.empty-state b { width:48px; height:48px; display:grid; place-items:center; margin-bottom:13px; color:#5aabf7; border-radius:14px; background:#142f4a; font-size:1.4rem; }
.empty-state h3 { margin:0; color:#a7bfdd; font-size:1rem; }
.empty-state p { margin:8px 0 0; color:#587391; font-size:.82rem; }
.link-list { display:grid; gap:10px; margin:20px 0 0; padding:0; list-style:none; }
.link-list li { display:grid; grid-template-columns:42px 1fr auto; align-items:center; gap:14px; min-height:76px; padding:12px 15px; border:1px solid #1f3c57; border-radius:15px; background:#0b1a2b; }
.link-index { color:#3e607e; font-size:.76rem; }
.link-main { min-width:0; display:grid; gap:5px; }
.link-main strong { overflow:hidden; color:#aed0f6; text-overflow:ellipsis; white-space:nowrap; font-size:.96rem; }
.link-main span { overflow:hidden; color:#577493; text-overflow:ellipsis; white-space:nowrap; font-size:.77rem; }
.link-actions { display:flex; gap:3px; }
.link-actions button,.link-actions a { width:38px; height:38px; display:grid; place-items:center; color:#6686a8; border:0; border-radius:9px; background:transparent; text-decoration:none; font-size:1.15rem; }
.link-actions button:hover,.link-actions a:hover { color:#66b3ff; background:#132d47; }
.link-actions .delete:hover { color:#ff7d87; background:#361e2a; }
footer { width:min(1080px,100%); margin:0 auto; padding:28px 0 42px; display:flex; justify-content:space-between; gap:20px; color:#3e5d7c; border-top:1px solid #173047; font-size:.74rem; letter-spacing:.04em; }
@media (max-width:680px) { .notice-overlay{padding:14px}.notice-dialog{max-height:calc(100vh - 28px);padding:28px 22px;border-radius:18px}.notice-copy p{font-size:.94rem}.page-shell{padding:0 16px;background-size:44px 44px,44px 44px,auto,auto}.hero{padding-top:48px}.brand{display:grid;gap:5px}.brand-en{font-size:4.8rem}.brand-cn{font-size:2.8rem}.feature-row{display:grid}.feature-pill{justify-content:center}.steps{margin-top:4px}.step b{display:none}.steps i{margin:0 8px}.work-card{padding:38px 22px 34px;border-radius:20px}.submit-row{align-items:flex-start;flex-direction:column}.submit-row button{width:100%;justify-content:center}.link-list li{grid-template-columns:1fr auto}.link-index{display:none}.link-actions button,.link-actions a{width:34px}footer{flex-direction:column} }
@media (prefers-reduced-motion:no-preference) { .hero{animation:rise .6s ease-out both}.steps,.work-card{animation:rise .65s .08s ease-out both}@keyframes rise{from{opacity:0;transform:translateY(15px)}} }