@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700;800&display=swap');
:root{font-family:'Noto Sans TC',system-ui,-apple-system,sans-serif;color:#203b43;background:#f5f9f8;font-synthesis:none;--navy:#123c49;--deep:#0b3039;--teal:#18a997;--mint:#e9f8f4;--line:#e0ecea;--muted:#69808a;--white:#fff;--amber:#e3a642}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #57c6b9;outline-offset:2px}.shell{min-height:100vh}.top{height:74px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(4vw,22px);position:sticky;top:0;z-index:30}.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:23px;color:var(--navy);letter-spacing:.05em}.brand-mark{height:39px;width:39px;border-radius:12px;background:var(--navy);display:grid;place-items:center}.brand-mark svg{width:26px;height:26px}.brand small{font-size:10px;display:block;color:#7a9197;letter-spacing:.18em;font-weight:600}.top-actions,.row{display:flex;align-items:center;gap:12px}.top-links{display:flex;align-items:center;gap:8px}.top-links button{background:transparent;border:0;color:#526c74;padding:10px 13px;font-size:13px;border-radius:9px}.top-links button:hover,.top-links button.active{background:#e9f8f4;color:#097d71}.pill{font-size:11px;padding:5px 9px;border-radius:100px;background:#e8f6f3;color:#128d7d;font-weight:700}.btn{border:0;border-radius:10px;padding:12px 20px;background:var(--navy);color:white;font-weight:700;box-shadow:0 5px 14px #123c4910;transition:.2s;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn:hover{filter:brightness(1.13);transform:translateY(-1px)}.btn.teal{background:var(--teal)}.btn.ghost{border:1px solid #beddd7;background:white;color:var(--navy);box-shadow:none}.btn.tiny{padding:9px 13px;font-size:12px}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.content{max-width:1230px;margin:auto;padding:38px 30px 70px}.muted{color:var(--muted)}.kicker{font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--teal)}h1,h2,h3,p{margin-top:0}h1{font-size:38px;line-height:1.35;letter-spacing:-.035em;color:var(--navy)}h2{font-size:25px;color:var(--navy);letter-spacing:-.02em}h3{font-size:17px;color:var(--navy)}p{line-height:1.85}.intro{max-width:680px;font-size:15px;color:#667d84}.hero{min-height:480px;background:#f7fbfa;border-radius:22px;overflow:hidden;display:grid;grid-template-columns:51% 49%;box-shadow:0 8px 38px #123c4909;border:1px solid #e6efed}.hero-copy{padding:68px 0 55px 65px;z-index:1}.hero h1{font-size:48px;line-height:1.37;margin:18px 0}.hero h1 em{color:#149f91;font-style:normal}.hero p{font-size:16px;max-width:425px;color:#607e85}.hero-image{background:url('assets/hero.png') center 32%/cover no-repeat;position:relative}.hero-image:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#f7fbfa 0%,transparent 42%)}.section{margin-top:50px}.feature-grid,.stats-grid,.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature,.panel,.stat,.task,.screen-card{background:white;border:1px solid var(--line);border-radius:16px;padding:25px;box-shadow:0 3px 18px #173f4105}.feature{border-top:3px solid var(--teal);min-height:180px}.feature-num{font-size:12px;font-weight:800;color:var(--teal);margin-bottom:21px}.feature p,.screen-card p{font-size:13px;color:var(--muted);margin:0}.heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:23px}.heading h1{font-size:32px;margin-bottom:5px}.heading p{font-size:13px;margin:0}.soft-banner{padding:17px 20px;border:1px solid #cfece6;border-radius:12px;background:#ecf9f5;color:#32675f;font-size:13px;margin:25px 0}.layout{display:grid;grid-template-columns:225px minmax(0,1fr);min-height:calc(100vh - 74px)}.side{background:#fff;border-right:1px solid var(--line);padding:29px 15px;position:sticky;top:74px;height:calc(100vh - 74px);overflow-y:auto}.side-title{font-size:11px;color:#82979d;font-weight:700;padding:10px 14px;margin-bottom:4px}.side button{border:0;background:transparent;text-align:left;width:100%;padding:13px 15px;color:#567079;border-radius:9px;font-size:13px;margin:2px 0;display:flex;gap:10px;align-items:center}.side button:hover,.side button.active{background:#e9f7f4;color:#087f75;font-weight:800}.side .divider{height:1px;background:var(--line);margin:20px 10px}.admin{max-width:none;padding:35px 45px 75px}.stat{padding:23px}.stat b{font-size:32px;letter-spacing:-.04em;color:var(--navy);display:block;margin:12px 0 8px}.stat small{font-size:11px;color:#768d94}.stat label{font-size:13px;font-weight:700;color:#5b737b}.chart{height:165px;display:flex;align-items:flex-end;gap:14px;padding:12px 8px 0;border-bottom:1px solid #e6edeb}.bar{flex:1;border-radius:5px 5px 0 0;background:linear-gradient(180deg,#28bca8,#c3efe5)}.chart-label{display:flex;justify-content:space-between;padding-top:8px;color:#91a0a5;font-size:11px}.grid-two{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse;text-align:left;font-size:13px;white-space:nowrap}.table th{color:#8b9da2;font-size:12px;font-weight:600;padding:13px;border-bottom:1px solid var(--line)}.table td{padding:17px 13px;border-bottom:1px solid #f0f4f2;color:#38565e}.table tr:last-child td{border-bottom:0}.tag{padding:5px 9px;border-radius:7px;background:#e9f8f3;color:#138d7b;font-size:11px;font-weight:800}.tag.grey{background:#eef3f4;color:#617980}.tag.orange{background:#fff3df;color:#a87621}.screen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.screen-card{display:flex;flex-direction:column;align-items:flex-start;min-height:168px}.screen-card .ico{font-size:23px;color:var(--teal);height:43px}.screen-card .link{font-size:12px;color:var(--teal);font-weight:700;margin-top:auto}.form-card{max-width:660px;margin:0 auto}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.field{display:flex;flex-direction:column;gap:8px;margin:12px 0}.field label{color:#526a72;font-size:12px;font-weight:700}.field input,.field textarea,.field select{border:1px solid #d8e7e4;background:#fbfdfc;padding:12px 13px;border-radius:9px;color:#294852;min-width:0;width:100%}.field textarea{min-height:94px;resize:vertical}.field input:disabled{background:#f2f6f5;color:#94a4a8}.notice{background:#fff9eb;color:#826728;border:1px solid #f1e2b7;padding:13px 16px;border-radius:10px;font-size:12px;line-height:1.8}.person{display:flex;align-items:center;gap:12px}.avatar{width:45px;height:45px;border-radius:50%;display:grid;place-items:center;background:#d8f4ed;color:#168e7e;font-weight:800}.empty{padding:50px;text-align:center;color:#81969b}.foot{padding:30px 5vw;background:#113a46;color:#bdd2d2;font-size:12px;display:flex;justify-content:space-between;gap:15px}.mobile-menu{display:none}.mobile-backdrop{display:none}.progress{background:#dfeeea;height:9px;border-radius:20px;overflow:hidden}.progress span{height:100%;background:#22b49c;display:block}.times{display:flex;gap:10px;flex-wrap:wrap}.times button{border:1px solid var(--line);padding:11px 16px;background:white;color:#48656b;border-radius:8px}.times button.selected{background:var(--navy);color:white}.steps{display:flex;gap:8px;align-items:center;margin:28px 0}.steps span{display:block;height:5px;background:#dcece7;flex:1;border-radius:4px}.steps span.done{background:#32b6a3}.big-callout{background:var(--navy);color:white;border-radius:17px;padding:26px 30px}.big-callout h3{color:white}.big-callout p{color:#c8e1df;font-size:13px}.admin-placeholder{height:250px;border:1px dashed #c5ded7;border-radius:14px;display:grid;place-items:center;color:#78918f;background:#f8fbfa}.nav-toggle{display:flex;gap:8px}.nav-toggle button{padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:white;color:#607981;font-size:12px}.nav-toggle button.active{background:var(--navy);color:white}.mobile-bottom{display:none}@media(max-width:1020px){.top-links{display:none}.grid-two{grid-template-columns:1fr}.feature-grid{grid-template-columns:repeat(2,1fr)}.hero-copy{padding:55px 18px 45px 38px}.hero h1{font-size:37px}.admin{padding:30px}.screen-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.top{height:66px;padding:0 16px}.brand{font-size:20px}.top-actions .pill{display:none}.top-actions .btn{padding:10px 12px;font-size:12px}.content,.admin{padding:24px 18px 90px}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:38px 27px 30px}.hero h1{font-size:34px}.hero-image{height:255px;order:-1;background-position:center 28%}.hero-image:before{background:linear-gradient(0deg,#f7fbfa 0%,transparent 48%)}.feature-grid,.screen-grid,.stats-grid{grid-template-columns:1fr}.heading{align-items:flex-start;flex-direction:column}.heading h1{font-size:27px}.layout{display:block}.side{display:none;position:fixed;z-index:40;top:66px;left:0;width:260px;height:calc(100vh - 66px);box-shadow:8px 8px 30px #123c4922}.side.open{display:block}.mobile-menu{display:block;background:transparent;border:0;font-size:23px;color:var(--navy);margin-right:5px}.mobile-backdrop.show{display:block;position:fixed;inset:66px 0 0;background:#123c4944;z-index:39}.brand small{font-size:9px}.form-grid{grid-template-columns:1fr}.foot{flex-direction:column}.mobile-bottom{display:flex;position:fixed;bottom:0;left:0;right:0;background:white;border-top:1px solid var(--line);height:63px;z-index:28;justify-content:space-around}.mobile-bottom button{border:0;background:white;color:#68828a;font-size:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.mobile-bottom button.active{color:#0e9485;font-weight:800}.nav-toggle{flex-wrap:wrap}.panel,.feature{padding:20px}}
