:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{min-width:320px;margin:0}:root{--bg:#0c0c0e;--bg-elevated:#16161a;--bg-panel:#1c1c22;--border:#ffffff14;--text:#f4f4f5;--text-muted:#f3f3f6;--accent:#e53935;--yellow:#fdd835;--blue:#1e88e5;--green:#43a047;--radius:16px;--shadow:0 12px 40px #00000073;--font:"Segoe UI", system-ui, -apple-system, "PingFang SC", "Noto Sans SC", sans-serif;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none}a{color:inherit}.app{flex-direction:column;height:100%;display:flex;position:relative}.topbar{z-index:20;pointer-events:none;background:0 0;align-items:center;gap:1rem;padding:.85rem 1.25rem 2.75rem;display:flex;position:relative}.topbar:before{content:"";z-index:-1;pointer-events:none;-webkit-backdrop-filter:blur(16px)saturate(1.1);background:linear-gradient(#0c0c0ed1 0%,#0c0c0e8c 28%,#0c0c0e47 52%,#0c0c0e1a 72%,#0c0c0e08 88%,#0000 100%);position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0% 35%,#000000a6 55%,#00000040 78%,#0000 100%);mask-image:linear-gradient(#000 0% 35%,#000000a6 55%,#00000040 78%,#0000 100%)}.topbar>*{z-index:1;pointer-events:auto;position:relative}.topbar-brand{flex-shrink:0;align-items:center;gap:.75rem;display:flex}.topbar-brand h1{letter-spacing:-.02em;margin:0;font-size:1.05rem;font-weight:700;line-height:1.2}.tagline{color:var(--text-muted);margin:.1rem 0 0;font-size:.72rem}.logo-mark{background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;grid-template-columns:1fr 1fr;gap:3px;width:36px;height:36px;padding:6px;display:grid}.logo-dot{border-radius:50%}.logo-dot.red{background:var(--accent)}.logo-dot.yellow{background:var(--yellow)}.logo-dot.blue{background:var(--blue)}.logo-dot.green{background:var(--green)}.search-field{width:200px;height:34px;color:var(--text-muted);border:1px solid var(--border);background:#ffffff0f;border-radius:999px;flex-shrink:0;align-items:center;gap:.4rem;padding:0 .65rem 0 .75rem;transition:background .15s,border-color .15s,color .15s;display:flex}.search-field:focus-within{color:var(--text);background:#ffffff1a;border-color:#ffffff38}.search-field svg{flex-shrink:0;font-size:.95rem}.search-field input{min-width:0;height:100%;color:var(--text);font:inherit;background:0 0;border:0;outline:none;flex:1;padding:0;font-size:.8rem}.search-field input::placeholder{color:var(--text-muted)}.search-field input[type=search]::-webkit-search-decoration{-webkit-appearance:none}.search-field input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}.search-clear{width:20px;height:20px;color:var(--text-muted);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;line-height:1;display:flex}.search-clear:hover{color:var(--text);background:#ffffff1f}.category-nav{flex-wrap:wrap;flex:1;justify-content:center;gap:.4rem;min-width:0;display:flex}.chip{color:var(--text-muted);background:#ffffff0a;border:1px solid #0000;border-radius:999px;padding:.35rem .75rem;font-size:.8rem;transition:background .15s,color .15s,border-color .15s}.chip:hover{color:var(--text);background:#ffffff14}.chip.active{color:#fff;background:#e5393533;border-color:#e5393573}.topbar-actions{flex-shrink:0;gap:.5rem;display:flex}.btn{white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;gap:.4rem;padding:.6rem 1.1rem;font-size:.9rem;font-weight:600;text-decoration:none;transition:transform .12s,background .15s,border-color .15s;display:inline-flex}.btn:active{transform:scale(.97)}.btn-sm{padding:.4rem .8rem;font-size:.8rem}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:#c62828}.btn-ghost{border:1px solid var(--border);color:var(--text);background:#ffffff0f}.btn-ghost:hover{background:#ffffff1a}.canvas-root{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;background:radial-gradient(ellipse 80% 60% at 50% 40%, #1a1a22 0%, var(--bg) 70%);position:absolute;inset:0;overflow:hidden}.canvas-root:active{cursor:grabbing}.canvas-grid{pointer-events:none;opacity:.6;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:48px 48px;width:200%;height:200%;position:absolute;inset:-50%}.canvas-world{transform-origin:0 0;will-change:transform;position:absolute;top:0;left:0}.canvas-hint{color:var(--text-muted);border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none;white-space:nowrap;background:#0c0c0eb3;border-radius:999px;padding:.4rem .9rem;font-size:.75rem;position:absolute;bottom:3.25rem;left:50%;transform:translate(-50%)}.canvas-empty{color:var(--text-muted);border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none;white-space:nowrap;background:#0c0c0eb3;border-radius:999px;padding:.7rem 1.15rem;font-size:.9rem;position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}.wp-card{cursor:pointer;contain:layout style;z-index:1;-webkit-tap-highlight-color:transparent;touch-action:none;background:0 0;flex-direction:column;align-items:center;gap:.4rem;width:148px;height:172px;padding:0;display:flex;position:absolute}.wp-card:hover{z-index:5}.wp-card-ring{width:140px;height:140px;box-shadow:var(--shadow);border-radius:50%;flex-shrink:0;transition:transform .15s,box-shadow .15s;position:relative}.wp-card-ring .device{pointer-events:none;width:100%;height:100%;position:absolute;bottom:0;left:0}.wp-card-ring .wallpaper{object-fit:cover;object-position:center 42%;pointer-events:none;border-radius:50%;width:100%;height:100%;padding:15px;display:block}.wp-card-title{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;text-align:center;max-width:140px;font-size:.72rem;line-height:1.2;overflow:hidden}.wp-card:hover .wp-card-title{color:var(--text)}.modal-backdrop,.guide-backdrop{z-index:100;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:auto;touch-action:auto;cursor:default;background:#000000a6;justify-content:center;align-items:center;padding:1rem;animation:.15s fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--bg-panel);border:1px solid var(--border);width:min(420px,100%);max-height:min(90vh,720px);box-shadow:var(--shadow);border-radius:20px;flex-direction:column;animation:.2s popIn;display:flex;position:relative;overflow:auto}@keyframes popIn{0%{opacity:0;transform:scale(.96)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-close{z-index:2;width:36px;height:36px;color:var(--text-muted);background:#00000059;border-radius:50%;justify-content:center;align-items:center;font-size:1.4rem;line-height:1;display:flex;position:absolute;top:.65rem;right:.75rem}.modal-close:hover{color:var(--text);background:#0000008c}.modal-preview{background:radial-gradient(circle at 50% 40%, #2a2a32 0%, var(--bg-elevated) 70%);justify-content:center;padding:2rem 1.5rem 1rem;display:flex}.device-frame{background:#000;border-radius:50%;width:240px;height:240px;position:relative;box-shadow:0 0 0 1px #ffffff0f,0 20px 50px #00000080}.device-wallpaper{object-fit:cover;object-position:center 40%;border-radius:50%;width:100%;height:100%;padding:25px;display:block}.device-buttons{pointer-events:none;width:100%;height:100%;position:absolute;bottom:0;left:0}.device-buttons img{object-fit:contain;width:100%;height:100%;display:block}.modal-body{padding:1.25rem 1.5rem 1.5rem}.modal-body h2{margin:0 0 .25rem;font-size:1.25rem}.modal-meta{color:var(--text-muted);margin:0 0 .85rem;font-size:.8rem}.color-swatches{gap:.4rem;margin-bottom:1.1rem;display:flex}.swatch{border:1px solid #fff3;border-radius:50%;width:22px;height:22px;box-shadow:inset 0 0 0 1px #00000026}.swatch.lg{width:28px;height:28px}.modal-actions{flex-wrap:wrap;gap:.6rem;margin-bottom:.9rem;display:flex}.modal-hint{color:var(--text-muted);margin:0;font-size:.75rem;line-height:1.5}.guide-backdrop{justify-content:flex-end;padding:0}.guide-panel{background:var(--bg-panel);border-left:1px solid var(--border);width:min(400px,100%);height:100%;box-shadow:var(--shadow);flex-direction:column;animation:.22s slideIn;display:flex;overflow:hidden}@keyframes slideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.guide-header{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:1.1rem 1.25rem;display:flex}.guide-header h2{margin:0;font-size:1.1rem}.guide-header .modal-close{background:#ffffff0f;position:static}.guide-body{color:var(--text-muted);padding:1.25rem;font-size:.9rem;line-height:1.55;overflow:auto}.guide-body section{margin-bottom:1.5rem}.guide-body h3{text-transform:uppercase;letter-spacing:.06em;color:var(--text);margin:0 0 .6rem;font-size:.85rem}.guide-body ul,.guide-body ol{margin:0;padding-left:1.15rem}.guide-body li{margin-bottom:.4rem}.guide-body strong{color:var(--text);font-weight:600}.palette{gap:.5rem;display:grid}.palette-item{color:var(--text);align-items:center;gap:.65rem;font-size:.85rem;display:flex}.palette-item code{font-family:var(--mono);color:var(--text-muted);margin-left:auto;font-size:.75rem}.footer{z-index:15;color:var(--text-muted);pointer-events:none;background:linear-gradient(#0000 0%,#0c0c0ee6 100%);justify-content:space-between;align-items:center;gap:1rem;padding:.65rem 1.25rem;font-size:.72rem;display:flex;position:absolute;bottom:0;left:0;right:0}.footer a{pointer-events:auto;color:var(--text-muted);border-bottom:1px solid #0000;text-decoration:none}.footer a:hover{color:var(--text);border-bottom-color:var(--text-muted)}@media (width<=720px){.topbar{flex-wrap:wrap;align-items:center;row-gap:.55rem;padding:.65rem .85rem 3rem}.search-field{flex:0 0 100%;order:3;width:100%}.topbar-actions{order:2;margin-left:auto}.category-nav{-webkit-overflow-scrolling:touch;flex-wrap:nowrap;flex:0 0 100%;order:4;justify-content:flex-start;width:100%;padding-bottom:.15rem;overflow-x:auto}.chip{flex-shrink:0}.canvas-hint{font-size:.68rem;bottom:2.75rem}.footer{padding:.5rem .85rem;font-size:.65rem}}