:root{--ink:#17212b;--muted:#6e7880;--paper:#f3f0e8;--line:#dbd7cb;--accent:#df5f38;--white:#fffdf7;--green:#2f745d}
*{box-sizing:border-box}html{font-family:"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif;color:var(--ink);background:var(--paper)}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.eyebrow,.index{font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--accent)}h1,h2,p{margin-top:0}h1,h2{font-family:"Iowan Old Style","Songti TC",Georgia,serif;letter-spacing:-.03em}h1 em{font-weight:400;color:var(--accent)}.primary,.outline{min-height:44px;border-radius:5px;padding:10px 18px;font-weight:700}.primary{background:var(--ink);color:#fff;border:1px solid var(--ink)}.primary:hover{background:#33414a}.outline{background:transparent;border:1px solid var(--line);color:var(--ink)}.outline:hover{border-color:var(--ink)}.text-button{background:none;border:0;color:var(--accent);padding:6px 0;font-weight:700;text-align:left}.error{color:#a42d24;font-size:13px}.shell{min-height:100dvh}.auth-panel{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);min-height:100dvh}.auth-intro{background:var(--ink);color:var(--white);padding:clamp(32px,7vw,100px);display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.auth-intro:after{content:"✳";position:absolute;font-size:44rem;line-height:1;right:-14rem;bottom:-26rem;color:#ffffff08;pointer-events:none}.auth-intro h1{font-size:clamp(3rem,6vw,6rem);line-height:1.08;margin:28px 0}.auth-intro p{max-width:28rem;color:#ccd1cc;line-height:1.85}.auth-form{width:min(420px,calc(100% - 48px));margin:auto;display:grid;gap:22px}.form-top{border-bottom:1px solid var(--line);padding-bottom:22px}.form-top h2{font-size:2.2rem;margin:10px 0 0}label{display:grid;gap:9px;font-size:13px;font-weight:700}input:not([type=checkbox]),textarea{width:100%;background:var(--white);border:1px solid var(--line);border-radius:5px;padding:13px 14px;color:var(--ink);outline:none}input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #df5f3826}.workspace{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100dvh}.rail{background:var(--ink);color:var(--white);padding:24px 19px;display:flex;flex-direction:column;gap:52px}.brand{display:flex;align-items:center;gap:12px;padding:5px}.brand-mark{background:var(--accent);width:38px;height:38px;display:grid;place-items:center;font-family:"Songti TC",serif;font-size:25px}.brand strong,.brand small{display:block}.brand strong{letter-spacing:.12em}.brand small{font-size:11px;color:#9fa9ab;margin-top:3px}.rail-content{flex:1}.rail-content .eyebrow{display:block;margin:0 0 17px 13px}.rail nav{display:grid;gap:5px}.rail nav button{border:0;background:transparent;color:#b6bfc1;text-align:left;padding:11px 14px;border-radius:5px;display:flex;justify-content:space-between}.rail nav button:hover,.rail nav button.active{background:#ffffff13;color:#fff}.rail nav button.active{border-left:3px solid var(--accent)}.rail-note{margin-top:60px;padding:18px 13px;border-top:1px solid #ffffff25;color:#a8b3b5}.rail-note span{font-size:28px;color:var(--accent)}.rail-note p{line-height:1.7;margin:8px 0}.account{border-top:1px solid #ffffff25;padding:17px 5px 0;overflow-wrap:anywhere}.account span{font-size:12px;color:#c1c9c9;display:block;margin-bottom:8px}.main-panel{padding:clamp(24px,4vw,62px);max-width:1400px;width:100%;margin:auto}.topbar{display:flex;align-items:start;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:32px}.topbar h1{font-size:clamp(2rem,4vw,3.9rem);line-height:1.2;margin:12px 0 0}.sync-status{font-size:12px;color:var(--green);white-space:nowrap;padding-top:5px}.sync-status.offline{color:#a3452b}.toolbar{display:flex;gap:14px;margin:35px 0 29px}.search{position:relative;flex:1}.search span[aria-hidden]{position:absolute;left:15px;top:9px;font-size:27px;font-weight:400;color:var(--muted)}.search input{padding-left:46px;min-height:46px}.list-heading{display:flex;gap:14px;align-items:baseline;margin-bottom:14px;font-size:13px;font-weight:800;letter-spacing:.08em}.list-heading span:last-child{font-weight:400;color:var(--muted)}.snippets{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.card{background:var(--white);border:1px solid var(--line);border-radius:7px;padding:21px;min-height:197px;display:flex;flex-direction:column;gap:13px;transition:transform .16s,box-shadow .16s}.card:hover{transform:translateY(-2px);box-shadow:0 10px 25px #17212b0d}.card-top{display:flex;justify-content:space-between;gap:8px}.tag{font-size:10px;font-weight:800;color:var(--accent);letter-spacing:.09em}.star{color:var(--accent)}.card h2{font-size:1.3rem;margin:0}.preview{font-size:13px;color:#59646a;white-space:pre-line;line-height:1.65;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0}.card-actions{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:13px;border-top:1px solid var(--line)}.card-actions button{background:none;border:0;padding:5px;color:var(--ink);font-weight:700;font-size:12px}.card-actions .copy{color:var(--accent)}.empty{text-align:center;padding:70px 15px;color:var(--muted)}.empty span{font-size:47px;color:var(--accent)}.empty h2{color:var(--ink);margin:16px 0 10px}dialog{border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);padding:0;width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px)}dialog::backdrop{background:#17212bb0}dialog form{padding:27px;display:grid;gap:18px;overflow:auto;max-height:calc(100dvh - 24px)}.dialog-head{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid var(--line);padding-bottom:14px}.dialog-head h2{font-size:1.9rem;margin:8px 0 0}.icon-button{background:none;border:0;font-size:30px;line-height:1}.check{display:flex;align-items:center;gap:9px}.check input{accent-color:var(--accent);width:17px;height:17px}.dialog-actions{display:flex;gap:8px;align-items:center}.dialog-actions span{flex:1}.danger{background:none;border:0;color:#a42d24;font-weight:700;padding:10px 0}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;padding:13px 18px;border-radius:5px;box-shadow:0 9px 28px #17212b2e;max-width:calc(100vw - 24px);font-size:13px;z-index:20}.toast button{color:#ffcaa9;border:0;background:none;margin-left:12px;font-weight:700}
@media(max-width:760px){.auth-panel{grid-template-columns:1fr}.auth-intro{min-height:32dvh;padding:34px 26px}.auth-intro h1{font-size:2.8rem;margin:13px 0}.auth-intro p{margin-bottom:0;font-size:13px}.auth-form{margin:35px auto 55px}.workspace{grid-template-columns:1fr}.rail{padding:13px 20px;gap:0}.brand{padding:0}.rail-content{margin-top:14px}.rail-content .eyebrow,.rail-note{display:none}.rail nav{display:flex;overflow-x:auto}.rail nav button{white-space:nowrap}.account{position:absolute;right:20px;top:8px;text-align:right;border:0;padding:0;max-width:38%}.account span{font-size:10px}.account button{font-size:11px}.main-panel{padding:25px 18px}.topbar{padding-bottom:23px}.topbar h1{font-size:2rem}.sync-status{position:absolute;right:20px;top:113px;font-size:10px}.toolbar{margin:25px 0 20px;flex-direction:column}.snippets{grid-template-columns:1fr}.card{min-height:160px}}
@media(prefers-reduced-motion:reduce){.card{transition:none}}
.rail .mode-nav{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:28px;padding:4px;background:#ffffff0d;border:1px solid #ffffff20;border-radius:7px}.rail .mode-nav button{justify-content:center;text-align:center;padding:10px 7px;font-weight:700}.rail .mode-nav button.active{background:var(--accent);border:0;color:#fff}.training-intro{display:flex;justify-content:space-between;align-items:start;gap:20px;margin:28px 0;color:var(--muted);line-height:1.7}.training-intro p{max-width:610px;margin:0}.training-intro strong{white-space:nowrap;color:var(--ink);font-size:13px}.training-categories{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:9px;margin-bottom:32px}.training-category{padding:15px;text-align:left;background:var(--white);border:1px solid var(--line);border-radius:5px;color:var(--ink);font-weight:700}.training-category:hover,.training-category.active{border-color:var(--accent)}.training-category.active{background:#df5f3814;color:#a73d20}.training-questions{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:14px}.training-question{background:var(--white);border:1px solid var(--line);border-radius:7px;padding:22px}.training-question h2{font-size:1.3rem;line-height:1.45;margin:12px 0 20px}.training-question details{border-top:1px solid var(--line);padding-top:15px}.training-question summary{cursor:pointer;color:var(--accent);font-size:13px;font-weight:700}.training-question details p{white-space:pre-line;line-height:1.75;font-size:14px;margin:15px 0 0}
@media(max-width:760px){.rail .mode-nav{margin:15px 0 0}.training-intro{display:block}.training-intro strong{display:block;margin-top:10px}.training-categories,.training-questions{grid-template-columns:1fr}}
