:root{font-family:Arial,Noto Sans TC,Microsoft JhengHei,sans-serif;color:#f5f5f5;background:#030303;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:linear-gradient(133deg,transparent 20%,#ffffff04 20.1%,transparent 42%),linear-gradient(46deg,#161616 0,transparent 18%,#000 48%,#141414 48.1%,#030303 62%,#000 80%);background-size:100% 950px;min-height:100vh}button,input{font:inherit}button{cursor:pointer;padding:0;border:0;background:none;color:inherit}button:disabled{cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #fff;outline-offset:5px}button:not(:disabled):hover{filter:brightness(1.14)}.page{max-width:942px;margin:auto;padding:48px 31px 44px}.header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 13px 44px 21px}.header h1{margin:0;width:337px;max-width:55%;line-height:0}.header h1 img{width:100%;height:auto}.client-logo{width:246px;max-width:30%;height:auto}main{width:100%}.upload-card{margin:0;padding:36px 44px 34px;border:1px solid #696969;border-radius:25px;background:linear-gradient(125deg,#ffffff07,transparent 35%),linear-gradient(#151515cc,#060606ed 22%,#080808ef);box-shadow:inset 0 0 35px #ffffff03}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid #737373;padding-bottom:24px;margin-bottom:32px}.card-heading h2{font-size:38px;line-height:1.35;margin:0;font-weight:600;letter-spacing:-1px}.card-number{white-space:nowrap;font-size:28px;font-weight:400}.card-number span{color:#bcbcbc}.preview{position:relative;width:100%;aspect-ratio:790/480;background:linear-gradient(135deg,#191919,#101010 45%,#080808);display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:14px}.preview-border{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}.preview-border rect{width:calc(100% - 2px);height:calc(100% - 2px);fill:none;stroke:#a0a0a0;stroke-width:1px;stroke-dasharray:4px 3px;stroke-linecap:butt;vector-effect:non-scaling-stroke}.selected-photo{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;min-height:0}.empty-preview{text-align:center;width:100%;padding:30px 12px}.photo-icon{display:block;width:25%;max-width:196px;height:auto;margin:0 auto 27px}.empty-preview h3{font-size:30px;line-height:1.45;margin:0 0 25px;font-weight:600}.empty-preview h3 span{font-weight:400}.empty-preview p{font-size:24px;line-height:1.45;color:#c7c7c7;margin:0}.choose-buttons{display:grid;grid-template-columns:432fr 341fr;gap:16px;margin-top:27px}.choose-buttons button{min-width:0;border-radius:18px}.choose-buttons img{width:100%;height:auto;display:block}.choose-buttons button:disabled{opacity:.55}.field{margin-top:34px}.field label{display:block;font-size:25px;line-height:1.4;font-weight:600;margin-bottom:15px}.field label span{margin-left:8px}.input-wrap{display:flex;align-items:center;gap:28px;min-height:84px;border:1px solid #aaa;border-radius:16px;background:linear-gradient(120deg,#ffffff04,#111);padding:13px 26px}.input-wrap>img{width:47px;height:47px;flex-shrink:0}.input-wrap input{width:100%;min-width:0;border:0;background:transparent;color:#fff;padding:8px 0;font-size:23px;line-height:1.4;border-radius:3px}.input-wrap input::placeholder{color:#bcbcbc;opacity:1}.input-wrap:focus-within{border-color:#fff;box-shadow:0 0 0 1px #fff}.input-wrap input:focus-visible{outline:none}.input-wrap:has([aria-invalid=true]){border-color:#ff9e9e}.format-note{display:flex;gap:28px;align-items:center;margin:34px 0 24px}.format-note img{width:49px;height:56px;flex-shrink:0}.format-note p{font-size:20px;line-height:1.6;margin:0;color:#e0e0e0}.upload-footer{border-top:1px solid #444;padding-top:24px}.upload{display:block;width:calc(100% + 26px);margin-left:-13px;border-radius:24px;min-height:70px}.upload img{display:block;width:100%;height:auto}.upload>span{display:block;padding:30px 16px;background:#e8e8ea;color:#111;border-radius:22px;font-size:24px}.upload:disabled img{filter:brightness(.92)}.file-info{display:flex;justify-content:space-between;gap:16px;font-size:14px;margin-top:12px;color:#ccc}.file-info span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-info small{white-space:nowrap}.error,.success{padding:15px;border:1px solid #757575;border-radius:10px;font-size:16px;line-height:1.6;overflow-wrap:anywhere}.error{color:#ffc5c5;background:#391c1c}.success{background:#17221b}.success a{color:#fff}.progress-section{margin:18px 0;font-size:16px}.progress-track{height:6px;background:#444;border-radius:5px;overflow:hidden}.progress-track div{height:100%;background:#eee;transition:width .2s}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(max-width:700px){.page{padding:28px 18px}.header{margin:0 8px 28px;gap:20px}.upload-card{padding:24px 24px 26px;border-radius:20px}.card-heading{padding-bottom:18px;margin-bottom:22px}.card-heading h2{font-size:clamp(19px,4vw,28px);letter-spacing:-.4px}.card-number{font-size:20px}.empty-preview{padding:20px 10px}.photo-icon{margin-bottom:16px}.empty-preview h3{font-size:clamp(16px,3.3vw,25px);margin-bottom:16px}.empty-preview p{font-size:clamp(12px,2.6vw,19px)}.choose-buttons{gap:10px;margin-top:20px}.field{margin-top:25px}.field label{font-size:clamp(15px,3vw,22px);margin-bottom:12px}.input-wrap{gap:16px;padding:10px 16px;min-height:62px;border-radius:12px}.input-wrap>img{width:32px;height:32px}.input-wrap input{font-size:clamp(12px,2.5vw,18px)}.format-note{gap:16px;margin-top:26px}.format-note img{width:31px;height:auto}.format-note p{font-size:clamp(11px,2.2vw,16px)}.upload{width:100%;margin-left:0;min-height:0}.upload-footer{padding-top:20px}}@media(max-width:400px){.page{padding:22px 12px}.upload-card{padding:20px 16px}.card-number{font-size:16px}.input-wrap{padding:10px;gap:10px}.input-wrap>img{width:27px;height:27px}.empty-preview h3{font-size:15px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}