.op-page{min-height:100vh;background:#e7eaf1;padding:24px 16px 72px;display:flex;flex-direction:column;align-items:center}.op-switcher{display:flex;align-items:center;gap:10px;margin-bottom:14px}.op-switcher-hint{font-size:12px;color:#8a93a8}.op-switcher-pills{display:flex;gap:4px;padding:3px;background:#ffffff;border:1px solid #dfe3ec;border-radius:999px;box-shadow:0 1px 4px #17203a0d}.op-switcher-pill{border:none;background:transparent;padding:5px 18px;font-size:12.5px;font-weight:600;color:#7d8699;border-radius:999px;cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease}.op-switcher-pill.is-active{background:#0a6cff;color:#fff;box-shadow:0 2px 8px #0a6cff59}.op-phone{width:100%;max-width:390px;background:#ffffff;border:1px solid #dde1ea;border-radius:28px;box-shadow:0 2px 6px #17203a0d,0 24px 64px #17203a1f;padding:22px 16px 18px}.op-m-profile{display:flex;gap:12px;align-items:flex-start}.op-m-avatar{width:52px;height:52px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:700;color:#fff;background:linear-gradient(135deg,#4d8dff 0%,#0a6cff 60%,#0047c2 100%);box-shadow:0 4px 12px #0a6cff47}.op-m-name-row{display:flex;align-items:center;gap:8px}.op-m-name{margin:0;font-size:18px;font-weight:800;letter-spacing:.5px;color:#17203a}.op-m-cert{font-size:10px;color:#0a6cff;background:rgba(10,108,255,.08);border:1px solid rgba(10,108,255,.22);border-radius:999px;padding:1px 7px;white-space:nowrap}.op-m-title{margin:3px 0 0;font-size:12.5px;font-weight:600;color:#3c465e}.op-m-bio{margin:3px 0 0;font-size:11.5px;line-height:1.6;color:#8a93a8}.op-m-divider{height:1px;background:#eef0f4;margin:16px 0 14px}.op-module-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.op-module-title-row{display:flex;align-items:center;gap:9px;min-width:0}.op-module-mark{width:30px;height:30px;flex:none;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#fff;background:linear-gradient(135deg,#3d7bff 0%,#0a6cff 100%);letter-spacing:.5px}.op-module-title{margin:0;font-size:14.5px;font-weight:800;color:#17203a}.op-module-sub{margin:2px 0 0;font-size:10.5px;color:#9aa2b5}.op-share-btn{display:inline-flex;align-items:center;gap:5px;flex:none;margin-top:1px;padding:6px 11px;font-size:11.5px;font-weight:600;color:#0a6cff;background:rgba(10,108,255,.07);border:1px solid rgba(10,108,255,.2);border-radius:999px;cursor:pointer;transition:background .15s ease}.op-share-btn:hover{background:rgba(10,108,255,.13)}.op-rows{display:flex;flex-direction:column;gap:9px}.op-row{border-radius:16px;border:1px solid #eceef3;background:#ffffff;overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease}.op-row:hover{border-color:#dfe4ee;box-shadow:0 6px 18px #17203a0f}.op-row.is-expanded{border-color:#dfe4ee;box-shadow:0 8px 22px #17203a14}.op-row-main{display:flex;align-items:center;gap:10px;width:100%;min-height:62px;padding:10px 14px;color:inherit;text-decoration:none;cursor:pointer;transition:background .15s ease}.op-row-main:hover{background:#f8f9fc}.op-row-badge{width:34px;height:34px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff}.op-row-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.op-row-platform{font-size:13px;font-weight:700;color:#2a3349;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.op-row-insight{font-size:11px;color:#9aa2b5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:baseline;gap:4px}.op-row-spark{font-size:9px;flex:none}.op-row-nums{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:1px}.op-row-value{font-size:20px;font-weight:800;line-height:1;letter-spacing:-.5px;font-variant-numeric:tabular-nums}.op-row-unit{font-size:12px;font-weight:700;margin-left:2px;letter-spacing:0}.op-row-metric{font-size:10.5px;color:#9aa2b5}.op-row-pill{font-size:11px;font-weight:600;color:#00a678;background:rgba(0,166,120,.1);border-radius:999px;padding:4px 10px}.op-row-chevron{flex:none;font-size:16px;color:#c3c9d6;transform:rotate(90deg);transition:transform .2s ease,color .15s ease;line-height:1;cursor:pointer;padding:6px 2px 6px 6px}.op-row-chevron:hover{color:#7d8699}.op-row-chevron.is-open{transform:rotate(-90deg)}.op-row-detail{padding:2px 14px 13px;animation:op-detail-in .25s ease}@keyframes op-detail-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.op-row-thumbs{display:flex;gap:7px}.op-row-thumb{flex:1;aspect-ratio:4 / 3;border-radius:8px;box-shadow:inset 0 0 0 1px #ffffff59}.op-row-detail-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px}.op-row-source{margin:0;font-size:10.5px;color:#b3b9c8}.op-row-visit{flex:none;font-size:11.5px;font-weight:600;color:#0a6cff;text-decoration:none}.op-row-visit:hover{text-decoration:underline}.op-row.is-entering{animation:op-row-enter .55s cubic-bezier(.22,1,.36,1)}@keyframes op-row-enter{0%{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.op-row.is-flashing{animation:op-row-flash 1.5s ease}@keyframes op-row-flash{0%,40%{border-color:#0a6cff;box-shadow:0 0 0 3px #0a6cff2e}to{border-color:#eceef3;box-shadow:none}}.op-add-row{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;min-height:56px;border:1.5px dashed #ccd2df;border-radius:16px;background:#fafbfc;font-size:13px;font-weight:600;color:#8a93a8;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease}.op-add-row:hover{border-color:#0a6cff;color:#0a6cff;background:rgba(10,108,255,.04)}.op-add-plus{font-size:16px;font-weight:500;line-height:1}.op-module-foot{margin:14px 0 0;text-align:center;font-size:10.5px;color:#b3b9c8}.op-sheet-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:rgba(23,32,58,.45);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:flex-end;justify-content:center;animation:op-fade-in .2s ease}@keyframes op-fade-in{0%{opacity:0}to{opacity:1}}.op-sheet{width:100%;max-width:390px;background:#ffffff;border-radius:20px 20px 0 0;padding:10px 22px 30px;animation:op-sheet-up .32s cubic-bezier(.22,1,.36,1)}@keyframes op-sheet-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.op-sheet-grabber{width:36px;height:4px;border-radius:2px;background:#dfe3ec;margin:0 auto 16px}.op-sheet-title{margin:0 0 14px;font-size:16px;font-weight:800;color:#17203a}.op-sheet-input{width:100%;padding:13px 14px;font-size:14px;color:#17203a;border:1.5px solid #dfe3ec;border-radius:12px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.op-sheet-input:focus{border-color:#0a6cff;box-shadow:0 0 0 3px #0a6cff1f}.op-sheet-input::placeholder{color:#b3b9c8}.op-sheet-hint{margin:10px 0 18px;font-size:12px;color:#9aa2b5}.op-sheet-actions{display:flex;gap:10px}.op-sheet-cancel{flex:1;padding:12px 0;font-size:14px;font-weight:600;color:#7d8699;background:#f5f6f9;border:none;border-radius:12px;cursor:pointer}.op-sheet-go{flex:2;padding:12px 0;font-size:14px;font-weight:700;color:#fff;background:#0a6cff;border:none;border-radius:12px;cursor:pointer;transition:opacity .15s ease}.op-sheet-go:disabled{opacity:.35;cursor:default}.op-sheet-loading{padding-bottom:6px}.op-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}.op-step{display:flex;align-items:center;gap:10px;font-size:13.5px;color:#3c465e;animation:op-detail-in .25s ease}.op-step.is-done{color:#9aa2b5}.op-step.is-final{color:#00a678;font-weight:700}.op-step-check{width:18px;text-align:center;color:#00a678;font-weight:700}.op-spinner{width:16px;height:16px;flex:none;border:2px solid rgba(10,108,255,.2);border-top-color:#0a6cff;border-radius:50%;animation:op-spin .7s linear infinite}@keyframes op-spin{to{transform:rotate(360deg)}}.op-modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:rgba(23,32,58,.45);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:24px;animation:op-fade-in .2s ease}.op-modal{position:relative;width:320px;max-width:100%;background:#ffffff;border-radius:18px;padding:28px 24px 22px;text-align:center;box-shadow:0 24px 64px #17203a40;animation:op-detail-in .25s ease}.op-modal h3{margin:0;font-size:17px;font-weight:800;color:#17203a}.op-modal-sub{margin:6px 0 18px;font-size:12.5px;color:#8a93a8}.op-modal-qr{width:180px;height:180px;border-radius:12px;border:1px solid #eef0f4;padding:8px;background:#ffffff}.op-modal-qr-loading{display:inline-flex;align-items:center;justify-content:center;color:#9aa2b5;font-size:12px}.op-modal-url{margin:14px 0 0;font-size:11.5px;color:#aab1c2;word-break:break-all}.op-modal-close{position:absolute;top:12px;right:12px;width:28px;height:28px;border:none;border-radius:50%;background:#f5f6f9;color:#7d8699;font-size:12px;cursor:pointer;transition:background .15s ease}.op-modal-close:hover{background:#eceef3}:root{--app-bg: #f6f7f9;--app-text: #17203a;--app-sub: #5b6478;--app-brand: #0a6cff;--app-card: #ffffff;--app-line: #e6e9f0;--app-radius: 16px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--app-bg);color:var(--app-text);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Helvetica Neue,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}a{color:var(--app-brand)}button{font-family:inherit}.app-shell{max-width:960px;margin:0 auto;padding:24px 20px 64px}.app-nav{display:flex;align-items:center;justify-content:space-between;padding:8px 0 32px}.app-logo{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:800;text-decoration:none;color:var(--app-text)}.app-logo-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#0a6cff,#66a3ff);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:800}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border:none;border-radius:14px;font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease}.btn:active{transform:scale(.97)}.btn-primary{background:var(--app-brand);color:#fff;box-shadow:0 6px 18px #0a6cff52}.btn-ghost{background:var(--app-card);color:var(--app-text);border:1px solid var(--app-line)}.btn[disabled]{opacity:.45;cursor:not-allowed}.hero{text-align:center;padding:48px 0 40px}.hero h1{margin:0 0 16px;font-size:clamp(32px,7vw,52px);font-weight:800;letter-spacing:-.02em;line-height:1.2}.hero h1 em{font-style:normal;background:linear-gradient(120deg,#0a6cff,#7b61ff,#ff6ec7);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{margin:0 auto 32px;max-width:460px;font-size:16px;line-height:1.8;color:var(--app-sub)}.hero-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:48px 0 0;text-align:left}.feature-card{background:var(--app-card);border:1px solid var(--app-line);border-radius:var(--app-radius);padding:20px}.feature-card h3{margin:0 0 8px;font-size:15px}.feature-card p{margin:0;font-size:13px;line-height:1.7;color:var(--app-sub)}.wizard-steps{display:flex;gap:8px;margin-bottom:28px}.wizard-step-dot{flex:1;height:4px;border-radius:2px;background:var(--app-line);overflow:hidden}.wizard-step-dot.active{background:var(--app-brand)}.wizard-title{margin:0 0 6px;font-size:24px;font-weight:800}.wizard-sub{margin:0 0 24px;font-size:14px;color:var(--app-sub)}.wizard-actions{display:flex;gap:12px;margin-top:28px}.wizard-actions .btn{flex:1}.persona-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.persona-card{background:var(--app-card);border:2px solid var(--app-line);border-radius:var(--app-radius);padding:18px;cursor:pointer;text-align:left;display:flex;align-items:center;gap:14px}.persona-card.selected{border-color:var(--app-brand);box-shadow:0 4px 16px #0a6cff26}.persona-card img{width:52px;height:52px;border-radius:50%}.persona-card .persona-label{font-size:15px;font-weight:700;margin-bottom:4px}.persona-card .persona-tagline{font-size:12px;color:var(--app-sub)}.paste-box{margin-top:20px}.paste-box textarea{width:100%;min-height:120px;border:1px solid var(--app-line);border-radius:12px;padding:14px;font-size:13px;font-family:SF Mono,Menlo,monospace;resize:vertical;background:var(--app-card);color:var(--app-text)}.paste-error{margin:8px 0 0;font-size:13px;color:#e5484d}.paste-ok{margin:8px 0 0;font-size:13px;color:#22c55e}.paste-hint{margin:0 0 8px;font-size:13px;color:var(--app-sub)}.paste-hint code{background:var(--app-card);border:1px solid var(--app-line);padding:1px 6px;border-radius:6px;font-size:12px}.template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.template-card{position:relative;background:var(--app-card);border:2px solid var(--app-line);border-radius:var(--app-radius);padding:14px;cursor:pointer;text-align:left}.template-card.selected{border-color:var(--app-brand);box-shadow:0 4px 16px #0a6cff26}.template-preview{height:150px;border-radius:12px;margin-bottom:12px;padding:14px 12px;display:flex;flex-direction:column;align-items:center;gap:8px;overflow:hidden}.template-preview .tp-avatar{width:30px;height:30px;border-radius:50%}.template-preview .tp-bar{height:8px;border-radius:4px}.template-preview .tp-card{width:100%;height:26px;border-radius:8px}.template-name{font-size:15px;font-weight:700}.template-desc{margin-top:4px;font-size:12px;line-height:1.6;color:var(--app-sub)}.rec-badge{position:absolute;top:-8px;right:12px;background:linear-gradient(120deg,#ff6ec7,#ffb35c);color:#fff;font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;box-shadow:0 3px 10px #ff6ec766}.rec-reason{margin-top:8px;font-size:12px;color:var(--app-brand)}.editor-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}@media (max-width: 760px){.editor-layout{grid-template-columns:1fr}}.editor-panel{background:var(--app-card);border:1px solid var(--app-line);border-radius:var(--app-radius);padding:20px}.editor-panel h3{margin:0 0 16px;font-size:15px}.field{margin-bottom:14px}.field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--app-sub)}.field input,.field textarea,.field select{width:100%;border:1px solid var(--app-line);border-radius:10px;padding:10px 12px;font-size:14px;font-family:inherit;background:#fff;color:var(--app-text)}.field textarea{min-height:72px;resize:vertical}.module-toggle{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--app-line);font-size:14px}.module-toggle:last-child{border-bottom:none}.switch{position:relative;width:44px;height:26px;border-radius:999px;background:var(--app-line);border:none;cursor:pointer;transition:background .2s;flex-shrink:0}.switch.on{background:var(--app-brand)}.switch:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 4px #0003}.switch.on:after{transform:translate(18px)}.preview-frame{position:sticky;top:24px;border-radius:28px;border:6px solid #17203a;overflow:hidden;box-shadow:0 16px 48px #17203a40;background:#fff}.preview-frame .yy-page{min-height:560px;max-height:640px;overflow-y:auto;padding:32px 16px 24px}.publish-result{text-align:center;padding:32px 0}.publish-result h2{margin:0 0 8px;font-size:24px}.publish-link{display:inline-block;margin:16px 0;padding:12px 18px;background:var(--app-card);border:1px solid var(--app-line);border-radius:12px;font-size:14px;word-break:break-all;max-width:100%}.publish-qr{width:180px;height:180px;border-radius:12px;border:1px solid var(--app-line)}.publish-actions{display:flex;gap:12px;justify-content:center;margin-top:20px;flex-wrap:wrap}.notfound{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:var(--app-bg);text-align:center;padding:24px}.yy-page{min-height:100vh;min-height:100dvh;background:var(--yy-bg);color:var(--yy-text);font-family:var(--yy-font);padding:48px 20px 32px;box-sizing:border-box}.yy-column{max-width:480px;margin:0 auto;display:flex;flex-direction:column;gap:16px}.yy-header{text-align:center;padding:8px 0 4px}.yy-avatar{width:96px;height:96px;border-radius:50%;object-fit:cover;box-shadow:var(--yy-shadow);border:3px solid var(--yy-card-bg)}.yy-avatar-fallback{display:inline-flex;align-items:center;justify-content:center;font-size:36px;font-weight:700;color:#fff;background:var(--yy-accent)}.yy-name{margin:16px 0 6px;font-size:26px;font-weight:700;letter-spacing:.02em}.yy-titleline{margin:0;font-size:15px;opacity:.85}.yy-at{opacity:.6}.yy-bio{margin:12px auto 0;max-width:340px;font-size:14px;line-height:1.7;opacity:.75}.yy-status-row{display:flex;justify-content:center}.yy-status{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 18px;border-radius:999px;background:var(--yy-card-bg);box-shadow:var(--yy-shadow);font-size:14px;font-weight:600}.yy-status-dot{width:8px;height:8px;border-radius:50%}.yy-contacts{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.yy-contact{display:inline-flex;align-items:center;gap:6px;min-height:44px;min-width:44px;padding:0 14px;border-radius:var(--yy-radius);background:var(--yy-card-bg);box-shadow:var(--yy-shadow);color:inherit;text-decoration:none;font-size:13px;transition:transform .15s ease}.yy-contact:active{transform:scale(.96)}.yy-card{background:var(--yy-card-bg);border-radius:var(--yy-radius);box-shadow:var(--yy-shadow);padding:20px}.yy-glass .yy-card,.yy-glass .yy-status,.yy-glass .yy-contact{backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);border:1px solid rgba(255,255,255,.28)}.yy-card-title{margin:0 0 14px;font-size:15px;font-weight:700;letter-spacing:.04em;color:var(--yy-accent)}.yy-glass .yy-card-title{color:var(--yy-text)}.yy-exp-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}.yy-exp+.yy-exp{padding-top:16px;border-top:1px solid color-mix(in srgb,var(--yy-text) 10%,transparent)}.yy-exp-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:15px}.yy-exp-period{font-size:12px;opacity:.55;white-space:nowrap}.yy-exp-title{margin-top:2px;font-size:13px;color:var(--yy-accent)}.yy-glass .yy-exp-title{color:var(--yy-text);opacity:.9}.yy-exp-desc{margin:6px 0 0;font-size:13px;line-height:1.6;opacity:.72}.yy-skills{display:flex;flex-wrap:wrap;gap:8px}.yy-skill{padding:7px 14px;border-radius:999px;font-size:13px;background:color-mix(in srgb,var(--yy-accent) 12%,transparent);color:var(--yy-accent);font-weight:500}.yy-glass .yy-skill{background:rgba(255,255,255,.22);color:var(--yy-text)}.yy-works{display:flex;flex-direction:column;gap:10px}.yy-work{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 12px;border-radius:calc(var(--yy-radius) * .7);background:color-mix(in srgb,var(--yy-text) 5%,transparent);color:inherit;text-decoration:none;transition:transform .15s ease}.yy-glass .yy-work{background:rgba(255,255,255,.14)}.yy-work:active{transform:scale(.98)}.yy-work-thumb{width:44px;height:44px;border-radius:10px;object-fit:cover;flex-shrink:0}.yy-work-thumb-ph{display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--yy-accent) 15%,transparent);color:var(--yy-accent)}.yy-glass .yy-work-thumb-ph{background:rgba(255,255,255,.25);color:var(--yy-text)}.yy-work-body{display:flex;flex-direction:column;gap:2px;min-width:0}.yy-work-title{font-size:14px;font-weight:600}.yy-work-desc{font-size:12px;opacity:.65;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.yy-footer{margin-top:20px;text-align:center;font-size:12px;opacity:.45}
