/* Pho 20/10 landing: pixel pink/red/gold, same palette as web/loading. No fonts, no images. */
:root{--bg:#ffc4d6;--bg2:#ffe3ec;--ink:#3a142e;--plum:#461838;--pink:#ff6fa8;--pink2:#ff8cba;--red:#e8244f;--gold:#ffd65c;--leaf:#3fa34d;--paper:#fff7f0}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;min-height:100vh;min-height:100dvh;color:var(--ink);background:radial-gradient(circle at 50% 22%,var(--bg2),var(--bg) 72%) fixed;
font:600 15px/1.4 'Noto Sans','Segoe UI',Roboto,Arial,sans-serif;-webkit-tap-highlight-color:transparent;overflow-x:hidden}
.lp-main{position:relative;z-index:1;min-height:100vh;min-height:100dvh;max-width:520px;margin:0 auto;
padding:max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
display:flex;flex-direction:column;justify-content:center;gap:12px;text-align:center}
[hidden]{display:none!important}
h1,h2,p{margin:0}
.mono,.lp-title,.lp-num,.lp-clock b,.lp-cta{font-family:ui-monospace,'Courier New',monospace;font-variant-numeric:tabular-nums}
.lp-title{font-weight:900;font-size:clamp(32px,11vw,52px);line-height:1;letter-spacing:1px;color:var(--red);text-shadow:3px 3px 0 var(--gold),5px 5px 0 var(--ink)}
.lp-title b{color:var(--pink)}
.lp-sub{margin-top:8px;font-size:14px;opacity:.85}
.lp-card{background:var(--paper);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink),0 0 0 3px var(--gold) inset;padding:12px 14px}
.lp-label{font-size:13px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--plum);display:flex;align-items:center;justify-content:center;gap:8px}
.lp-num{font-weight:900;font-size:clamp(44px,15vw,72px);line-height:1.05;color:var(--red);text-shadow:3px 3px 0 var(--gold);margin:4px 0 6px;word-break:break-all}
.lp-num.lp-bump{animation:lp-bump .3s steps(2)}
.lp-bar{height:16px;border:3px solid var(--ink);background:var(--plum);overflow:hidden}
.lp-bar i{display:block;height:100%;width:0;background:repeating-linear-gradient(45deg,var(--pink) 0 6px,var(--pink2) 6px 12px);transition:width .6s steps(8)}
.lp-meta{display:flex;justify-content:space-between;gap:8px;margin-top:4px;font-size:12px;opacity:.85;font-variant-numeric:tabular-nums;text-align:left}
.lp-meta span:last-child{text-align:right}
.lp-online{margin-top:8px;font-size:14px;color:var(--leaf)}
.lp-online::before{content:"";display:inline-block;width:8px;height:8px;margin-right:6px;background:var(--leaf);box-shadow:0 0 0 2px var(--ink);vertical-align:1px}
.lp-stale{margin-top:6px;font-size:12px;opacity:.65}
.lp-clock{display:flex;justify-content:center;gap:8px;margin-top:6px}
.lp-clock span{min-width:64px;padding:6px 4px 4px;background:var(--plum);color:#fff;border:3px solid var(--ink);display:flex;flex-direction:column;align-items:center}
.lp-clock b{font-size:clamp(24px,8vw,32px);line-height:1;color:var(--gold)}
.lp-clock small{font-size:11px;opacity:.85;margin-top:2px}
.lp-cdmsg{margin-top:6px;font-weight:800;color:var(--red)}
.lp-cdline{margin:2px 0 6px;font-weight:800}
.lp-wish{min-height:74px;padding:8px 10px;border:2px dashed var(--plum);background:rgba(255,255,255,.55);display:flex;flex-direction:column;justify-content:center;transition:opacity .35s}
.lp-wish.lp-fade{opacity:0}
.lp-wt{font-weight:500;font-size:15px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.lp-wt::before{content:"“"}.lp-wt::after{content:"”"}
.lp-wn{margin-top:2px;font-size:12px;opacity:.7}
.lp-go{position:sticky;bottom:0;z-index:2;display:flex;flex-direction:column;align-items:center;gap:4px;margin:0 -16px;padding:10px 16px max(8px,env(safe-area-inset-bottom));
background:linear-gradient(rgba(255,196,214,0),var(--bg) 22%)}
.lp-cta{display:block;width:100%;max-width:380px;padding:16px 12px;font-weight:900;font-size:clamp(20px,6.4vw,26px);letter-spacing:1px;color:#fff;text-decoration:none;
background:var(--red);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink),0 0 0 3px var(--gold) inset;animation:lp-pulse 1.6s steps(2) infinite}
.lp-cta:hover{background:#ff3a64}
.lp-cta:active{transform:translate(4px,4px);box-shadow:1px 1px 0 var(--ink),0 0 0 3px var(--gold) inset}
.lp-note{font-size:12px;opacity:.75;max-width:30em}
.lp-share{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}
.lp-sb{font:800 14px ui-monospace,'Courier New',monospace;color:var(--ink);background:var(--gold);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);
padding:8px 12px;min-height:44px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.lp-sb:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
a:focus-visible,button:focus-visible{outline:3px solid var(--plum);outline-offset:3px}
.lp-foot{font-size:12px;opacity:.8;padding-top:2px}
.lp-foot a{color:var(--plum);padding:0 6px;min-height:44px;display:inline-flex;align-items:center}
/* pixel flower icon (4px pixels) */
.lp-fl{position:relative;width:12px;height:12px;flex:none}
.lp-fl::before{content:"";position:absolute;left:0;top:0;width:4px;height:4px;
box-shadow:4px 0 var(--red),0 4px var(--red),4px 4px var(--gold),8px 4px var(--red),4px 8px var(--red)}
/* falling pixel petals (decorative) */
.lp-sky{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.lp-sky i{position:absolute;top:-20px;width:8px;height:8px;background:var(--pink);box-shadow:4px 4px 0 var(--pink2);animation:lp-fall 11s linear infinite}
.lp-sky i:nth-child(1){left:8%;animation-delay:-1s}.lp-sky i:nth-child(2){left:24%;animation-delay:-6s;animation-duration:14s}
.lp-sky i:nth-child(3){left:46%;animation-delay:-3s;background:var(--red)}.lp-sky i:nth-child(4){left:63%;animation-delay:-9s;animation-duration:13s}
.lp-sky i:nth-child(5){left:80%;animation-delay:-4s;background:var(--gold)}.lp-sky i:nth-child(6){left:92%;animation-delay:-7s;animation-duration:16s}
@keyframes lp-fall{to{transform:translate3d(40px,calc(100vh + 40px),0) rotate(360deg)}}
@keyframes lp-pulse{50%{box-shadow:5px 5px 0 var(--ink),0 0 0 3px var(--pink2) inset}}
@keyframes lp-bump{50%{transform:scale(1.06)}}
/* short or landscape phones: two columns */
@media (orientation:landscape) and (max-height:540px){
.lp-main{max-width:860px;display:grid;grid-template-columns:1fr 1fr;align-content:center;column-gap:18px;row-gap:10px}
.lp-top,.lp-foot,.lp-share{grid-column:1/-1}.lp-go{position:static;margin:0;padding:0;background:none;justify-content:center}.lp-sub{margin-top:4px}.lp-main{padding-top:max(10px,env(safe-area-inset-top))}.lp-num{font-size:clamp(36px,10vh,56px)}.lp-title{font-size:clamp(28px,9vh,40px)}}
@media (max-width:340px){.lp-clock span{min-width:54px}.lp-clock{gap:5px}body{font-size:14px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.lp-sky{display:none}}
.lp-cta-weak{opacity:.7}