:root{--text: #222;--text-soft: rgba(0, 0, 0, .75);--text-muted: rgba(0, 0, 0, .55);--panel-bg: rgba(255, 255, 255, .94);--card-bg: rgba(255, 255, 255, .85);--border-soft: rgba(0, 0, 0, .06);--border: rgba(0, 0, 0, .12);--border-strong: rgba(0, 0, 0, .18);--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--shadow-card: 0 18px 55px rgba(0, 0, 0, .12);--shadow-panel: 0 22px 70px rgba(0, 0, 0, .35)}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,PingFang SC,Microsoft YaHei,Arial,sans-serif;background:radial-gradient(1200px 800px at 50% 20%,#fff,#f6f7fb 45%,#eef0f7)}#app,.app-shell{min-height:100vh}.app-shell{display:flex;align-items:center;justify-content:center;padding:24px}.card,.panel{border-radius:var(--radius-lg)}.card{position:relative;width:min(420px,92vw);padding:28px 24px 30px;text-align:center;background:var(--card-bg);border:1px solid var(--border-soft);box-shadow:var(--shadow-card)}.title{margin:0 0 18px;font-size:22px;font-weight:700;letter-spacing:.5px}.panel{width:min(520px,92vw);padding:18px 18px 16px;background:var(--panel-bg);border:1px solid rgba(255,255,255,.5);box-shadow:var(--shadow-panel)}.panel--wide{width:min(760px,92vw)}.panel--fullscreen{width:min(980px,96vw);padding:12px}.panel h2{margin:4px 0 10px;font-size:20px}.panel p{margin:8px 0;line-height:1.6;color:var(--text-soft)}.panel-title--clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999;display:grid;place-items:center;background:#0000008c;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.overlay--top{z-index:1200}.row{display:flex;gap:10px;align-items:center;margin-top:12px}.btn,.btn2,.nav{cursor:pointer;-webkit-user-select:none;user-select:none;background:linear-gradient(#fff,#f0f0f0)}.btn:active,.btn2:active,.nav:active{transform:translateY(1px)}.btn{position:relative;display:inline-block;padding:10px 26px;font-size:18px;font-weight:600;color:#7a1f1f;border:2px solid #9a9a9a;border-radius:6px;box-shadow:inset 0 1px #ffffffe6,0 2px #00000014;outline:none}.btn:after{content:"";position:absolute;top:-10px;right:-14px;bottom:-10px;left:-14px;border:2px dotted rgba(0,0,0,.45);border-radius:10px;pointer-events:none}.btn2,.nav,input[type=password]{border:1px solid var(--border-strong)}.btn2{padding:10px 14px;font-weight:600;border-radius:var(--radius-sm)}input[type=password]{flex:1;padding:10px 12px;font-size:15px;background:#fff;border-radius:var(--radius-sm);outline:none}input[type=password]:focus{border-color:#00000059;box-shadow:0 0 0 4px #0000000f}.msg,.tapTip,.closeHint{margin-top:10px;font-size:13px;min-height:18px}.msg{color:#b00020}.closeHint{color:var(--text-muted);text-align:center}.tapTip{display:flex;justify-content:center;color:#111}.tapTip span{padding:6px 10px;border:1px solid var(--border);border-radius:999px;background:#00000014}.carousel{position:relative;display:grid;grid-template-columns:44px 1fr 44px;gap:10px;align-items:center;margin-top:14px}.stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:320px;overflow:hidden;background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:var(--radius-lg)}.stage img{display:block;width:auto;max-width:100%;height:auto;max-height:420px;object-fit:contain;cursor:zoom-in}.caption{position:absolute;left:10px;bottom:10px;max-width:calc(100% - 20px);overflow:hidden;padding:6px 10px;color:#fff;white-space:nowrap;text-overflow:ellipsis;background:#0000008c;border-radius:999px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:12px}.nav{display:grid;place-items:center;width:44px;height:44px;font-size:28px;font-weight:700;border-radius:var(--radius-md)}.dots{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:12px}.dot{width:10px;height:10px;padding:0;cursor:pointer;background:#0000002e;border:1px solid rgba(0,0,0,.25);border-radius:999px}.dot.active{background:#000000a6}.fullscreen-image{display:block;width:100%;height:auto;max-height:78vh;object-fit:contain;background:#000;border-radius:var(--radius-md)}.flash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:998;opacity:0;pointer-events:none;background:radial-gradient(circle at 30% 30%,#fffffff2,#fff0 55%),radial-gradient(circle at 70% 60%,#ffffffe6,#fff0 60%)}.flash.on{animation:flash .45s ease-out 1}.shake{animation:shake .35s linear 1}.titleShake{animation:titleShake .28s ease-in-out 1}.heart-shot{position:fixed;z-index:1400;pointer-events:none;width:var(--size);height:var(--size);transform:translate(-50%,-50%) rotate(var(--rot));animation:heartBurst var(--dur) ease-out forwards;display:flex;align-items:center;justify-content:center}.heart-shot:before{content:"❤";font-size:var(--size);line-height:1;color:#ff5a8c;text-shadow:0 4px 10px rgba(255,80,120,.35)}@keyframes flash{0%{opacity:0}25%{opacity:1}to{opacity:0}}@keyframes shake{0%{transform:translate(0) rotate(0)}15%{transform:translate(-2px,1px) rotate(-1deg)}30%{transform:translate(3px) rotate(1deg)}45%{transform:translate(-3px,1px) rotate(-1deg)}60%{transform:translate(2px,-1px) rotate(1deg)}75%{transform:translate(-1px) rotate(0)}to{transform:translate(0) rotate(0)}}@keyframes titleShake{0%{transform:translate(0)}20%{transform:translate(-3px)}40%{transform:translate(3px)}60%{transform:translate(-2px)}80%{transform:translate(2px)}to{transform:translate(0)}}@keyframes heartbeat{0%,to{transform:rotate(-45deg) scale(1)}25%{transform:rotate(-45deg) scale(1.08)}50%{transform:rotate(-45deg) scale(1)}75%{transform:rotate(-45deg) scale(1.12)}}@keyframes heartBurst{0%{opacity:.95;transform:translate(-50%,-50%) scale(.6) rotate(0)}to{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(1.25) rotate(var(--rot))}}.gesture-panel{-webkit-user-select:none;user-select:none;touch-action:none}.gesture-box{margin-top:18px}.gesture-tip{display:flex;justify-content:center;margin-bottom:12px}.gesture-tip span{padding:6px 12px;font-size:13px;color:#111;border:1px solid var(--border);border-radius:999px;background:#0000000f}.gesture-track{position:relative;width:min(520px,100%);height:220px;margin:0 auto;overflow:hidden;border:1px solid var(--border);border-radius:24px;background:linear-gradient(180deg,#fffffff5,#f5f5f5f5)}.gesture-sprite-wrap{position:absolute;left:50%;top:50%;width:180px;height:180px;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-58%);transition:filter .2s ease;pointer-events:none}.gesture-sprite-wrap.dragging{filter:drop-shadow(0 8px 14px rgba(0,0,0,.12))}.gesture-sprite-wrap.unlocked{filter:drop-shadow(0 10px 18px rgba(255,105,145,.22))}.gesture-sprite{width:128px;height:128px;transform:scale(1.6);transform-origin:center;image-rendering:pixelated;background-repeat:no-repeat}.gesture-progress{position:absolute;left:22px;right:22px;bottom:18px;height:10px;overflow:hidden;border-radius:999px;background:#00000014}.gesture-progress-bar{width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff9ab3,#ff5f8f);transition:width .08s linear}.back-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 18px;border:1px solid rgba(255,123,180,.18);border-radius:999px;background:linear-gradient(135deg,#fff,#fff4fa);color:#ff4f97;font-weight:700;text-decoration:none;box-shadow:0 10px 24px #ff7bb41f;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.back-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px #ff7bb42e;border-color:#ff7bb447}.back-btn:before{content:"←";font-size:14px}.panel-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:18px}.btn,.btn2,.back-btn,.nav,button,a.btn2,a.back-btn{-webkit-tap-highlight-color:transparent}.btn,.btn2,.back-btn,.nav,a.btn2,a.back-btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;text-decoration:none;line-height:1}.btn{padding:12px 28px;border:none;border-radius:999px;color:#fff;background:linear-gradient(135deg,#ff7abf,#ff5aa5);box-shadow:0 14px 30px #ff6aa947;font-size:17px;font-weight:800;letter-spacing:.02em;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}.btn:after{display:none}.btn:hover,.btn2:hover,.back-btn:hover,.nav:hover{transform:translateY(-2px)}.btn:hover{box-shadow:0 18px 32px #ff6aa957}.btn2,.nav,a.btn2{min-height:44px;padding:0 18px;border:1px solid rgba(255,123,180,.2);border-radius:999px;background:linear-gradient(180deg,#fff,#fff5fa);color:#ff4f97;font-weight:700;box-shadow:0 10px 24px #ff7bb41f;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,color .2s ease,background .2s ease}.btn2:hover,.nav:hover,.back-btn:hover,a.btn2:hover,a.back-btn:hover{box-shadow:0 14px 28px #ff7bb42e;border-color:#ff7bb44d;background:linear-gradient(180deg,#fff,#fff0f7)}.back-btn,a.back-btn{min-height:44px;padding:0 18px;border-color:#ff7bb433;background:linear-gradient(180deg,#fff,#fff2f8)}button:disabled,.btn:disabled,.btn2:disabled,.back-btn:disabled{cursor:not-allowed;opacity:.66;transform:none;box-shadow:none}@media (max-width: 768px){.app-shell{padding:14px;align-items:flex-start}.card,.panel,.panel--wide,.panel--fullscreen{width:min(100%,100vw - 28px)}.card{padding:24px 18px 22px}.panel{padding:16px 14px 14px}.panel-actions,.row{flex-direction:column;align-items:stretch}.btn,.btn2,.back-btn,.nav,a.btn2,a.back-btn{width:100%}.carousel{grid-template-columns:1fr}.nav{width:100%}.stage{min-height:220px}}
