@font-face{font-family:Oni Script;src:url(/fonts/OniScript.woff2)format("woff2");font-display:swap}@font-face{font-family:Ghibli;src:url(/fonts/Ghibli.woff2)format("woff2");font-display:swap}:root{--primary-color:#7b2cbf;--primary-glow:#7b2cbfcc;--secondary-color:#ff006e;--text-primary:#fff;--text-secondary:#ffffffe6;--bg-color:transparent;--panel-bg:#0a0a0fd9;--panel-border:#ffffff40;--countdown-font:"Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);justify-content:center;align-items:center;min-height:100vh;font-family:Outfit,sans-serif;display:flex;overflow:hidden}#app{justify-content:center;align-items:center;width:100%;padding:2rem;display:flex}.countdown-container{font-family:var(--countdown-font);background:var(--panel-bg);-webkit-backdrop-filter:blur(24px);border:1px solid var(--panel-border);border-radius:24px;flex-direction:column;align-items:center;gap:2rem;padding:clamp(1.5rem,4vw,3rem) clamp(1.5rem,5vw,4rem);animation:6s ease-in-out infinite float;display:flex;position:relative;overflow:hidden;box-shadow:0 12px 40px #000000b3,inset 0 0 0 1px #ffffff1a}.countdown-container:before{content:"";background:radial-gradient(circle at 50% 50%, var(--primary-glow) 0%, transparent 60%);z-index:-1;opacity:.5;pointer-events:none;width:200%;height:200%;position:absolute;top:-50%;left:-50%}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}.countdown-header{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(1rem,3vw,2rem);width:100%;display:grid}h1#message{text-transform:uppercase;letter-spacing:4px;text-align:center;background:linear-gradient(135deg, var(--text-primary) 0%, var(--text-secondary) 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 12px #000c);overflow-wrap:anywhere;-webkit-background-clip:text;min-width:0;margin-bottom:.5rem;font-size:clamp(1.8rem,4vw,2.5rem);font-weight:700}.channel-logo{object-fit:contain;filter:drop-shadow(0 6px 14px #000000a6);justify-self:end;width:clamp(44px,8vw,72px);min-width:44px;height:clamp(44px,8vw,72px)}.timer{grid-template-columns:repeat(4,minmax(82px,1fr));align-items:center;gap:clamp(.75rem,2vw,1.5rem);display:grid}.time-box{background:#0009;border:1px solid #ffffff1a;border-radius:16px;flex-direction:column;align-items:center;min-width:0;padding:clamp(1rem,2.5vw,1.5rem) clamp(.65rem,2vw,1rem);display:flex;position:relative;overflow:hidden;box-shadow:inset 0 2px 10px #ffffff0d,0 4px 15px #00000080}.time-box:after{content:"";background:linear-gradient(90deg, var(--primary-color), var(--secondary-color));opacity:.8;width:100%;height:2px;position:absolute;bottom:0;left:0}.time-box span:first-child{font-variant-numeric:tabular-nums;background:linear-gradient(180deg, var(--text-primary) 0%, var(--text-secondary) 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 8px #000c)drop-shadow(0 0 10px #fff3);-webkit-background-clip:text;font-size:clamp(3rem,9vw,5rem);font-weight:900;line-height:1}.time-box .label{text-transform:uppercase;letter-spacing:2px;color:var(--text-secondary);margin-top:.5rem;font-size:.9rem;font-weight:500}.colon{color:var(--secondary-color);filter:drop-shadow(0 0 15px #ff006e99)drop-shadow(0 4px 6px #000c);margin-top:-2rem;font-size:4rem;font-weight:700;line-height:1;animation:1s infinite alternate blink;display:none}@keyframes blink{0%,40%{opacity:1}60%,to{opacity:.3}}#completed-message{background:var(--panel-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10;opacity:0;pointer-events:none;border-radius:24px;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .5s ease-in-out;display:flex;position:absolute;top:0;left:0}#completed-message.visible{opacity:1;pointer-events:all}#completed-message h2{text-transform:uppercase;letter-spacing:4px;background:linear-gradient(90deg, var(--primary-color), var(--secondary-color));-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:3rem;font-weight:900;animation:2s infinite alternate pulse}@keyframes pulse{0%{filter:drop-shadow(0 0 10px #ff006e80);transform:scale(1)}to{filter:drop-shadow(0 0 20px #7b2cbfcc);transform:scale(1.05)}}.hidden{display:none!important}.settings-btn{background:var(--panel-bg);border:1px solid var(--panel-border);color:var(--text-secondary);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;transition:all .3s;display:flex;position:fixed;bottom:2rem;right:2rem}.settings-btn:hover{color:var(--text-primary);box-shadow:0 0 15px var(--primary-glow);background:#ffffff1a;transform:rotate(45deg)}.modal{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:200;opacity:1;background:#0009;justify-content:center;align-items:center;width:100vw;height:100vh;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}.modal-content{border:1px solid var(--panel-border);background:#141419f2;border-radius:20px;width:100%;max-width:500px;max-height:calc(100vh - 3rem);padding:2.5rem;transition:transform .3s;overflow-y:auto;transform:translateY(0);box-shadow:0 20px 50px #00000080,inset 0 0 0 1px #ffffff0d}.modal.hidden{opacity:0;pointer-events:none}.modal.hidden .modal-content{transform:translateY(20px)}.modal-content h2{color:var(--text-primary);border-bottom:1px solid var(--panel-border);margin-bottom:1.5rem;padding-bottom:1rem;font-size:1.8rem}.form-group{flex-direction:column;gap:.5rem;margin-bottom:1.5rem;display:flex}.form-group label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;font-size:.9rem;font-weight:500}.form-group input{border:1px solid var(--panel-border);color:var(--text-primary);background:#0000004d;border-radius:8px;padding:.8rem 1rem;font-family:inherit;font-size:1rem;transition:all .2s}.form-group input[type=color]{min-height:48px;padding:.3rem}.form-group input[type=file]{padding:.7rem}.color-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.color-grid .form-group{margin-bottom:.5rem}.form-group select{appearance:none;border:1px solid var(--panel-border);color:var(--text-primary);background:#0000004d;border-radius:8px;padding:.8rem 2.5rem .8rem 1rem;font-family:inherit;font-size:1rem;transition:all .2s}.form-group select:focus{border-color:var(--primary-color);box-shadow:0 0 0 2px var(--primary-glow);outline:none}.form-group select option{color:var(--text-primary);background:#141419}.form-group input:focus{border-color:var(--primary-color);box-shadow:0 0 0 2px var(--primary-glow);outline:none}.modal-actions{gap:1rem;margin-top:2rem;display:flex}button{cursor:pointer;border:none;border-radius:8px;padding:.8rem 1.5rem;font-family:inherit;font-size:1rem;font-weight:600;transition:all .2s}.primary-btn{background:linear-gradient(90deg, var(--primary-color), var(--secondary-color));color:#fff;flex:1}.primary-btn:hover{filter:brightness(1.1);box-shadow:0 0 15px var(--primary-glow)}.secondary-btn{color:var(--text-primary);background:#ffffff1a}.secondary-btn:hover{background:#fff3}.compact-btn{align-self:flex-start;padding:.65rem 1rem;font-size:.9rem}.url-result{border-top:1px solid var(--panel-border);flex-direction:column;gap:.5rem;margin-top:1.5rem;padding-top:1.5rem;display:flex}.url-result label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;font-size:.85rem}.url-result input{border:1px solid var(--primary-glow);color:var(--text-primary);background:#00000080;border-radius:8px;width:100%;padding:.8rem;font-family:monospace;font-size:.9rem}.url-result #copy-btn{margin-top:.5rem}@media (width<=700px){.countdown-header{grid-template-columns:1fr}.channel-logo{order:-1;justify-self:center}}