@import url('./tokens.css');
*{box-sizing:border-box}html{background:#dce5f1;scroll-behavior:auto}body{margin:0;color:var(--ink);font:var(--text-body)/1.65 var(--font);-webkit-tap-highlight-color:transparent}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;border:0;background:none;color:inherit}a{color:inherit;text-underline-offset:4px}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #146ca4;outline-offset:4px}h1,h2,h3,p{margin:0}h1{font-size:var(--text-display);line-height:1.22;letter-spacing:-.035em;font-weight:750}h2{font-size:20px;line-height:1.4}h3{font-size:var(--text-body)}svg.lucide{width:22px;height:22px;stroke-width:1.8;flex-shrink:0}.app{position:relative;max-width:var(--mobile-max);min-height:100dvh;margin:auto;background:var(--canvas);overflow-x:clip}.topbar{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;padding:calc(12px + env(safe-area-inset-top,0px)) 20px 8px;min-height:76px;background:transparent}.brand{font-size:15px;font-weight:700;letter-spacing:.04em;display:flex;align-items:center;gap:8px}.brand-dot{width:9px;height:9px;border-radius:50%;background:var(--jade)}.eyebrow{font-size:11px;letter-spacing:.15em;font-weight:650;text-transform:uppercase}.muted{color:var(--muted)}.small{font-size:var(--text-sm)}.caption{font-size:var(--text-xs)}.icon-button{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0}.avatar{background:#ffffff23;border:1px solid #ffffff5c;font-size:15px;font-weight:700;width:42px;height:42px}.screen{padding-bottom:calc(104px + var(--safe-bottom));min-height:calc(100dvh - 76px)}.page-head{padding:14px 24px 26px}.page-head p{margin-top:10px;color:var(--muted);font-size:14px}.page-head .eyebrow{margin-bottom:10px;color:var(--brand-blue)}.inset{margin-left:24px;margin-right:24px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.section-head a,.text-button{font-size:13px;min-height:44px;display:inline-flex;align-items:center;text-decoration:none}.section-head h2{font-size:18px}.home-theme{background:linear-gradient(160deg,var(--brand-blue) 0%,#205191 38%,var(--brand-indigo) 80%);color:white}.home-theme .topbar{color:white}.home-theme .screen{background:none}.home-head{padding:16px 28px 0}.home-head .eyebrow{color:#c7e1fa;margin-bottom:12px}.home-head h1{font-size:36px;line-height:1.3}.home-head h1 span{display:block}.home-head p{color:#dbe9fb;font-size:14px;margin-top:12px}.home-head .yellow-dot{display:inline-block;background:var(--accent);width:9px;height:9px;border-radius:50%;vertical-align:middle;margin-left:8px}.hero-carousel{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:20px;padding:118px 52px 26px;scroll-padding-inline:52px;scrollbar-width:none;overscroll-behavior-inline:contain}.hero-carousel::-webkit-scrollbar{display:none}.hero-card{position:relative;flex:0 0 100%;min-width:0;scroll-snap-align:center;color:var(--ink);background:var(--surface);border-radius:var(--radius-card);padding:98px 24px 28px;box-shadow:var(--shadow-card);text-align:left;min-height:282px}.hero-art{position:absolute;width:222px;height:222px;object-fit:contain;top:-121px;left:50%;transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 14px 8px #16375220)}.hero-card[data-site="安平"] .hero-art{filter:hue-rotate(28deg) drop-shadow(0 14px 8px #16375220)}.hero-card[data-site="永華"] .hero-art{filter:hue-rotate(-18deg) drop-shadow(0 14px 8px #16375220)}.hero-card .index{position:absolute;right:20px;top:94px;font-size:74px;font-weight:800;color:#e9ebf0;line-height:1;pointer-events:none}.hero-card h2{font-size:29px;position:relative;letter-spacing:-.03em;margin:7px 0}.hero-card p{position:relative;color:var(--muted);font-size:14px;max-width:170px}.hero-card .badge{position:relative}.hero-card .card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:20px}.round-cta{display:inline-flex;align-items:center;justify-content:center;background:var(--accent);color:var(--ink);border-radius:50%;width:50px;height:50px;box-shadow:0 4px 12px #b89f2524}.round-cta svg{width:23px}.badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:650;line-height:1.4;padding:5px 9px;border-radius:var(--radius-pill);background:#e8edf4;color:#415c75}.badge.green{color:#166446;background:#e1f4eb}.badge.yellow{background:#fff3bd;color:#675313}.badge.error{color:var(--error);background:#ffe6e3}.carousel-controls{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:-10px;margin-bottom:12px}.carousel-controls button{width:44px;height:44px;display:grid;place-items:center}.carousel-controls button:before{content:"";width:6px;height:6px;border-radius:20px;background:#ffffff66}.carousel-controls button.active:before{width:20px;background:var(--accent)}.surface{border-radius:var(--radius-card);background:white;color:var(--ink);padding:20px;box-shadow:var(--shadow-float)}.home-bottom{padding:0 20px}.home-bottom .section-head{margin-bottom:4px}.home-tools{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.quick-tool{color:white;background:#ffffff13;border:1px solid #ffffff24;min-height:96px;padding:16px;border-radius:20px;text-align:left;display:flex;flex-direction:column;gap:10px;font-size:14px}.quick-tool svg{color:var(--accent)}.prototype-note{font-size:11px;color:#d3def5;text-align:center;margin:24px 0 0}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:var(--mobile-max);padding:10px 12px calc(10px + var(--safe-bottom));background:#fff;box-shadow:0 -1px 0 #172b4910;display:flex;z-index:10}.bottom-nav button{flex:1;min-width:0;min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#647589;border-radius:16px;font-size:10px;font-weight:650}.bottom-nav button.active{color:var(--brand-indigo);background:#eef0fa}.bottom-nav button.active svg{stroke-width:2.4}.bottom-nav button:active,.primary:active,.icon-button:active{transform:scale(.96)}.primary,.secondary{display:inline-flex;min-height:var(--touch);align-items:center;justify-content:center;gap:8px;border-radius:var(--radius-sm);padding:12px 18px;font-size:14px;font-weight:650;text-decoration:none}.primary{background:var(--brand-indigo);color:white}.primary.sun{background:var(--accent);color:var(--ink)}.secondary{border:1px solid var(--line);background:white;color:var(--ink)}.full{width:100%}.search{display:flex;align-items:center;gap:10px;background:white;border:1px solid var(--line);border-radius:16px;padding:0 14px;margin:0 24px 16px}.search input{min-width:0;width:100%;min-height:52px;border:0;outline:none;background:transparent;color:var(--ink);font-size:16px}.search:focus-within{outline:3px solid #a8cce6;outline-offset:2px}.search svg{width:20px;color:var(--muted)}.segmented{display:flex;gap:4px;padding:4px;border-radius:16px;background:#e6eaf3;margin:0 24px 20px}.segmented button{flex:1;border-radius:12px;min-height:44px;font-size:14px;white-space:nowrap}.segmented button.active{background:white;color:var(--brand-indigo);font-weight:700;box-shadow:0 2px 6px #182a510a}.list{background:white;border-radius:24px;overflow:hidden}.file-row{display:flex;align-items:center;gap:4px;padding:12px 12px 12px 16px;border-bottom:1px solid #edf0f6}.file-row:last-child{border:0}.file-open{display:flex;gap:12px;align-items:center;text-align:left;min-width:0;flex:1;padding:4px 0;min-height:56px}.file-symbol{width:40px;height:48px;border-radius:12px;flex-shrink:0;display:grid;place-items:center;background:#edf1fd;color:#586db1}.file-symbol.guide{background:#e4f4ed;color:#257254}.file-symbol.form{background:#fff3d8;color:#936919}.file-copy{min-width:0;flex:1}.file-name{font-size:14px;font-weight:650;line-height:1.45;display:block;overflow-wrap:anywhere}.file-sub{font-size:11px;display:block;color:var(--muted);margin-top:5px}.favorite{color:#73839a}.favorite.selected{color:#a87600}.favorite.selected svg{fill:var(--accent);stroke:#a87600}.source-note{display:flex;gap:8px;color:var(--muted);font-size:12px;margin:18px 24px}.source-note svg{width:16px;min-width:16px}.empty{padding:36px 22px;text-align:center}.empty .state-icon{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;background:#edf0fa;color:#6a71a6;margin:0 auto 18px}.empty h2{font-size:18px}.empty p{font-size:14px;color:var(--muted);margin:10px 0 22px}.empty .secondary{margin-top:10px}.tool-tile{display:flex;align-items:center;text-align:left;gap:16px;width:100%;padding:20px;border-radius:24px;background:white;margin-bottom:12px}.tool-tile .tool-symbol{width:56px;height:56px;background:#e9f0fd;color:var(--brand-blue);border-radius:18px;display:grid;place-items:center;flex-shrink:0}.tool-tile:nth-child(2) .tool-symbol{background:#fff3c7;color:#946b00}.tool-tile span:nth-child(2){flex:1}.tool-tile strong{font-size:17px;display:block}.tool-tile small{font-size:12px;color:var(--muted);display:block;margin-top:5px}.field{display:block;margin:18px 0;font-size:14px;font-weight:600}.field input,.field select{display:block;width:100%;min-height:52px;margin-top:8px;border:1px solid var(--line);border-radius:12px;background:white;color:var(--ink);padding:10px 14px;font-size:16px}.field input:invalid:not(:placeholder-shown){border-color:var(--line)}.result{padding:24px;background:#eaf1fa;border-radius:24px;margin-top:20px}.result strong{display:block;font-size:30px;line-height:1.3;margin:8px 0;font-weight:750;letter-spacing:-.03em}.result .error{font-size:14px;line-height:1.65;color:var(--error)}.tool-disclaimer{font-size:12px;color:var(--muted);margin-top:18px}.read-head{position:relative;padding:10px 24px 26px}.read-head h1{font-size:29px;margin:16px 0 12px;line-height:1.4}.read-head .badge{margin-right:6px}.document{margin:0 20px;background:white;border-radius:24px;padding:26px 24px;box-shadow:0 3px 12px #23345707}.document ol{padding-left:24px;margin:20px 0}.document li{padding:10px 0 10px 4px;border-bottom:1px solid #edf0f6;font-size:16px}.document .stamp{letter-spacing:.1em;color:var(--muted);font-size:10px}.document p{color:var(--muted);font-size:13px}.preview-actions{display:flex;gap:10px;margin:20px}.preview-actions .primary{flex:1}.preview-actions .secondary{padding:12px;width:54px}.settings-card{margin:0 24px 16px;background:white;border-radius:24px;padding:20px}.settings-row{padding:14px 0;border-bottom:1px solid var(--line)}.settings-row:last-child{border:0}.settings-row p{font-size:12px;color:var(--muted);margin:6px 0 10px}.settings-row select{font-size:16px;min-height:48px;width:100%;padding:8px;border:1px solid var(--line);border-radius:10px;background:white;color:var(--ink)}.status{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--success)}.status:before{content:"";display:inline-block;width:7px;height:7px;background:var(--jade);border-radius:50%}.toast{position:fixed;z-index:30;bottom:calc(100px + var(--safe-bottom));left:50%;transform:translateX(-50%);max-width:min(380px,calc(100% - 40px));width:max-content;background:#142e49;color:white;padding:12px 18px;border-radius:16px;font-size:13px;box-shadow:var(--shadow-card);pointer-events:none}.toast:empty{display:none}.skip{position:absolute;left:-9999px}.skip:focus{left:20px;top:20px;z-index:100;background:white;color:var(--ink);padding:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.route-layer:focus{outline:none}.spec-theme{background:var(--canvas)}.spec-nav{display:flex;position:sticky;top:0;z-index:5;overflow:auto;gap:6px;background:var(--canvas);padding:10px 20px;scrollbar-width:none;border-bottom:1px solid var(--line)}.spec-nav a{min-height:44px;display:inline-flex;align-items:center;font-size:12px;text-decoration:none;padding:8px 12px;white-space:nowrap;background:white;border-radius:12px}.spec-section{padding:28px 24px;scroll-margin-top:72px}.spec-section+.spec-section{border-top:1px solid var(--line)}.spec-section h2{font-size:23px;margin-bottom:14px}.spec-section h3{margin:24px 0 8px}.spec-section p,.spec-section li{font-size:14px;color:var(--muted)}.spec-section ul,.spec-section ol{padding-left:20px}.spec-section li{margin-bottom:10px}.reference{display:block;width:100%;height:auto;border-radius:20px;margin:18px 0}.spec-section code{font-size:11px;overflow-wrap:anywhere}.swatches{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.swatch{background:white;border:1px solid var(--line);border-radius:16px;overflow:hidden}.swatch b{display:block;height:66px;background:var(--swatch)}.swatch div{padding:10px 12px;font-size:12px}.spec-preview{margin:16px 0;padding:20px;background:white;border-radius:24px;border:1px solid var(--line)}.spec-preview .file-row{padding-left:0;padding-right:0}.spec-preview .segmented{margin:16px 0}.spec-preview .field{margin:0 0 18px}.token-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.token-row span:last-child{font-size:12px;color:var(--muted)}.motion-stage{overflow:hidden;border:1px solid var(--line);border-radius:24px;background:white;min-height:210px;padding:24px}.motion-stage h3{margin-top:0}.button-row{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.spec-footer{padding:28px 24px 48px;font-size:12px;color:var(--muted)}.spec-section .hero-card{margin:135px 24px 24px}.dark-demo{background:linear-gradient(160deg,var(--brand-blue),var(--brand-indigo));padding:1px 0 8px;border-radius:24px;margin-top:20px}.error-message{color:var(--error);font-size:12px;margin-top:6px}.chips{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.progress-dots{font-size:12px;color:var(--muted)}
@media(min-width:481px){.app{box-shadow:0 0 70px #1e365a20}}@media(max-width:350px){.home-head h1{font-size:31px}.hero-carousel{padding-left:38px;padding-right:38px;scroll-padding-inline:38px}.hero-card{padding-left:20px;padding-right:20px}.hero-art{width:202px;height:202px;top:-111px}.inset{margin-left:20px;margin-right:20px}.page-head{padding-left:20px;padding-right:20px}.hero-card h2{font-size:26px}.home-tools{gap:8px}.quick-tool{padding:12px}.preview-actions{gap:8px}.swatches{gap:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.avatar{width:48px;height:48px}.field input[aria-invalid=true]{border-color:var(--error);outline-color:var(--error)}.spec-preview .error-message{color:var(--error)}
.home-theme .topbar{min-height:64px;padding-top:calc(8px + env(safe-area-inset-top,0px));padding-bottom:4px}.home-head{padding:8px 24px 0}.home-head .eyebrow{margin-bottom:8px}.home-head h1{font-size:34px;line-height:1.22}.home-head p{margin-top:8px}.hero-carousel{padding-top:106px;padding-bottom:16px}.hero-card{padding-top:84px;padding-bottom:20px;min-height:274px}.hero-art{width:206px;height:206px;top:-109px}.hero-card .index{top:84px}.hero-card .card-footer{margin-top:12px}@media(max-width:350px){.home-head h1{font-size:31px}.hero-card h2{font-size:26px}}