/* Public layouts; theme and controls live in app.css. */
.front-page{min-height:100dvh;display:flex;flex-direction:column}.front-header{width:min(1120px,calc(100% - 64px));margin:18px auto 0;height:72px;padding:0 24px;background:rgba(20,29,52,.58);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-size:17px}.header-context{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-dim)}.front-main{width:min(1040px,calc(100% - 64px));margin:0 auto;flex:1;padding:60px 0 48px;min-width:0}.share-entry{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center;margin-bottom:44px}.hero-badge{display:flex;align-items:center;gap:9px;color:var(--primary);font-size:12px;font-weight:600;letter-spacing:1px;margin-bottom:24px}.share-hero h1{font-size:clamp(32px,3.1vw,44px);line-height:1.4;letter-spacing:-1.5px;max-width:440px}.share-hero h1 em{font-style:normal;color:var(--primary)}.share-hero>p{font-size:14px;line-height:1.95;color:var(--text-dim);margin-top:18px;max-width:360px}.hero-note{display:flex;align-items:center;gap:8px;color:var(--text-dim);margin-top:24px;font-size:12px}.hero-note svg{width:15px;height:15px}.purchase-btn{margin-top:24px;background:linear-gradient(120deg,#5265d6,#7054c4);color:#fff;padding:14px 20px;min-height:50px;border:1px solid rgba(190,200,255,.42);border-radius:12px;font-size:14px;box-shadow:0 8px 25px rgba(77,88,197,.3),inset 0 1px 0 rgba(255,255,255,.18);white-space:normal;text-align:center}.purchase-btn:hover{background:linear-gradient(120deg,#455aca,#6346b7);color:#fff;border-color:#b2bdff;box-shadow:0 12px 34px rgba(98,109,230,.4);transform:translateY(-3px)}.purchase-btn span{min-width:0;overflow-wrap:anywhere}.purchase-btn:focus-visible{outline-color:#c1caff}.card-panel{border:1px solid var(--glass-border);border-radius:22px;background:var(--card);padding:30px;box-shadow:var(--shadow)}.query-panel{position:relative;overflow:hidden}.query-panel:before{content:"";position:absolute;top:0;left:30px;right:30px;height:1px;background:linear-gradient(90deg,transparent,rgba(199,213,255,.55),transparent);border-radius:0 0 3px 3px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}.panel-heading h2{font-size:20px}.panel-heading p{color:var(--text-dim);font-size:12px;margin-top:5px}.panel-icon{display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);border:1px solid var(--glass-border);width:44px;height:44px;border-radius:13px;flex:none}.panel-icon svg{width:23px;height:23px}.query-box{display:grid;gap:14px;margin-top:9px}.input-wrap{display:flex;align-items:center;gap:10px;min-height:56px;background:var(--card-2);border:1px solid var(--border);border-radius:10px;padding:0 15px;cursor:text;transition:border-color .18s,box-shadow .18s}.input-wrap:focus-within{background:var(--card);border-color:var(--primary);box-shadow:0 0 0 3px var(--focus-ring)}.input-icon{color:var(--text-dim);display:grid;place-items:center}.query-box .input-wrap input{border:0;background:transparent;box-shadow:none;padding:15px 0;min-width:0;min-height:54px;font-family:ui-monospace,Consolas,monospace;font-size:16px;border-radius:0}.query-box .input-wrap input:focus,.query-box .input-wrap input:focus-visible{outline:none;box-shadow:none;border:0}.input-wrap:has(input[aria-invalid=true]){border-color:var(--danger)}#queryBtn{min-height:48px;justify-content:space-between;padding:13px 18px}.hint{margin-top:13px;display:flex;gap:7px;align-items:center;font-size:11px}.hint svg{width:14px;height:14px}.query-panel .notice{margin:22px 0 0;font-size:12px;padding:12px}.usage-guide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:25px 0;margin-bottom:32px}.guide-step{display:flex;align-items:center;gap:14px;padding:0 26px;border-right:1px solid var(--border)}.guide-step:first-child{padding-left:0}.guide-step:last-child{border:0}.step-number{font:500 24px/1 ui-monospace,monospace;color:#9aaed9}.guide-step strong{font-size:13px;font-weight:600}.guide-step p{font-size:12px;color:var(--text-dim);margin-top:3px}.share-notice{display:flex;gap:14px;background:rgba(29,41,69,.58);border:1px solid var(--glass-border);border-radius:12px;padding:19px 22px;margin:24px 0 36px}.notice-icon{color:var(--primary);padding-top:2px}.share-notice h2{font-size:13px;margin-bottom:5px}.share-notice p{font-size:12px;color:var(--text-dim);line-height:1.8}.faq-panel{display:grid;grid-template-columns:.6fr 1.4fr;gap:52px;margin-top:40px}.section-heading h2{font-size:22px}.section-heading p{color:var(--text-dim);font-size:12px;margin-top:8px}.faq-list{display:flex;flex-direction:column;gap:10px}.faq-list details{border:1px solid var(--glass-border);border-radius:13px;background:rgba(22,31,56,.68);box-shadow:inset 0 1px 0 rgba(233,240,255,.035);transition:background-color .22s,border-color .22s,box-shadow .22s,transform .22s}.faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;cursor:pointer;font-size:13px;font-weight:500;min-height:64px;transition:color .2s}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";display:grid;place-items:center;width:28px;height:28px;flex:none;border:1px solid rgba(169,186,244,.2);border-radius:8px;background:rgba(112,137,241,.09);font-size:22px;line-height:1;color:var(--primary);font-weight:300;transition:transform .28s,background-color .2s,border-color .2s}.faq-list details:hover,.faq-list details:focus-within{background:rgba(44,56,100,.76);border-color:rgba(164,183,255,.55);box-shadow:0 0 24px rgba(102,128,246,.15),inset 3px 0 0 #9aaeff}.faq-list summary:hover,.faq-list summary:focus-visible{color:#d6dfff}.faq-list summary:active{background:rgba(157,178,255,.08)}.faq-list details[open]{background:rgba(34,45,80,.85);border-color:rgba(162,182,255,.42)}.faq-list details[open] summary{color:var(--primary)}.faq-list details[open] summary:after{transform:rotate(45deg);background:rgba(137,160,255,.2);border-color:rgba(168,189,255,.5)}.faq-list details p{font-size:13px;color:var(--text-dim);line-height:1.9;padding:0 20px 20px}.faq-list summary:focus-visible{outline-offset:3px;border-radius:12px}@media(hover:hover){.faq-list details:hover{transform:translateX(3px)}}.front-footer{text-align:center;color:var(--text-dim);font-size:11px;line-height:1.9;padding:26px 20px;border-top:1px solid var(--border);margin-top:20px}.back-link{display:inline-flex;align-items:center;gap:7px;font-size:12px;margin-bottom:28px}.result-hero .hero-badge{margin-bottom:14px}.result-hero h1{font-size:34px}.result-hero p{font-size:14px;color:var(--text-dim);margin-top:12px}.result-summary{display:flex;align-items:center;gap:46px;padding:24px 0;margin:28px 0 34px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.result-summary .btn{margin-left:auto}.summary-label{font-size:11px;color:var(--text-dim);display:block;margin-bottom:5px}.result-summary strong{font-size:13px;font-weight:500}.group{margin-bottom:32px}.group-title{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:15px}.group-name{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:600}.group-name svg{color:var(--primary)}.err{font-size:12px;color:var(--danger)}.account-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.account{position:relative;border:1px solid var(--glass-border);border-radius:22px;background:var(--card);background-image:linear-gradient(135deg,rgba(195,217,255,.05),transparent 64%);padding:22px;box-shadow:var(--shadow);min-width:0;transition:transform .2s,box-shadow .2s,background-color .2s}.account:hover{background-color:rgba(35,46,78,.85);box-shadow:0 18px 42px rgba(0,0,0,.3),inset 0 1px 0 rgba(205,222,255,.22);transform:translateY(-2px)}.field{display:grid;grid-template-columns:38px minmax(0,1fr);gap:12px;align-items:center;margin:14px 0}.field .label{font-size:11px;color:var(--text-dim)}.val{font:14px/1.7 ui-monospace,Consolas,monospace;overflow-wrap:anywhere}.plain-value{font:12px/1.8 var(--font);color:var(--text-dim)}.secret-value{display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;background:var(--card-2);padding:8px 10px;border-radius:7px;color:var(--text);text-align:left;min-height:40px;min-width:0;white-space:normal}.secret-value span{overflow-wrap:anywhere;min-width:0}.secret-value:hover{background:var(--primary-soft)}.secret-value svg{width:16px;height:16px;color:var(--primary)}.chips{display:flex;flex-wrap:wrap;gap:6px;margin:20px 0}.acts{display:flex;gap:10px}.acts .mini-btn{flex:1;font-size:12px;padding:10px 12px}.acts .mini-btn:first-child{background:var(--primary-soft);border-color:rgba(139,156,220,.28);color:var(--primary)}.result-notice{margin-top:36px}.result-head{font-weight:600;margin:24px 0 12px}
/* A masked light trail follows the actual rounded card border. */
@property --account-orbit{syntax:"<angle>";initial-value:0deg;inherits:false}
@supports (mask-composite:exclude) or (-webkit-mask-composite:xor){
    .account:before{content:"";position:absolute;inset:-1px;padding:1.5px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--account-orbit),transparent 0deg,transparent 265deg,rgba(115,219,255,.12) 285deg,rgba(133,231,255,.7) 325deg,#dcfaff 348deg,transparent 360deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;filter:drop-shadow(0 0 3px rgba(130,226,255,.55));animation:account-border-orbit 5s linear infinite}
    .account:nth-child(even):before{animation-delay:-2.5s}
}
@keyframes account-border-orbit{to{--account-orbit:360deg}}
:is(.motion-paused,.motion-suspended) .account:before{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.account:before{animation:none;--account-orbit:45deg;opacity:.6}}
/* Local Apple mark: glass tile, breathing light and a travelling contour. */
.brand .brand-apple{position:relative;isolation:isolate;background:linear-gradient(145deg,rgba(132,118,226,.25),rgba(79,124,206,.12));border:1px solid rgba(188,201,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 0 14px rgba(132,131,245,.14);transition:transform .25s,border-color .25s,box-shadow .25s}
.brand-apple:before{content:"";position:absolute;inset:-6px;z-index:-1;border-radius:inherit;background:radial-gradient(ellipse,rgba(143,137,255,.42),rgba(118,177,255,.12) 46%,transparent 72%);pointer-events:none;animation:brand-apple-breathe 3.6s ease-in-out infinite}
.brand-apple svg{width:25px;height:25px;overflow:visible;filter:drop-shadow(0 0 3px rgba(157,185,255,.5))}
.brand-apple-trail{stroke-dasharray:14 86;animation:brand-apple-flow 4.8s linear infinite}
.brand:hover .brand-apple,.brand:focus-visible .brand-apple{transform:translateY(-1px) scale(1.04);border-color:rgba(209,219,255,.7);box-shadow:0 0 20px rgba(144,139,255,.32),inset 0 1px 0 rgba(255,255,255,.2)}
@keyframes brand-apple-breathe{0%,100%{opacity:.4;transform:scale(.9)}50%{opacity:.9;transform:scale(1.15)}}
@keyframes brand-apple-flow{to{stroke-dashoffset:-100}}
:is(.motion-paused,.motion-suspended) .brand-apple:before,:is(.motion-paused,.motion-suspended) .brand-apple-trail{animation-play-state:paused}
@media(max-width:700px){.brand-apple svg{width:22px;height:22px}}
@media(prefers-reduced-motion:reduce){.brand-apple:before,.brand-apple-trail{animation:none}.brand-apple:before{opacity:.55}.brand .brand-apple{transition:none}.brand:hover .brand-apple,.brand:focus-visible .brand-apple{transform:none}}
/* Decorative indicators share the page's blue-violet light. */
.header-dot,.status-dot{position:relative;width:6px;height:6px;display:inline-block;flex:none;border-radius:50%;background:#e0e6ff;box-shadow:0 0 5px #b1bfff,0 0 11px rgba(142,159,255,.65);pointer-events:none}
.header-dot:before,.status-dot:before{content:"";position:absolute;inset:-6px;border-radius:50%;background:radial-gradient(circle,rgba(177,191,255,.65),rgba(146,132,255,.24) 42%,transparent 72%);animation:indicator-breathe 2.8s ease-in-out infinite}
.header-dot:after,.status-dot:after{content:"";position:absolute;inset:-2px;border:1px solid rgba(177,191,255,.75);border-radius:50%;opacity:0;animation:indicator-ring 2.8s ease-out infinite}
.header-dot:before,.header-dot:after{animation-delay:-1.4s}
@keyframes indicator-breathe{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}
@keyframes indicator-ring{0%{opacity:0;transform:scale(.65)}15%{opacity:.65}80%,100%{opacity:0;transform:scale(1.85)}}
:is(.motion-paused,.motion-suspended) :is(.header-dot,.status-dot):before,:is(.motion-paused,.motion-suspended) :is(.header-dot,.status-dot):after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.header-dot:before,.status-dot:before{animation:none;opacity:.55;transform:none}.header-dot:after,.status-dot:after{animation:none;opacity:0}}
@media(max-width:1000px){.share-entry{gap:32px}.card-panel{padding:26px}.share-hero h1{font-size:34px}.front-main{padding-top:40px}.guide-step{padding:0 15px}}
@media(max-width:700px){.front-header{width:calc(100% - 36px);height:64px;margin-top:14px;padding:0 14px;border-radius:16px}.front-main{width:calc(100% - 36px);padding-top:30px}.share-entry{grid-template-columns:1fr;gap:26px;margin-bottom:30px}.share-hero h1{font-size:32px;max-width:none}.share-hero h1 br{display:block}.hero-badge{margin-bottom:14px}.share-hero>p{max-width:none;margin-top:12px;font-size:13px}.hero-note{margin-top:14px}.purchase-btn{margin-top:10px}.card-panel{padding:24px}.usage-guide{gap:18px;padding:22px 0}.guide-step{flex-direction:column;align-items:flex-start;gap:10px;padding:0 12px}.step-number{font-size:20px}.guide-step p{font-size:11px}.guide-step strong{font-size:12px}.faq-panel{grid-template-columns:1fr;gap:20px;margin-top:28px}.section-heading h2{font-size:20px}.share-notice{padding:16px;gap:11px}.account-list{grid-template-columns:1fr}.result-summary{gap:18px;flex-wrap:wrap}.result-summary .btn{margin-left:0;width:100%}.result-hero h1{font-size:28px}.account{padding:20px}.header-context{font-size:10px}.brand{font-size:14px;gap:8px}.brand .logo{width:32px;height:32px;border-radius:10px}}
@media(max-width:380px){.header-context{display:none}.guide-step{padding:0 8px}.card-panel{padding:20px}.share-hero h1{font-size:29px}.acts .mini-btn{padding:10px 8px}}
