:root{color-scheme:dark}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;min-height:100vh;background:radial-gradient(1200px 600px at 12% -5%,rgba(56,189,248,.16),transparent 60%),radial-gradient(1100px 500px at 90% 0,rgba(139,92,246,.14),transparent 58%),linear-gradient(140deg,#0b1021,#0f172a 45%,#111827);color:#e2e8f0;position:relative;overflow-x:hidden}body:after,body:before{content:"";position:fixed;width:360px;height:360px;border-radius:999px;filter:blur(60px);z-index:-1;pointer-events:none;opacity:.45;animation:floatBlob 12s ease-in-out infinite}body:before{top:-120px;left:-80px;background:rgba(56,189,248,.45)}body:after{bottom:-140px;right:-100px;background:rgba(167,139,250,.35);animation-delay:-5s}.container{max-width:1080px;margin:0 auto;padding:28px 20px 44px}h1{margin:0;font-size:32px;letter-spacing:.2px;background:linear-gradient(90deg,#f8fafc,#dbeafe 40%,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent}.sub{margin-top:8px;color:#94a3b8;animation:fadeInUp .55s ease}.panel{border:1px solid rgba(100,116,139,.45);border-radius:16px;padding:16px;background:linear-gradient(165deg,rgba(15,23,42,.9),rgba(17,24,39,.75));box-shadow:0 10px 30px rgba(2,6,23,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;animation:fadeInUp .45s ease both}.panel:hover{transform:translateY(-2px);border-color:rgba(96,165,250,.6);box-shadow:0 14px 36px rgba(30,41,59,.35)}label{display:block;font-weight:600;margin-bottom:8px;margin-top:8px;color:#dbeafe}input,select,textarea{width:100%;background:rgba(11,18,32,.72);border:1px solid rgba(71,85,105,.8);color:#e2e8f0;border-radius:10px;padding:10px;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:#60a5fa;background:rgba(15,23,42,.95);box-shadow:0 0 0 3px rgba(96,165,250,.22)}textarea{resize:vertical}.row{margin-top:12px}details{border:1px dashed rgba(100,116,139,.65);border-radius:10px;padding:10px 12px;background:rgba(15,23,42,.35)}summary{cursor:pointer;font-weight:600;color:#bfdbfe;margin-bottom:8px}details[open] summary{margin-bottom:10px}.actions{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}button{border:1px solid rgba(96,165,250,.65);background:linear-gradient(135deg,#1d4ed8,#2563eb 65%,#3b82f6);color:#fff;border-radius:10px;padding:10px 14px;cursor:pointer;font-weight:600;box-shadow:0 8px 18px rgba(29,78,216,.3);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}button:hover{filter:brightness(1.07);transform:translateY(-1px);box-shadow:0 12px 24px rgba(37,99,235,.33)}button:active{transform:translateY(0)}button:disabled{opacity:.65;cursor:not-allowed;transform:none;box-shadow:none}.grid{margin-top:16px;display:grid;grid-gap:16px;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}ul{margin:0;padding-left:20px}.foot{margin-top:14px;color:#94a3b8;font-size:14px}small{color:#93c5fd}code{background:rgba(15,23,42,.85);border:1px solid rgba(71,85,105,.65);border-radius:6px;padding:1px 6px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes floatBlob{0%,to{transform:translateZ(0) scale(1)}50%{transform:translate3d(10px,-8px,0) scale(1.04)}}@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}