.useless-index-page, .useless-tool-page { --useless-accent: #9a72e5; --useless-accent-rgb: 154,114,229; --useless-deep: #17172a; background: #ece9e1; }

.useless-index-main { min-height: 100vh; background: #eeebe4; }
.useless-index-hero { position: relative; min-height: 430px; padding: calc(var(--tb-nav-height) + 66px) max(24px, calc((100vw - 1120px) / 2)) 100px; overflow: hidden; color: #f9f5ea; background: radial-gradient(circle at 78% 28%, rgba(143,103,202,.44), transparent 30%), radial-gradient(circle at 24% 110%, rgba(59,156,142,.3), transparent 38%), linear-gradient(130deg, #0d1725, #1c1830 58%, #19333a); isolation: isolate; }
.useless-index-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .12; background-image: radial-gradient(circle at 1px 1px, #fff 1px, transparent 0); background-size: 28px 28px; mask-image: linear-gradient(90deg, transparent, #000 55%, transparent); }
.useless-back-link { position: relative; z-index: 2; display: inline-flex; color: rgba(249,245,234,.57); font-size: 11px; }
.useless-kicker { display: block; margin-top: 34px; color: #dbb96f; font-size: 9px; font-weight: 800; letter-spacing: .18em; }
.useless-index-hero h1 { margin: 9px 0 8px; font-size: clamp(48px, 6vw, 70px); line-height: 1; letter-spacing: -.06em; }
.useless-index-hero > p { max-width: 520px; margin: 0; color: rgba(249,245,234,.64); font-size: 15px; line-height: 1.75; }
.useless-index-meta { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 8px; }.useless-index-meta span { padding: 7px 10px; border: 1px solid rgba(255,255,255,.11); border-radius: 999px; color: rgba(249,245,234,.67); background: rgba(255,255,255,.055); font-size: 9px; }
.useless-orbit { --orbit-x: 0px; --orbit-y: 0px; position: absolute; right: max(5%, calc((100vw - 1120px) / 2)); top: 92px; width: 260px; height: 260px; display: grid; place-items: center; border: 1px solid rgba(221,187,113,.2); border-radius: 50%; transform: translate3d(var(--orbit-x),var(--orbit-y),0); transition: transform .9s cubic-bezier(.2,.75,.25,1); will-change: transform; }
.useless-orbit::before,.useless-orbit::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }.useless-orbit::before { inset: -18px; border: 1px solid rgba(166,135,206,.08); animation: orbit-breathe 7s ease-in-out infinite; }.useless-orbit::after { inset: 11px; background: radial-gradient(circle,rgba(220,188,119,.055),rgba(135,102,191,.025) 48%,transparent 69%); animation: orbit-halo 9s ease-in-out infinite; }
.orbit-glow { position: absolute; inset: 29%; border-radius: 50%; background: radial-gradient(circle,rgba(225,196,126,.14),rgba(157,112,202,.06) 46%,transparent 72%); filter: blur(8px); animation: orbit-glow 5.8s ease-in-out infinite; }
.useless-orbit .orbit-track { position: absolute; display: block; border-radius: 50%; animation: useless-orbit 30s linear infinite; }
.useless-orbit .orbit-track::before,.useless-orbit .orbit-track::after { content: ""; position: absolute; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px currentColor; }
.useless-orbit .orbit-track::before { left: 50%; top: -3px; width: 6px; height: 6px; transform: translateX(-50%); }.useless-orbit .orbit-track::after { right: 12%; bottom: 12%; width: 3px; height: 3px; opacity: .7; }
.useless-orbit .orbit-track-outer { inset: 0; color: #d8b86f; border: 1px solid rgba(221,187,113,.13); animation-duration: 38s; }
.useless-orbit .orbit-track-middle { inset: 28px; color: #70ad9f; border: 1px dashed rgba(114,184,171,.2); animation-direction: reverse; animation-duration: 27s; }
.useless-orbit .orbit-track-inner { inset: 67px; color: #d287a8; border: 1px dashed rgba(220,145,174,.2); animation-duration: 19s; }
.orbit-core { position: relative; z-index: 2; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; filter: drop-shadow(0 0 7px rgba(225,191,114,.45)); animation: orbit-core-spin 15s linear infinite; }.orbit-core::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: repeating-conic-gradient(from 0deg,#e1bf72 0 7deg,transparent 7deg 18deg); -webkit-mask: radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4px)); mask: radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4px)); }
.orbit-core span { width: 13px; height: 13px; border: 1px solid rgba(239,213,153,.7); border-radius: 50%; background: rgba(222,187,108,.16); box-shadow: 0 0 18px rgba(226,190,110,.38); animation: orbit-core-pulse 3.8s ease-in-out infinite; }
.orbit-star { position: absolute; z-index: 3; color: rgba(232,207,147,.72); font-size: 10px; font-style: normal; text-shadow: 0 0 10px currentColor; animation: orbit-star-float 6s ease-in-out infinite; }.orbit-star.star-one { left: 18%; top: 27%; }.orbit-star.star-two { right: 20%; top: 19%; color: rgba(130,196,181,.78); animation-delay: -2.1s; }.orbit-star.star-three { right: 19%; bottom: 22%; color: rgba(217,142,173,.68); animation-delay: -4.2s; }
.useless-orbit.is-paused *,.useless-orbit.is-paused::before,.useless-orbit.is-paused::after { animation-play-state: paused !important; }
.useless-catalog { position: relative; z-index: 3; width: min(1120px, calc(100% - 28px)); margin: -56px auto 78px; padding: 22px; border: 1px solid rgba(255,255,255,.6); border-radius: 28px; background: rgba(248,245,237,.82); box-shadow: 0 28px 70px rgba(33,28,44,.13); backdrop-filter: blur(18px); }
.useless-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 11px; }
.useless-card { --card-accent: #8d75c7; position: relative; min-height: 174px; padding: 16px; display: flex; flex-direction: column; overflow: hidden; color: #1d2025; border: 1px solid rgba(41,43,49,.09); border-radius: 18px; background: linear-gradient(145deg, rgba(255,255,255,.76), rgba(239,235,229,.62)); isolation: isolate; transition: transform .28s var(--tb-ease), border-color .28s ease, box-shadow .28s ease; -webkit-tap-highlight-color: transparent; }
.useless-card::before { content: ""; position: absolute; right: -45px; top: -55px; z-index: -1; width: 130px; height: 130px; border-radius: 50%; opacity: .14; background: radial-gradient(circle, var(--card-accent), transparent 67%); transition: transform .35s ease, opacity .3s ease; }.useless-card:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--card-accent) 32%, transparent); box-shadow: 0 14px 32px rgba(36,33,46,.08); }.useless-card:active { transform: scale(.975); }
.useless-card-icon { width: 39px; height: 39px; display: grid; place-items: center; color: var(--card-accent); border: 1px solid color-mix(in srgb, var(--card-accent) 20%, transparent); border-radius: 13px; background: color-mix(in srgb, var(--card-accent) 8%, white); font-size: 16px; font-weight: 800; }
.useless-card-state { position: absolute; right: 13px; top: 14px; max-width: 80px; overflow: hidden; color: #8a8781; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.useless-card strong { margin-top: auto; font-size: 19px; letter-spacing: -.025em; }.useless-card p { min-height: 32px; margin: 5px 22px 0 0; color: #777570; font-size: 10px; line-height: 1.55; }.useless-card > i { position: absolute; right: 15px; bottom: 13px; color: var(--card-accent); font-size: 12px; font-style: normal; }
.useless-card.is-coming { opacity: .72; cursor: default; }.useless-card.is-coming:hover { transform: none; box-shadow: none; }
.theme-violet { --card-accent: #8a68cf; }.theme-gold, .theme-amber { --card-accent: #bd8b36; }.theme-jade, .theme-mint { --card-accent: #4a907d; }.theme-ink, .theme-night { --card-accent: #39465d; }.theme-cinnabar, .theme-ember { --card-accent: #a65343; }.theme-wood { --card-accent: #97683e; }.theme-blue, .theme-teal { --card-accent: #427986; }.theme-rose { --card-accent: #b46183; }.theme-purple { --card-accent: #7656a6; }.theme-silver { --card-accent: #65707e; }

/* Shared tool layout. */
.useless-tool-main { min-height: 100vh; padding: calc(var(--tb-nav-height) + 24px) 18px 72px; color: #f9f5eb; background: radial-gradient(circle at 80% 12%, rgba(var(--useless-accent-rgb),.24), transparent 27%), radial-gradient(circle at 10% 90%, rgba(70,143,132,.18), transparent 34%), var(--useless-deep); }
.useless-tool-nav { width: min(680px,100%); margin: 0 auto 12px; display: flex; align-items: center; justify-content: space-between; gap: 14px; color: rgba(249,245,235,.54); font-size: 10px; }.useless-tool-nav a { min-height: 42px; display: inline-flex; align-items: center; }
.useless-tool-shell { position: relative; width: min(680px,100%); min-height: 690px; margin: auto; padding: 31px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 28px; background: linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.035)); box-shadow: 0 30px 80px rgba(0,0,0,.25); backdrop-filter: blur(18px); isolation: isolate; }
.useless-tool-shell::before { content: ""; position: absolute; right: -100px; top: -100px; z-index: -2; width: 330px; height: 330px; border-radius: 50%; background: radial-gradient(circle, rgba(var(--useless-accent-rgb),.22), transparent 69%); }
.useless-tool-header { position: relative; z-index: 3; text-align: center; }.useless-tool-header .useless-kicker { margin: 0; color: rgba(249,245,235,.44); }.useless-tool-header h1 { margin: 8px 0 5px; font-size: clamp(36px,7vw,50px); line-height: 1.05; letter-spacing: -.05em; }.useless-tool-header p { margin: 0; color: rgba(249,245,235,.56); font-size: 13px; }
.interaction-stage { position: relative; z-index: 3; min-height: 500px; padding-top: 35px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.useless-result { min-height: 74px; margin-top: 24px; }.useless-result strong { display: block; font-size: 22px; letter-spacing: -.025em; }.useless-result p { max-width: 410px; margin: 7px auto 0; color: rgba(249,245,235,.56); font-size: 12px; line-height: 1.6; }
.useless-primary { width: min(330px,100%); min-height: 56px; margin-top: 18px; padding: 13px 20px; color: #171923; border: 0; border-radius: 17px; background: linear-gradient(135deg, rgba(255,255,255,.94), color-mix(in srgb, rgb(var(--useless-accent-rgb)) 28%, white)); box-shadow: 0 14px 38px rgba(0,0,0,.2); font-size: 15px; font-weight: 800; transition: transform .2s ease, box-shadow .2s ease; -webkit-tap-highlight-color: transparent; }.useless-primary:hover { transform: translateY(-2px); box-shadow: 0 18px 43px rgba(0,0,0,.24); }.useless-primary:active { transform: scale(.965); }.useless-primary[disabled] { cursor: wait; opacity: .72; }
.useless-counter { margin: 17px 0 0; color: rgba(249,245,235,.52); font-size: 11px; }.useless-counter b { color: #fff8e8; font-size: 14px; }
.effect-layer { position: absolute; inset: 0; z-index: 8; overflow: hidden; pointer-events: none; }.fx-particle { position: absolute; left: var(--fx-x); top: var(--fx-y); width: var(--fx-size); height: var(--fx-size); border-radius: var(--fx-radius,50%); background: var(--fx-color); box-shadow: 0 0 12px var(--fx-color); animation: fx-burst var(--fx-duration) var(--tb-ease) forwards; }.fx-ripple { position: absolute; left: var(--fx-x); top: var(--fx-y); width: 18px; height: 18px; margin: -9px; border: 1px solid var(--fx-color); border-radius: 50%; animation: fx-ripple .72s ease-out forwards; }.fx-float { position: absolute; left: var(--fx-x); top: var(--fx-y); color: var(--fx-color); font-size: 16px; font-weight: 850; text-shadow: 0 2px 10px rgba(0,0,0,.28); animation: fx-float .9s ease-out forwards; }
.share-card-reserve { position: absolute; width: 1080px; height: 1440px; }

/* Smart */
.theme-violet.useless-tool-page { --useless-accent: #9c78ed; --useless-accent-rgb: 156,120,237; --useless-deep: #171629; }.smart-visual { position: relative; width: 190px; height: 170px; display: grid; place-items: center; }.smart-visual svg { position: relative; z-index: 2; width: 150px; color: #c8abff; filter: drop-shadow(0 0 22px rgba(161,120,235,.34)); }.smart-visual svg path:first-child { fill: rgba(154,113,229,.18); stroke: currentColor; stroke-width: 4; }.smart-visual svg path:last-child { fill: none; stroke: rgba(240,228,255,.76); stroke-width: 3; stroke-linecap: round; }.brain-ring { position: absolute; inset: 12px; border: 1px solid rgba(182,147,244,.22); border-radius: 50%; opacity: 0; }.brain-ring-two { inset: -4px; }.smart-visual.is-active svg { animation: brain-grow .65s var(--tb-ease); }.smart-visual.is-active .brain-ring { animation: brain-wave .75s ease-out; }.smart-visual.is-active .brain-ring-two { animation-delay: .1s; }

/* Luck */
.theme-gold.useless-tool-page { --useless-accent: #e0b34e; --useless-accent-rgb: 224,179,78; --useless-deep: #211b16; }.luck-visual { position: relative; width: 180px; height: 154px; display: grid; place-items: center; }.luck-star { position: relative; z-index: 2; color: #f1ca70; font-size: 102px; line-height: 1; filter: drop-shadow(0 0 25px rgba(234,184,73,.35)); }.luck-visual > i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #f1cb74; }.luck-visual > i:nth-of-type(1) { left: 14px; top: 33px; }.luck-visual > i:nth-of-type(2) { right: 20px; top: 22px; }.luck-visual > i:nth-of-type(3) { right: 5px; bottom: 20px; }.luck-visual.is-active { animation: luck-rise .7s var(--tb-ease); }.luck-meter { width: min(320px,90%); }.luck-meter > span { color: rgba(249,245,235,.55); font-size: 10px; }.luck-meter > strong { display: block; margin: 2px 0 7px; color: #f3cf7f; font-size: 34px; }.luck-meter > div { height: 6px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.1); }.luck-meter i { width: 0; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#b6802d,#f2d98c); transition: width .7s var(--tb-ease); }

/* Coin */
.theme-silver.useless-tool-page { --useless-accent: #9aa5b5; --useless-accent-rgb: 154,165,181; --useless-deep: #151b24; }.coin-scene { position: relative; width: 190px; height: 190px; display: grid; place-items: center; perspective: 800px; }.destiny-coin { position: relative; z-index: 2; width: 128px; height: 128px; transform-style: preserve-3d; }.coin-face { position: absolute; inset: 0; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.48); border-radius: 50%; color: #26303d; background: radial-gradient(circle at 32% 25%,#fff,#b8c0c9 58%,#687483); box-shadow: inset 0 0 0 8px rgba(64,74,88,.16), 0 18px 38px rgba(0,0,0,.28); font-size: 35px; font-weight: 900; backface-visibility: hidden; }.coin-back { transform: rotateY(180deg); }.coin-shadow { position: absolute; bottom: 8px; width: 105px; height: 17px; border-radius: 50%; background: rgba(0,0,0,.3); filter: blur(7px); }.destiny-coin.flip-front { animation: coin-flip-front 1.35s cubic-bezier(.2,.65,.2,1) forwards; }.destiny-coin.flip-back { animation: coin-flip-back 1.35s cubic-bezier(.2,.65,.2,1) forwards; }

/* Wooden fish */
.theme-wood.useless-tool-page { --useless-accent: #bf8350; --useless-accent-rgb: 191,131,80; --useless-deep: #211914; }.wooden-fish { position: relative; width: 210px; height: 180px; padding: 0; border: 0; background: transparent; -webkit-tap-highlight-color: transparent; }.wooden-fish-body { position: absolute; left: 25px; bottom: 12px; width: 160px; height: 120px; border-radius: 52% 48% 44% 56% / 62% 58% 42% 38%; background: radial-gradient(circle at 40% 25%,#d79b61,#8c512e 66%,#4e2e22); box-shadow: inset -14px -15px 28px rgba(51,24,17,.35), 0 23px 42px rgba(0,0,0,.3); }.wooden-fish-body::before { content: ""; position: absolute; left: 25px; right: 25px; top: 17px; height: 18px; border: 4px solid rgba(71,35,24,.7); border-bottom: 0; border-radius: 50% 50% 0 0; }.wooden-fish-body i { position: absolute; left: 77px; top: 4px; width: 7px; height: 104px; border-radius: 10px; background: rgba(49,24,20,.65); }.wooden-fish-stick { position: absolute; right: 12px; top: 5px; width: 14px; height: 132px; border-radius: 12px; background: linear-gradient(#d8b082,#74452e); transform: rotate(37deg); transform-origin: bottom; }.wooden-fish-stick::before { content: ""; position: absolute; left: -8px; top: -9px; width: 30px; height: 30px; border-radius: 50%; background: #c28a59; box-shadow: inset -4px -5px 8px rgba(71,35,24,.32); }.wooden-fish-glow { position: absolute; inset: 15px; border-radius: 50%; background: radial-gradient(circle,rgba(219,145,79,.25),transparent 65%); filter: blur(10px); }.wooden-fish.is-hit .wooden-fish-body { animation: fish-hit .28s ease; }.wooden-fish.is-hit .wooden-fish-stick { animation: stick-hit .3s ease; }.wooden-fish:active { transform: scale(.98); }.wooden-fish-hint { margin: 9px 0 0; color: rgba(249,245,235,.38); font-size: 10px; }.useless-counter [data-combo] { margin-left: 10px; color: #e2aa72; font-weight: 800; }

/* Fishing license */
.theme-jade.useless-tool-page { --useless-accent: #65b49e; --useless-accent-rgb: 101,180,158; --useless-deep: #122421; }
.fishing-license { position: relative; width: min(390px,100%); padding: 25px 25px 23px; color: #15312c; text-align: left; border: 1px solid rgba(216,242,231,.72); border-radius: 17px; background: linear-gradient(135deg,#edf4e9,#c9e0d4); box-shadow: 0 20px 45px rgba(0,0,0,.25); }
.fishing-license::before { content: ""; position: absolute; inset: 8px; pointer-events: none; border: 1px solid rgba(35,92,78,.18); border-radius: 11px; }
.license-label { color: #568478; font-size: 8px; font-weight: 900; letter-spacing: .18em; }.fishing-license > strong { display: block; margin: 7px 0 17px; font-size: 28px; letter-spacing: .08em; }
.fishing-license dl { margin: 0; }.fishing-license dl div { display: flex; gap: 18px; padding: 7px 0; border-top: 1px solid rgba(28,73,63,.1); }.fishing-license dt { width: 76px; color: #6a817a; font-size: 11px; }.fishing-license dd { margin: 0; font-size: 12px; font-weight: 800; }
.license-stamp { position: absolute; right: 21px; bottom: 21px; width: 74px; height: 74px; display: grid; place-items: center; color: #b23f3d; border: 3px double #b23f3d; border-radius: 50%; opacity: 0; font-size: 20px; font-style: normal; font-weight: 900; transform: translateY(-80px) rotate(-14deg) scale(1.5); }.fishing-license.is-approved .license-stamp { animation: stamp-drop .65s cubic-bezier(.25,1.5,.55,1) forwards; }

/* Anxiety delete — entertainment only. */
.theme-ink.useless-tool-page { --useless-accent: #73829a; --useless-accent-rgb: 115,130,154; --useless-deep: #111821; }
.worry-orb { position: relative; width: 174px; height: 174px; display: grid; place-items: center; border-radius: 50%; color: rgba(255,255,255,.68); background: radial-gradient(circle at 36% 30%,#536079,#171d28 62%,#080c12); box-shadow: 0 0 55px rgba(63,76,99,.4); }.worry-orb::after { content: ""; position: absolute; inset: -17px; border: 1px solid rgba(139,154,181,.18); border-radius: 50%; }.worry-orb > span { font-size: 15px; letter-spacing: .16em; }
.worry-orb i { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #8491a9; opacity: .55; }.worry-orb i:nth-child(1) { left: 8px; top: 43px; }.worry-orb i:nth-child(2) { right: 17px; top: 20px; }.worry-orb i:nth-child(3) { right: 0; bottom: 38px; }.worry-orb.is-deleted { animation: worry-delete .75s var(--tb-ease) forwards; }

/* Rich */
.theme-amber.useless-tool-page { --useless-accent: #e2ad45; --useless-accent-rgb: 226,173,69; --useless-deep: #251c0e; }
.wealth-display { position: relative; width: min(360px,100%); min-height: 180px; padding: 26px 20px; display: grid; place-items: center; border: 1px solid rgba(245,210,125,.2); border-radius: 25px; background: radial-gradient(circle at 50% 20%,rgba(237,192,88,.2),transparent 60%), rgba(255,255,255,.04); }.wealth-display > span { position: absolute; left: 24px; top: 20px; color: #f0c76c; font-size: 25px; }.wealth-display strong { color: #f7d886; font-size: clamp(46px,11vw,72px); line-height: 1; letter-spacing: -.06em; text-shadow: 0 0 25px rgba(231,175,55,.25); }.wealth-display i { color: rgba(255,246,220,.42); font-size: 9px; font-style: normal; letter-spacing: .16em; }.wealth-display.is-rich { animation: wealth-pop .58s var(--tb-ease); }.rich-disclaimer { margin: 9px 0 0; color: rgba(255,245,218,.38); font-size: 10px; }

/* Today */
.theme-cinnabar.useless-tool-page { --useless-accent: #ca6a56; --useless-accent-rgb: 202,106,86; --useless-deep: #291815; }
.fortune-slip { width: min(350px,100%); min-height: 210px; padding: 23px; display: grid; grid-template-columns: 1fr 1px 1fr; gap: 20px; align-items: center; color: #38221d; border-radius: 21px; background: linear-gradient(145deg,#f2e9da,#dcc9ad); box-shadow: 0 21px 45px rgba(0,0,0,.24); transform-style: preserve-3d; }.fortune-slip i { width: 1px; height: 118px; background: rgba(75,45,36,.15); }.fortune-slip span { color: #a05240; font-size: 10px; font-weight: 900; letter-spacing: .12em; }.fortune-slip strong { display: block; margin-top: 15px; font-size: 22px; line-height: 1.35; }.fortune-slip.is-drawn { animation: slip-flip .75s var(--tb-ease); }

/* Incense */
.theme-ember.useless-tool-page { --useless-accent: #d57958; --useless-accent-rgb: 213,121,88; --useless-deep: #281714; }
.digital-incense { position: relative; width: 150px; height: 190px; }.digital-incense > i { position: absolute; left: 72px; bottom: 22px; width: 6px; height: 111px; border-radius: 4px; background: linear-gradient(#5f342a,#b66d4d); }.digital-incense > b { position: absolute; left: 69px; bottom: 129px; width: 12px; height: 12px; border-radius: 50%; background: #4c2a24; transition: background .35s ease, box-shadow .35s ease; }.digital-incense::after { content: ""; position: absolute; left: 35px; bottom: 10px; width: 80px; height: 18px; border-radius: 50%; background: linear-gradient(#866456,#3b2925); }
.incense-smoke { position: absolute; left: 71px; bottom: 140px; width: 11px; height: 56px; border-left: 2px solid rgba(231,224,211,.38); border-radius: 50%; opacity: 0; }.smoke-two { left: 78px; height: 43px; transform: scaleX(-1); }.digital-incense.is-lit > b { background: #f2a052; box-shadow: 0 0 17px #e46f44; }.digital-incense.is-lit .incense-smoke { animation: incense-smoke 4s ease-in-out infinite; }.digital-incense.is-lit .smoke-two { animation-delay: 1.1s; }
.wish-field { width: min(360px,100%); margin-top: 5px; text-align: left; }.wish-field span { display: block; margin: 0 0 6px 5px; color: rgba(249,245,235,.46); font-size: 9px; }.wish-field input { width: 100%; min-height: 50px; padding: 0 15px; color: #fff9ed; border: 1px solid rgba(255,255,255,.13); border-radius: 14px; outline: none; background: rgba(0,0,0,.15); font-size: 13px; }.wish-field input:focus { border-color: rgba(221,137,103,.6); }

/* Calm */
.theme-blue.useless-tool-page { --useless-accent: #618fb8; --useless-accent-rgb: 97,143,184; --useless-deep: #101c2b; }
.calm-stage::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 30px; background: rgba(4,11,22,0); transition: background .7s ease; }.calm-stage.is-counting::before { background: rgba(4,11,22,.72); }.calm-circle { position: relative; width: 175px; height: 175px; display: grid; place-items: center; border: 1px solid rgba(151,195,231,.27); border-radius: 50%; background: radial-gradient(circle,rgba(84,137,182,.2),transparent 67%); }.calm-circle span { color: #dbeeff; font-size: 52px; font-weight: 300; }.calm-circle i { position: absolute; inset: 13px; border: 1px solid rgba(144,191,227,.13); border-radius: 50%; }.calm-stage.is-counting .calm-circle { animation: calm-breathe 1s ease-in-out infinite; }

/* Praise */
.theme-rose.useless-tool-page { --useless-accent: #d57e9f; --useless-accent-rgb: 213,126,159; --useless-deep: #291620; }
.praise-halo { position: relative; width: 190px; height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #f4bfd2; }.praise-halo i { position: absolute; inset: 3px; border: 1px solid rgba(235,153,185,.23); border-radius: 48% 52% 46% 54%; transform: rotate(14deg); }.praise-halo::before,.praise-halo::after { content: "✦"; position: absolute; color: #e5a0ba; font-size: 16px; }.praise-halo::before { left: 18px; top: 28px; }.praise-halo::after { right: 11px; bottom: 36px; }.praise-halo span { font-size: 17px; letter-spacing: .2em; }.praise-halo b { margin-top: 2px; font-size: 39px; letter-spacing: -.05em; }.praise-halo.is-praised { animation: praise-pop .65s var(--tb-ease); }

/* Persona */
.theme-purple.useless-tool-page { --useless-accent: #9d75c7; --useless-accent-rgb: 157,117,199; --useless-deep: #1d1727; }
.persona-card { position: relative; width: min(330px,100%); min-height: 230px; padding: 28px 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; color: #292033; border: 1px solid rgba(255,255,255,.55); border-radius: 24px; background: radial-gradient(circle at 80% 5%,rgba(151,103,195,.27),transparent 35%), linear-gradient(145deg,#eee7ef,#cfbed7); box-shadow: 0 22px 48px rgba(0,0,0,.25); transform-style: preserve-3d; }.persona-card::after { content: ""; position: absolute; width: 170px; height: 170px; right: -87px; bottom: -80px; border: 1px solid rgba(87,57,108,.18); border-radius: 50%; }.persona-card > span { color: #806394; font-size: 8px; font-weight: 900; letter-spacing: .2em; }.persona-card strong { margin-top: 18px; font-size: 31px; }.persona-card p { min-height: 39px; margin: 9px 0; color: #6d5d72; font-size: 12px; line-height: 1.65; }.persona-card i { color: #8f7999; font-size: 9px; font-style: normal; }.persona-card.is-drawn { animation: persona-flip .8s var(--tb-ease); }

/* Decide */
.theme-teal.useless-tool-page { --useless-accent: #5aa3a8; --useless-accent-rgb: 90,163,168; --useless-deep: #102225; }.decide-stage { justify-content: flex-start; }
.decision-list { width: min(380px,100%); display: grid; gap: 8px; }.decision-list > div { display: grid; grid-template-columns: 1fr 43px; gap: 7px; }.decision-list input { min-width: 0; min-height: 47px; padding: 0 14px; color: #efffff; border: 1px solid rgba(255,255,255,.12); border-radius: 13px; outline: none; background: rgba(255,255,255,.06); font-size: 13px; }.decision-list input:focus { border-color: rgba(98,184,188,.58); }
.decision-list button,.decision-add,.delete-bin { border: 1px solid rgba(255,255,255,.11); border-radius: 12px; color: rgba(255,255,255,.65); background: rgba(255,255,255,.055); }.decision-list button { min-height: 43px; font-size: 19px; }.decision-add { width: min(380px,100%); min-height: 43px; margin-top: 9px; font-size: 11px; }.decision-list.is-choosing { animation: list-pulse .28s ease-in-out infinite alternate; }

/* Off work */
.theme-night.useless-tool-page { --useless-accent: #738bb7; --useless-accent-rgb: 115,139,183; --useless-deep: #0c1422; }
.work-console { width: min(360px,100%); min-height: 215px; padding: 22px; border: 1px solid rgba(152,175,216,.16); border-radius: 24px; background: linear-gradient(145deg,rgba(255,255,255,.065),rgba(26,39,64,.13)); }.work-console > span { color: rgba(237,244,255,.43); font-size: 9px; letter-spacing: .18em; }.work-switch { width: 112px; height: 46px; margin: 13px auto 20px; padding: 5px; display: flex; align-items: center; gap: 11px; border-radius: 999px; background: rgba(92,136,198,.34); transition: background .55s ease; }.work-switch i { width: 36px; height: 36px; border-radius: 50%; background: #b9d5fa; box-shadow: 0 0 18px rgba(163,202,248,.35); transition: transform .55s var(--tb-ease), background .55s ease; }.work-switch strong { color: #d6e7ff; font-size: 13px; }
.work-symbol { position: relative; height: 74px; display: grid; place-items: center; }.work-symbol b,.work-symbol i { position: absolute; font-style: normal; transition: transform .7s var(--tb-ease), opacity .55s ease; }.work-symbol b { color: #93add4; font-size: 49px; }.work-symbol i { color: #e5d59a; font-size: 62px; opacity: 0; transform: translateY(45px) scale(.6); }.work-console.is-off .work-switch { justify-content: space-between; background: rgba(37,46,66,.65); }.work-console.is-off .work-switch i { transform: translateX(66px); background: #e4d49a; }.work-console.is-off .work-switch strong { order: -1; }.work-console.is-off .work-symbol b { opacity: 0; transform: translate(80px,-30px) rotate(25deg); }.work-console.is-off .work-symbol i { opacity: 1; transform: translateY(0) scale(1); }
.work-switch i { flex: 0 0 auto; }.work-switch strong { transition: transform .55s var(--tb-ease); }.work-console.is-off .work-switch { justify-content: flex-start; }.work-console.is-off .work-switch strong { order: initial; transform: translateX(-48px); }

/* Bad mood */
.theme-mint.useless-tool-page { --useless-accent: #6bb3a2; --useless-accent-rgb: 107,179,162; --useless-deep: #10231f; }
.delete-console { width: min(370px,100%); padding: 25px 22px; border: 1px solid rgba(121,202,181,.17); border-radius: 21px; background: rgba(2,16,14,.28); font-family: ui-monospace,SFMono-Regular,Consolas,monospace; }.delete-icon { width: 57px; height: 57px; margin: auto; display: grid; place-items: center; color: #b4eadb; border: 1px solid rgba(139,220,199,.25); border-radius: 17px; font-size: 25px; }.delete-console strong { display: block; margin: 16px 0 13px; color: #cceade; font-size: 12px; }.delete-progress { height: 8px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.08); }.delete-progress i { width: 0; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#4a9d89,#a0dfca); transition: width .16s linear; }.delete-console > b { display: block; margin-top: 8px; color: rgba(222,250,241,.55); font-size: 10px; }.delete-console.is-complete .delete-icon { animation: bin-complete .65s var(--tb-ease); }.delete-bin { min-height: 42px; margin-top: 10px; padding: 0 17px; font-size: 10px; }

@keyframes useless-orbit { to { transform: rotate(360deg); } }
@keyframes orbit-breathe { 50% { opacity: .36; transform: scale(1.035); } }
@keyframes orbit-halo { 50% { opacity: .65; transform: scale(.94); } }
@keyframes orbit-glow { 50% { opacity: .58; transform: scale(1.22); } }
@keyframes orbit-core-spin { to { transform: rotate(-360deg); } }
@keyframes orbit-core-pulse { 50% { opacity: .48; transform: scale(.78); } }
@keyframes orbit-star-float { 50% { opacity: .32; transform: translate3d(0,-7px,0) scale(.8); } }
@keyframes fx-burst { to { opacity: 0; transform: translate3d(var(--fx-dx),var(--fx-dy),0) rotate(var(--fx-rotate)); } }
@keyframes fx-ripple { to { opacity: 0; transform: scale(9); } }
@keyframes fx-float { to { opacity: 0; transform: translate3d(-50%,-65px,0); } }
@keyframes brain-grow { 45% { transform: scale(1.09); } }
@keyframes brain-wave { from { opacity: .8; transform: scale(.55); } to { opacity: 0; transform: scale(1.3); } }
@keyframes luck-rise { 45% { transform: translateY(-7px) scale(1.07); } }
@keyframes coin-flip-front { 0% { transform: translateY(0) rotateY(0); } 45% { transform: translateY(-52px) rotateY(900deg); } 100% { transform: translateY(0) rotateY(1800deg); } }
@keyframes coin-flip-back { 0% { transform: translateY(0) rotateY(0); } 45% { transform: translateY(-52px) rotateY(990deg); } 100% { transform: translateY(0) rotateY(1980deg); } }
@keyframes fish-hit { 50% { transform: scale(.94); } }
@keyframes stick-hit { 50% { transform: rotate(22deg); } }
@keyframes stamp-drop { 65% { opacity: 1; transform: translateY(5px) rotate(-14deg) scale(.92); } 100% { opacity: .88; transform: translateY(0) rotate(-14deg) scale(1); } }
@keyframes worry-delete { 35% { transform: scale(1.08); } 100% { opacity: 0; transform: scale(.08) rotate(20deg); filter: blur(8px); } }
@keyframes wealth-pop { 45% { transform: scale(1.045); filter: brightness(1.22); } }
@keyframes slip-flip { 0% { transform: rotateX(0); } 45% { transform: rotateX(90deg); } 100% { transform: rotateX(0); } }
@keyframes incense-smoke { 0% { opacity: 0; transform: translate(0,8px) scale(.7); } 35% { opacity: .55; } 100% { opacity: 0; transform: translate(-17px,-50px) scale(1.25); } }
@keyframes calm-breathe { 50% { transform: scale(1.09); box-shadow: 0 0 42px rgba(105,159,205,.23); } }
@keyframes praise-pop { 45% { transform: scale(1.08) rotate(-2deg); filter: brightness(1.16); } }
@keyframes persona-flip { 0% { transform: rotateY(0); } 48% { transform: rotateY(90deg) scale(.96); } 100% { transform: rotateY(0); } }
@keyframes list-pulse { to { transform: scale(.992); opacity: .7; } }
@keyframes bin-complete { 50% { transform: translateY(-5px) scale(1.08); box-shadow: 0 0 30px rgba(111,190,171,.22); } }

@media (max-width: 900px) { .useless-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 620px) {
  .useless-index-hero { min-height: 370px; padding: calc(var(--tb-nav-height) + 35px) 14px 84px; }.useless-index-hero h1 { font-size: 49px; }.useless-index-hero > p { max-width: 310px; font-size: 13px; }.useless-orbit { --orbit-x: 0px !important; --orbit-y: 0px !important; right: -95px; top: 105px; width: 220px; height: 220px; opacity: .58; transition: none; }.useless-index-meta { max-width: 290px; }
  .useless-catalog { width: calc(100% - 18px); margin-top: -42px; padding: 9px; border-radius: 21px; backdrop-filter: blur(9px); }.useless-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }.useless-card { min-height: 157px; padding: 13px; border-radius: 16px; }.useless-card strong { font-size: 17px; }.useless-card p { min-height: 31px; font-size: 9px; }.useless-card-icon { width: 36px; height: 36px; }.useless-card-state { right: 10px; top: 12px; max-width: 62px; font-size: 7px; }
  .useless-tool-main { padding: calc(var(--tb-nav-height) + 15px) 9px 52px; }.useless-tool-nav { padding: 0 5px; }.useless-tool-nav span { display: none; }.useless-tool-shell { min-height: 650px; padding: 25px 15px; border-radius: 22px; backdrop-filter: blur(9px); }.useless-tool-header h1 { font-size: 38px; }.interaction-stage { min-height: 470px; padding-top: 25px; }.useless-primary { min-height: 56px; }.useless-result strong { font-size: 20px; }.decide-stage { min-height: 530px; }.fishing-license { padding-inline: 19px; }.license-stamp { right: 14px; bottom: 18px; width: 66px; height: 66px; }.fortune-slip { gap: 13px; padding-inline: 16px; }.fortune-slip strong { font-size: 19px; }
}
@media (max-width: 350px) { .useless-card strong { font-size: 15px; }.useless-card p { font-size: 8px; }.useless-tool-header p { font-size: 11px; } }
@media (max-width: 620px) { .wish-field input,.decision-list input { font-size: 16px; } }
@media (prefers-reduced-motion: reduce) {
  .useless-orbit,.useless-orbit *,.useless-orbit::before,.useless-orbit::after,.smart-visual.is-active svg, .smart-visual.is-active .brain-ring, .luck-visual.is-active, .destiny-coin, .wooden-fish.is-hit .wooden-fish-body, .wooden-fish.is-hit .wooden-fish-stick, .license-stamp, .worry-orb, .wealth-display, .fortune-slip, .incense-smoke, .calm-circle, .praise-halo, .persona-card, .decision-list, .delete-icon { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition: none !important; }
  .fx-particle, .fx-ripple, .fx-float { display: none; }.useless-card, .useless-primary { transition: none; }
}