:root{--orange:#ff6545;--orange2:#ff9270;--ink:#29231f;--muted:#8d847e;--cream:#fff8ef;--card:#fffdf9;--line:#eee5dd;--purple:#766adf;--yellow:#ffc857;--shadow:0 14px 35px rgba(114,70,43,.10)}
*{box-sizing:border-box}[hidden]{display:none!important}html{scroll-behavior:smooth;touch-action:pan-y}body{margin:0;background:#f7f0e8;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;touch-action:pan-y}button,input,select{font:inherit;touch-action:manipulation}.app-shell{width:min(100%,480px);min-height:100vh;margin:auto;background:var(--cream);overflow:hidden;box-shadow:0 0 50px rgba(56,40,31,.08)}
.topbar{height:80px;padding:22px 22px 10px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:linear-gradient(145deg,#ffb05f,var(--orange));color:#fff;font-size:21px;font-weight:900;box-shadow:0 8px 18px rgba(255,101,69,.25);transform:rotate(-4deg)}.brand b{font-size:17px}.brand small{display:block;margin-top:2px;color:#a79c93;font-size:7px;letter-spacing:1.6px}.round-button,.close-button{border:0;background:#fff;box-shadow:var(--shadow);cursor:pointer}.round-button{width:42px;height:42px;border-radius:50%;font-size:22px;color:var(--orange)}
.hero{position:relative;min-height:330px;padding:30px 26px 0;overflow:hidden;text-align:center}.hero:before{content:"";position:absolute;width:330px;height:330px;left:75px;top:-60px;border-radius:46% 54% 61% 39%;background:linear-gradient(145deg,rgba(255,197,157,.28),rgba(206,193,255,.34));transform:rotate(24deg)}.hero>*{position:relative;z-index:2}.eyebrow{display:block;color:var(--orange);font-size:10px;font-weight:800;letter-spacing:2px}.hero h1{margin:15px 0 10px;font-size:47px;line-height:1.13;letter-spacing:-2px}.hero h1 em{color:var(--orange);font-style:normal;text-shadow:0 5px 0 #ffd8c9}.hero p{color:#7b716b;font-size:15px}.hero-doodle{position:absolute;z-index:3}.doodle-star{top:33px;right:70px;color:var(--yellow);font-size:30px;transform:rotate(12deg)}.doodle-dot{width:17px;height:17px;left:42px;top:122px;background:#bdb1ff;border-radius:50%;box-shadow:0 5px 8px rgba(118,106,223,.2)}.hero-art{position:absolute!important;z-index:1!important;left:0;right:0;bottom:0;height:120px}.rainbow{position:absolute;border-radius:160px 160px 0 0;border-style:solid;border-bottom:0;transform:rotate(-7deg)}.r1{width:245px;height:115px;left:118px;bottom:-26px;border-width:24px;border-color:#ff8d6e}.r2{width:196px;height:90px;left:142px;bottom:-22px;border-width:21px;border-color:#ffc85d}.r3{width:151px;height:68px;left:165px;bottom:-18px;border-width:20px;border-color:#9288e8}.cloud{position:absolute;width:75px;height:31px;background:white;border-radius:30px;box-shadow:25px -17px 0 -3px white,-22px -7px 0 -7px white}.cloud-a{left:25px;bottom:15px}.cloud-b{right:-12px;bottom:36px;transform:scale(.75)}
.hero.has-poster{min-height:0;background-position:center;background-size:cover}.hero.has-poster:before,.hero.has-poster .hero-art,.hero.has-poster .hero-doodle{display:none}.hero.has-poster>*{text-shadow:0 2px 12px rgba(255,255,255,.85)}
.hero.has-poster+.event-card{margin-top:calc(-6px - var(--poster-overlap,0px))}
.event-card{position:relative;margin:-6px 18px 20px;padding:22px 15px 17px;background:rgba(255,255,255,.9);border:1px solid #fff;border-radius:24px;box-shadow:var(--shadow);z-index:4}.stats{display:grid;grid-template-columns:repeat(3,1fr);text-align:center}.stats div+div{border-left:1px solid var(--line)}.stats strong{display:block;color:var(--orange);font-size:25px}.stats div:nth-child(2) strong{color:var(--purple)}.stats span{font-size:11px;color:#716963}.countdown{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:17px;padding-top:15px;border-top:1px dashed #eadfd6;color:#716963;font-size:11px}.countdown b{padding:5px 6px;border:1px solid #ffded4;border-radius:7px;color:var(--orange);font-size:14px}.clock{color:#ffad3e;font-size:21px}
.search-wrap{display:flex;align-items:center;gap:8px;margin:0 18px 18px;padding:6px 6px 6px 16px;background:white;border:1px solid #fff;border-radius:24px;box-shadow:0 10px 25px rgba(114,70,43,.08)}.search-wrap>span{color:#8d8782;font-size:28px;line-height:1;transform:rotate(-15deg)}.search-wrap input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--ink);font-size:13px}.search-wrap input::placeholder{color:#b0aaa5}.search-wrap button,.primary-button{border:0;border-radius:18px;background:linear-gradient(135deg,var(--orange2),var(--orange));color:#fff;font-weight:800;cursor:pointer}.search-wrap button{padding:12px 19px}
.tabs{display:grid;grid-template-columns:repeat(3,1fr);margin:0 18px 24px;padding:5px;border-radius:19px;background:#fff;box-shadow:0 8px 22px rgba(114,70,43,.07)}.tab{position:relative;padding:12px 3px;border:0;background:transparent;color:#746c67;font-weight:700;cursor:pointer}.tab.active{color:var(--orange)}.tab.active:after{content:"";position:absolute;left:35%;right:35%;bottom:4px;height:3px;border-radius:5px;background:var(--orange)}
.tab-panel{display:none;padding:0 18px 30px}.tab-panel.active{display:block}.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin:0 2px 16px}.section-head h2,.about-card h2{margin:5px 0 0;font-size:22px}.section-head select{padding:7px 9px;border:1px solid #efe3d9;border-radius:10px;background:#fff;color:#766e68;font-size:11px;outline:0}.art-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.art-card{position:relative;overflow:hidden;background:#fff;border-radius:9.5px;box-shadow:0 5px 12px rgba(84,55,37,.09);cursor:pointer;transition:.2s transform}.art-card:active{transform:scale(.98)}.art-card img{display:block;width:100%;aspect-ratio:1/1.08;object-fit:cover;background:#eee}.number-pill{display:inline-block;padding:5px 10px;border-radius:10px;background:#fff0e9;color:var(--orange);font-size:11px;font-weight:800}.art-card>.number-pill{position:absolute;top:9px;left:9px;background:rgba(255,101,69,.92);color:#fff;backdrop-filter:blur(6px)}.art-info{padding:12px}.art-info h3{overflow:hidden;margin:0 0 4px;font-size:15px;white-space:nowrap;text-overflow:ellipsis}.art-info p{overflow:hidden;margin:0 0 11px;color:#968c85;font-size:10px;white-space:nowrap;text-overflow:ellipsis}.card-foot{display:flex;align-items:center;justify-content:space-between}.card-foot span{color:var(--orange);font-size:12px;font-weight:700}.mini-vote{width:29px;height:29px;border:0;border-radius:50%;background:#fff1ec;color:var(--orange);font-size:17px;cursor:pointer}.empty{padding:35px 10px;text-align:center;color:var(--muted);font-size:13px}
.updated{color:#aaa09a;font-size:10px}.ranking-list{overflow:hidden;background:white;border-radius:22px;box-shadow:var(--shadow)}.rank-row{display:grid;grid-template-columns:35px 58px 1fr auto;gap:11px;align-items:center;padding:14px}.rank-row+.rank-row{border-top:1px solid var(--line)}.rank-num{font-size:16px;font-weight:900;text-align:center}.rank-row:nth-child(1) .rank-num{color:#efaa20}.rank-row:nth-child(2) .rank-num{color:#9cabb8}.rank-row:nth-child(3) .rank-num{color:#c98051}.rank-row img{width:58px;height:58px;border-radius:16px;object-fit:cover}.rank-row h3{margin:0 0 4px;font-size:14px}.rank-row p{margin:0;color:#9b918a;font-size:10px}.rank-votes{color:var(--orange);font-size:12px;font-weight:800}
.about-card{padding:25px 22px;background:#fff;border-radius:24px;box-shadow:var(--shadow)}.about-card>p{color:#756d68;font-size:13px;line-height:1.8}#aboutBody,#aboutAwards,#aboutPrivacy{white-space:pre-line}.rule{display:grid;grid-template-columns:75px 1fr;gap:10px;padding:16px 0;border-top:1px solid var(--line);font-size:12px}.rule b{color:var(--orange)}.rule span{color:#756d68;line-height:1.6}.about-card .privacy{margin:13px -5px -5px;padding:13px;border-radius:13px;background:#fff7ee;color:#a27b62;font-size:10px}footer{padding:10px 20px calc(26px + env(safe-area-inset-bottom));color:#b1a8a0;text-align:center;font-size:9px}
.detail-modal{position:fixed;z-index:20;inset:0;display:none;align-items:flex-end;justify-content:center}.detail-modal.open{display:flex}.modal-backdrop{position:absolute;inset:0;background:rgba(41,31,25,.45);backdrop-filter:blur(5px)}.detail-sheet{position:relative;z-index:1;width:min(100%,480px);max-height:92vh;overflow:auto;background:var(--cream);border-radius:15px 15px 0 0;animation:slideUp .3s ease}.detail-sheet>img{display:block;width:100%;max-height:390px;object-fit:cover;background:#eee}.close-button{position:absolute;z-index:2;top:15px;right:15px;width:38px;height:38px;border-radius:50%;font-size:24px}.detail-content{padding:22px 22px calc(22px + env(safe-area-inset-bottom))}.detail-content h2{margin:10px 0 5px;font-size:24px}.artist-line{margin:0;color:var(--muted);font-size:12px}.detail-stats{display:grid;grid-template-columns:1fr 1fr;margin:20px 0;padding:16px 0;border-block:1px solid var(--line)}.detail-stats span{text-align:center;color:var(--muted);font-size:11px}.detail-stats span+span{border-left:1px solid var(--line)}.detail-stats b{display:block;margin-bottom:3px;color:var(--orange);font-size:24px}.detail-content>p:last-of-type{color:#736a64;font-size:13px;line-height:1.8}.primary-button{width:100%;padding:16px;border-radius:36px;font-size:16px;box-shadow:0 10px 22px rgba(255,101,69,.25)}.toast{position:fixed;z-index:30;left:50%;top:50%;bottom:auto;width:max-content;max-width:calc(100% - 48px);padding:16px 24px;border-radius:16px;background:var(--orange);box-shadow:0 12px 30px rgba(255,101,69,.32);color:#fff;font-size:15px;font-weight:700;line-height:1.5;text-align:center;opacity:0;pointer-events:none;transform:translate(-50%,calc(-50% + 16px)) scale(.96);transition:.25s}.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
@keyframes slideUp{from{transform:translateY(60px);opacity:.3}to{transform:translateY(0);opacity:1}}@media(min-width:481px){body{padding:25px 0}.app-shell{border-radius:32px}.detail-sheet{bottom:15px;border-radius:15px}}

/* Two explicit masonry columns preserve left-to-right, then top-to-bottom ordering. */
.art-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;align-items:start}
.art-column{display:flex;min-width:0;flex-direction:column;gap:13px}
.art-card{display:block;width:100%;margin:0;break-inside:avoid;-webkit-column-break-inside:avoid}
.art-card img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;background:#f4eee8}

/* Keep the full, uncropped artwork in the detail sheet as well. */
.detail-sheet>img{width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;background:#f4eee8}

#gallery .section-head h2{font-size:20px}
.art-info p,.rank-row p{font-size:12px}.artist-line{font-size:14px}

/* Standalone artwork detail page. */
.detail-body{margin:0!important;padding:0!important;overflow-x:hidden}.detail-page-shell{min-height:100vh;margin:0 auto;animation:detailSlideIn .34s cubic-bezier(.22,.75,.25,1) both}.detail-topbar{position:sticky;z-index:10;top:0;height:72px;padding:15px 18px;display:grid;grid-template-columns:42px 1fr 42px;align-items:center;background:transparent;backdrop-filter:none;text-align:center}.detail-back{width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:var(--ink);box-shadow:var(--shadow);font-size:34px;line-height:1;cursor:pointer}.detail-page{padding-bottom:24px}.detail-art-wrap{margin:0 18px;overflow:hidden;border-radius:15px;background:#f4eee8;box-shadow:var(--shadow)}.detail-art-wrap img{display:block;width:100%;height:auto}.detail-page-card{position:relative;margin:-4px 18px 0;padding:24px 20px 22px;background:#fff;border-radius:0 0 15px 15px;box-shadow:var(--shadow)}.detail-page-card h1{margin:10px 0 6px;font-size:26px}.detail-intro{margin:0 0 22px;color:#736a64;font-size:13px;line-height:1.8}.detail-missing{padding:100px 22px;text-align:center}.detail-missing h1{font-size:22px}.detail-missing a{color:var(--orange);font-weight:800;text-decoration:none}
@keyframes detailSlideIn{from{opacity:.45;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}
.detail-page-shell.is-leaving{animation:detailSlideOut .28s cubic-bezier(.55,.05,.8,.5) both;pointer-events:none}
@keyframes detailSlideOut{from{opacity:1;transform:translateX(0)}to{opacity:.45;transform:translateX(100%)}}
.detail-back{display:grid;place-items:center;line-height:0}.detail-back svg{display:block;width:20px;height:20px}.detail-topbar-spacer{width:42px;height:42px}
.detail-art-wrap,.detail-page-card{box-shadow:0 5px 12px rgba(84,55,37,.09)}
.detail-art-wrap{border-radius:15px 15px 0 0}
.detail-page-card>.number-pill{display:table;margin-inline:auto}.detail-page-card h1,.detail-page-card .artist-line{text-align:center}
@media(min-width:481px){body.detail-body{padding:0}.detail-page-shell{border-radius:0 0 32px 32px}}
@media(prefers-reduced-motion:reduce){.detail-page-shell,.detail-page-shell.is-leaving{animation:none}}
