/* [INPUT]: 产品页、接入弹窗、模拟手机及 data-mode 状态。
 * [OUTPUT]: 轻量产品说明与手机工作台、固定比例机身、单步复制与不遮挡操作的轻提示。
 * [POS]: 参考官方开发者站的信息层级，使用本地系统字体及原生 SVG。
 * [PROTOCOL]: 变更时更新此头部，然后检查 AGENTS.md */
:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:#202020;background:#faf9f6;font-synthesis:none;--green:#387b59;--blue:#252525;--muted:#7b7b7b;--line:#e3e3e3;--paper:#f6f6f6;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;color:inherit;transition:background .16s,transform .12s,opacity .16s}button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #767676;outline-offset:4px}button:hover{filter:brightness(.95)}[hidden]{display:none!important}a{color:inherit;text-decoration:none}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.mono{font-family:var(--mono)}
/* --- 产品说明与手机：适度标题、清晰用途、唯一接入操作 --- */
.brand{height:56px;display:flex;align-items:center;gap:18px;max-width:1440px;margin:auto;padding:0 38px;border-bottom:1px solid var(--line)}
.brand-name{display:flex;align-items:center;gap:9px;font-size:18px;font-weight:600;letter-spacing:-.6px}.brand-icon{display:grid;place-items:center}.brand-icon svg{width:21px;height:21px}.brand-divider{width:1px;height:16px;background:#ddd}.brand-tag{font-size:11px;color:#929292}.brand nav{margin-left:auto}.brand nav button{background:none;font-size:11px;color:#696969;padding:10px 0}.brand nav button>span{margin-left:7px}
.stage{display:flex;justify-content:center;align-items:center;gap:clamp(48px,8vw,128px);min-height:calc(100svh - 88px);padding:16px 16px 8px}.eyebrow{display:flex;align-items:center;gap:9px;font:10px var(--mono);letter-spacing:1.2px;color:#747474}
.site-footer{height:32px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 38px;border-top:1px solid var(--line);color:#a1a1a1;font-size:9px}.footer-separator{margin:0 8px;color:#bcbcbc}
/* --- 硬件轮廓：保留手机，去掉高光和彩色装饰 --- */
.device-wrap{align-self:center}.device-viewport{--phone-scale:1;position:relative;width:calc(360px * var(--phone-scale));height:calc(760px * var(--phone-scale))}.device{position:absolute;top:0;left:0;transform:scale(var(--phone-scale));transform-origin:top left;width:360px;height:760px;padding:7px;border:1px solid #656565;border-radius:49px;background:#252525;box-shadow:0 22px 42px -22px #21212145,0 3px 5px #20202018,inset 0 0 0 2px #a6a6a6,inset 0 0 0 3px #424242}.screen{position:relative;height:100%;border:2px solid #171717;border-radius:41px;overflow:hidden;background:var(--paper);display:flex;flex-direction:column;isolation:isolate}.side-button{position:absolute;width:2px;background:#626262;left:-3px;border-radius:2px}.mute{top:104px;height:24px}.volume{top:151px;height:62px}.power{left:auto;right:-3px;top:179px;height:60px}.status-bar{height:52px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 23px;font-size:12px;font-weight:600;z-index:2}.island{position:absolute;width:94px;height:27px;top:10px;left:50%;transform:translateX(-50%);background:#111111;border-radius:18px}.island i{position:absolute;width:6px;height:6px;right:11px;top:10px;border-radius:50%;background:#282828;box-shadow:inset 0 0 1px #585858}.indicators{display:flex;gap:5px;align-items:center}.signal{display:flex;align-items:flex-end;gap:2px;height:10px}.signal i{width:2px;background:currentColor;border-radius:1px}.signal i:nth-child(1){height:4px}.signal i:nth-child(2){height:6px}.signal i:nth-child(3){height:8px}.signal i:nth-child(4){height:10px}.wifi{font-size:16px;transform:rotate(180deg);line-height:1}.battery{width:18px;height:9px;border:1px solid currentColor;border-radius:2px;position:relative}.battery:before{content:"";position:absolute;inset:1px;background:currentColor;border-radius:1px}.battery:after{content:"";position:absolute;right:-3px;top:2px;width:2px;height:3px;background:currentColor;border-radius:1px}.phone-body{flex:1;min-height:0;position:relative;overflow:hidden}.home-button{height:24px;flex-shrink:0;background:transparent;display:grid;place-items:center;width:100%;z-index:3}.home-button span{width:100px;height:4px;background:#303030;border-radius:5px;transition:width .15s}.home-button:hover span{width:112px}.device-caption{display:flex;align-items:center;justify-content:center;gap:7px;font:8px var(--mono);letter-spacing:.8px;color:#969696;margin:15px 0 0}.caption-dot{width:4px;height:4px;border-radius:50%;background:#8f8f8f}#app-view{height:100%}.panel{height:100%;min-height:0;animation:appear .16s ease-out}
/* --- 桌面：一个主要动作，三个次级应用 --- */
.screen[data-mode=home]{background:#f2f2f2;color:#242424}.home-panel{display:flex;flex-direction:column;padding:13px 18px 0}.home-heading{display:flex;align-items:center;justify-content:space-between;font:9px var(--mono);letter-spacing:1.4px;color:#6d6d6d;margin-bottom:20px}.home-badge{font-family:inherit;font-size:9px;letter-spacing:0;color:#8d8d8d}.home-date{font-size:10px;color:#7c7c7c}.home-time{font-size:44px;letter-spacing:-2px;line-height:1.2;font-weight:400;font-variant-numeric:tabular-nums;margin:2px 0 4px}.home-message{display:flex;align-items:center;gap:6px;font-size:10px;color:#8a8a8a;margin:3px 0 25px}.live-dot{width:4px;height:4px;background:#7d9770;border-radius:50%}.home-widget{background:#fcfcfc;border:1px solid #dedede;border-radius:15px;padding:17px 16px;box-shadow:0 2px 4px #4f4f4f04;flex-shrink:0}.widget-top{display:flex;align-items:center;gap:9px;font-size:13px;color:#3f3f3f;font-weight:550}.codex-small{display:grid;place-items:center;width:25px;height:25px;border-radius:7px;border:1px solid #d7d7d7;background:#efefef;color:#383838;font:14px var(--mono);letter-spacing:-2px;padding-right:2px}.connection-state{font-size:8px;letter-spacing:0;margin-left:auto;color:#7c7c7c;background:#eeeeee;border:1px solid #e1e1e1;border-radius:4px;padding:3px 5px;font-weight:400}.widget-description{font-size:15px;line-height:1.7;margin:19px 0 22px;color:#737373}.setup-button{background:#303030;color:#fff;width:100%;border-radius:9px;min-height:48px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:500}.setup-button svg{width:15px;height:15px}.widget-bottom{display:block;font-size:9px;text-align:center;color:#989898;margin-top:11px;line-height:1.5}.home-spacer{flex:1;min-height:18px}.home-quota{text-align:center;color:#8e8e8e;font-size:9px}.home-quota b{font-weight:500}.page-dots{display:flex;justify-content:center;margin:13px 0}.page-dots i{width:4px;height:4px;border-radius:50%;background:#9a9a9a}.dock{display:flex;justify-content:space-around;padding:12px 3px 8px;background:#e6e6e6;border:1px solid #dedede;border-radius:20px;margin:0 0 2px;flex-shrink:0}.dock button{background:none;display:flex;flex-direction:column;align-items:center;gap:7px;font-size:9px;color:#7e7e7e;min-width:68px}.app-icon{width:45px;height:45px;border-radius:12px;display:grid;place-items:center;background:#f7f7f7;border:1px solid #d6d6d6;color:#606060}.app-icon svg{width:24px;height:24px;stroke-width:1.5}.phone-icon{background:#494949;color:#f7f7f7;border-color:#494949}.phone-icon svg{width:22px;height:22px}.settings-icon svg{width:27px;height:27px}
/* --- 应用和联系人：统一列表、统一排版 --- */
.app-panel{display:flex;flex-direction:column;background:var(--paper);color:#282828}.app-nav{height:41px;flex-shrink:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 16px;font-size:12px;font-weight:550}.app-nav>span:empty{min-width:0}.app-nav>:last-child{justify-self:end}.back-button{display:flex;align-items:center;gap:0;background:transparent;color:#6b6b6b;padding:6px 0;font-size:12px;font-weight:400;justify-self:start}.back-button svg{width:17px;height:20px}.text-button{background:transparent;color:#595959;font-size:11px;white-space:nowrap;padding:8px 0}.app-content{flex:1;min-height:0;overflow-y:auto;padding:10px 18px 22px;scrollbar-width:none}.app-content::-webkit-scrollbar{display:none}.large-title{font-size:27px;letter-spacing:-1px;margin:9px 0 7px;font-weight:550}.section-note{color:#969696;font-size:10px;margin:0 0 24px;line-height:1.7}.contact-row{width:100%;display:flex;gap:12px;align-items:center;text-align:left;padding:14px 0;background:transparent}.contact-row>span:nth-child(2){display:flex;flex-direction:column;gap:4px;min-width:0}.contact-row strong{font-weight:500;font-size:15px}.contact-row small{font-size:10px;color:#969696}.avatar{width:42px;height:42px;display:grid;place-items:center;flex-shrink:0;border-radius:12px;font-size:17px;border:1px solid #dbdbdb}.codex-avatar{background:#ededed;color:#424242;font-family:var(--mono);letter-spacing:-3px;padding-right:4px}.me-avatar{background:#e8e8e8;color:#7c7c7c}.chevron{margin-left:auto;color:#ababab;font-size:21px}.my-card{padding-bottom:20px;border-bottom:1px solid var(--line)}.alphabet{border-bottom:1px solid #e0e0e0;margin:17px 0 0;padding:4px 0;color:#a1a1a1;font:10px var(--mono)}.contact-count{text-align:center;color:#a3a3a3;font-size:10px;border-top:1px solid var(--line);padding-top:22px;margin-top:16px}.contact-detail{text-align:center;padding-top:11px}.hero-avatar{width:64px;height:64px;font-size:29px;margin:6px auto 12px;border-radius:17px;letter-spacing:-4px}.hero-avatar.me-avatar{letter-spacing:0}.contact-detail h2{margin:0;font-weight:500;font-size:26px;letter-spacing:-.6px}.contact-subtitle{color:#939393;font-size:10px;margin:8px 0 21px}.contact-action{background:#303030;width:100%;border-radius:9px;padding:13px 12px;display:flex;align-items:center;justify-content:center;gap:9px;color:#fff;font-size:12px}.contact-action svg{width:16px;height:16px}.group-label{font-size:9px;color:#919191;letter-spacing:.3px;text-align:left;margin:23px 3px 9px}.group{border-radius:11px;background:#fff;border:1px solid #e2e2e2;text-align:left;overflow:hidden}.key-group{padding:14px 13px 0}.field-label{display:flex;align-items:center;justify-content:space-between;color:#8d8d8d;font:10px var(--mono)}.field-label svg{width:14px;height:14px}.key-group code{display:block;font-family:var(--mono);color:#595959;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:13px 0 16px}.row-action{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;padding:12px 13px;color:#5d5d5d;background:white;border-top:1px solid var(--line);font-size:12px;text-align:left}.row-action:first-child{border-top:0}.key-group .row-action{padding-left:0;padding-right:0}.row-action svg{width:15px;height:15px}.field-note{font-size:9px;line-height:1.8;color:#989898;text-align:left;margin:9px 3px 19px;overflow-wrap:anywhere}.info-row{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:46px;margin:0 13px;border-bottom:1px solid var(--line);font-size:11px}.info-row:last-child{border-bottom:0}.info-row>span{color:#8e8e8e}.info-row strong{font-weight:400;font-size:11px;text-align:right;font-variant-numeric:tabular-nums}.contact-note{text-align:left;margin:23px 3px;color:#939393;font-size:10px}.contact-note p{font-size:12px;color:#666666;line-height:1.7;margin:9px 0}.contact-note small{font-size:9px;line-height:1.8}.row-link{background:transparent;color:#646464;font-size:12px;margin-top:16px}.green{color:var(--green)}.danger{color:#ae6254}.contact-row.group{padding:16px 13px}.contact-row.group strong{font-size:13px}.phone-tabs{display:flex;flex-shrink:0;justify-content:space-evenly;border-top:1px solid var(--line);padding:11px 0 4px;background:#f7f7f7}.phone-tabs button{display:flex;flex-direction:column;align-items:center;gap:4px;background:transparent;color:#a0a0a0;font-size:9px;min-width:80px}.phone-tabs .selected{color:#5f5f5f}.phone-tabs svg{width:21px;height:21px}.record{border-bottom:1px solid var(--line);padding:15px 0;display:grid;grid-template-columns:21px 1fr;gap:9px}.record-icon{color:#a0a0a0;padding-top:3px}.record-icon svg{width:17px;height:17px}.record-head{display:flex;justify-content:space-between;gap:8px;align-items:center}.record-name{font-size:14px;font-weight:500}.record-time{font:9px var(--mono);color:#9b9b9b;text-align:right}.record-status{font-size:9px;color:#8a8a8a;display:block;margin:5px 0}.record[data-status=not_answered] .record-name,.record[data-status=failed] .record-name{color:#b06c58}.record p{font-size:11px;color:#7c7c7c;line-height:1.8;overflow-wrap:anywhere;margin:7px 0 0}.record small{font-size:9px;color:#a1a1a1;line-height:1.7;overflow-wrap:anywhere}.empty{text-align:center;padding:55px 8px}.empty svg{width:37px;height:37px;color:#bababa;stroke-width:1.2}.empty h3{font-size:15px;color:#787878;font-weight:450;margin:20px 0 10px}.empty p{font-size:11px;color:#9f9f9f;line-height:1.8;margin:0}
/* --- 登录：完成验证后自动准备 Key --- */
.login-view{height:100%;padding:20px 23px 24px;overflow:auto;scrollbar-width:none}.login-emblem{width:45px;height:45px;border:1px solid #dbdbdb;border-radius:12px;background:#eeeeee;color:#7c7c7c;display:grid;place-items:center;margin:11px 0 28px}.login-emblem svg{width:21px;height:21px}.login-view .eyebrow{font-size:8px;letter-spacing:1px;color:#a1a1a1}.login-view h2{font-size:29px;line-height:1.35;letter-spacing:-1px;font-weight:500;margin:13px 0}.muted{font-size:11px;color:#949494;line-height:1.8}.login-view form{margin-top:30px}label{display:block;font-size:10px;color:#8a8a8a;margin:17px 1px 8px}.input-row{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 12px;background:white;border-radius:9px;border:1px solid #e0e0e0}.input-row>span{font:11px var(--mono);color:#8d8d8d;border-right:1px solid #dfdfdf;padding-right:10px}input{width:100%;min-width:0;min-height:44px;background:transparent;border:0;color:#595959;font-size:16px;outline:none}input::placeholder{color:#afafaf;font-size:11px}.primary{display:flex;align-items:center;justify-content:space-between;min-height:46px;padding:12px 15px;border-radius:9px;color:white;background:#303030;font-size:12px}.primary svg{width:16px;height:16px}.full{width:100%}.login-view .primary{margin-top:24px}.footnote{font-size:9px;text-align:center;color:#a3a3a3;margin-top:13px;line-height:1.8}.secondary{padding:12px;border:1px solid #dbdbdb;color:#858585;border-radius:9px;background:transparent;font-size:11px;margin-top:14px}#notice{position:fixed;left:50%;top:20px;transform:translateX(-50%);width:max-content;max-width:min(400px,calc(100vw - 32px));border:1px solid #deded8;border-radius:25px;background:#fffffff5;color:#30302d;font-size:12px;line-height:1.65;padding:10px 19px;z-index:100;box-shadow:0 5px 22px #00000012;pointer-events:none;animation:notice-life var(--notice-duration,2000ms) both}#notice.error{background:#fff8f5;color:#7b4e3e;border-color:#ead6cd}dialog{max-width:350px;width:calc(100% - 40px);border:1px solid #dcdcdc;border-radius:16px;background:#f9f9f9;padding:24px;color:#414141;box-shadow:0 16px 65px #20202022}dialog::backdrop{background:#25252544;backdrop-filter:blur(3px)}dialog h3{font-size:18px;font-weight:500;margin-top:0;line-height:1.6}dialog p{font-size:12px;line-height:1.8;color:#8a8a8a}dialog textarea{width:100%;height:180px;border:1px solid #dcdcdc;border-radius:7px;padding:11px;font:11px var(--mono);margin-bottom:16px}dialog button{justify-content:center}.screen[data-mode=login] .home-button{opacity:.35}.guide-heading{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#8f8f8f;margin-bottom:21px}.guide-heading button{background:none;font-size:24px;font-weight:300;padding:0 4px;color:#8c8c8c}#guide-dialog{max-width:620px;max-height:85svh;padding:26px}#guide-content{font:11px/1.9 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;background:#efefef;border:1px solid #dfdfdf;border-radius:8px;padding:16px;color:#6d6d6d;max-height:43svh;overflow:auto;margin:20px 0}#guide-dialog .primary{justify-content:space-between}
@keyframes appear{from{opacity:.5;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
/* --- 机身按同一比例缩放；内部布局始终使用 360 × 760 画布 --- */
@keyframes notice-life{0%{opacity:0}8%,80%{opacity:1}100%{opacity:0}}
@media(max-width:700px){.brand{height:53px;padding:0 20px}.brand-name{font-size:16px}.brand-tag,.brand-divider{display:none}.stage{min-height:calc(100svh - 53px);padding:16px 16px 14px}.site-footer{display:none}.device-caption{font-size:7px;letter-spacing:.5px;margin-top:13px}#notice{top:12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* --- 用途说明：说明价值与步骤，操作保留在手机内 --- */
.product-intro{width:320px;flex-shrink:0}.intro-label{font:11px var(--mono);letter-spacing:1px;color:#888;margin:0 0 20px}.product-intro h1{font-size:28px;line-height:1.55;font-weight:550;letter-spacing:-.7px;margin:0 0 16px}.intro-description{font-size:14px;color:#777;line-height:1.9;margin:0}.use-cases{list-style:none;padding:0;margin:24px 0 32px;font-size:13px;color:#555;line-height:2.2}.use-cases li:before{content:"↗";color:#999;margin-right:12px}.getting-started{border-top:1px solid var(--line);padding-top:20px}.getting-started>span{font-size:11px;color:#929292}.getting-started ol{padding-left:18px;font-size:13px;line-height:2.2;color:#555;margin:12px 0}.getting-started p{font-size:11px;line-height:1.8;color:#999;margin:0}.login-view h2{font-size:24px;letter-spacing:-.5px}
@media(max-width:700px){.stage{flex-direction:column;gap:28px;padding-top:28px}.product-intro{width:min(100%,360px);padding:0 8px}.intro-label{display:none}.product-intro h1{font-size:24px;line-height:1.5;margin-bottom:12px}.product-intro h1 br{display:none}.intro-description{font-size:13px}.use-cases{display:none}.getting-started{padding-top:14px;margin-top:16px}.getting-started ol{margin:8px 0}.getting-started p{display:none}}