:root{color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;--bg: #0f1117;--panel: #171a23;--tile: #232735;--tile-hover: #2c3142;--accent: #f5a623;--text: #e8eaf0;--muted: #8b90a0}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);overflow:hidden}.layout{display:grid;grid-template-columns:1fr 280px;height:100vh}.board{display:flex;flex-direction:column;min-width:0}.board__header{display:flex;align-items:baseline;gap:1rem;padding:1rem 1.5rem;border-bottom:1px solid #232735}.board__header h1{margin:0;font-size:1.4rem;letter-spacing:.5px}.board__hint{margin:0;color:var(--muted);font-size:.9rem;flex:1}.board__nick{background:var(--bg);color:var(--text);border:1px solid #313748;border-radius:8px;padding:.4rem .7rem;width:130px}.account{display:flex;flex-direction:column;gap:.6rem;margin-top:.8rem}.account__btn{background:var(--tile);color:var(--text);border:1px solid #313748;border-radius:8px;padding:.6rem .8rem;cursor:pointer}.account__btn:hover{background:var(--tile-hover)}.account__btn--danger{border-color:#5b2630;color:#ff8a8a}.account__btn--danger:hover{background:#2a1c20}.login{display:flex;flex-direction:column;gap:.7rem;margin-top:.5rem}.login__email{background:var(--bg);color:var(--text);border:1px solid #313748;border-radius:8px;padding:.6rem .7rem;width:100%}.board__clear{background:var(--tile);color:var(--text);border:1px solid #333;border-radius:8px;padding:.4rem .8rem;cursor:pointer}.board__clear:hover{background:var(--tile-hover)}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:20}.modal__card{background:var(--panel);border:1px solid #313748;border-radius:14px;width:min(560px,92vw);max-height:80vh;overflow:auto;padding:1.2rem 1.4rem}.modal__head{display:flex;align-items:center;justify-content:space-between}.modal__head h2{margin:0}.modal__close{background:none;border:none;color:var(--muted);font-size:1.1rem;cursor:pointer}.activity{display:grid;gap:1.4rem;margin-top:.5rem}.activity h3{margin:0 0 .5rem;font-size:.95rem;color:var(--muted)}.activity__board{margin:0;padding-left:1.2rem;display:grid;gap:.35rem}.activity__board li{display:flex;justify-content:space-between}.activity__count{color:var(--accent);font-weight:600}.activity__feed{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}.activity__feed li{display:flex;justify-content:space-between;gap:1rem}.activity__el{font-weight:500;color:var(--text);text-decoration:none}.activity__el:hover{color:var(--accent)}.muted{color:var(--muted);font-size:.85rem}.badges{display:grid;gap:1.1rem;margin-top:.6rem}.badges__cat-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.4rem}.badges__cat-name{font-weight:600}.badges__tiers{display:flex;gap:.6rem}.badge{flex:1;display:flex;flex-direction:column;align-items:center;gap:.2rem;text-align:center;background:var(--tile);border:1px solid #313748;border-radius:10px;padding:.5rem .3rem}.badge__img{width:3rem;height:3rem;image-rendering:pixelated;object-fit:contain}.badge__name{font-size:.78rem;font-weight:600}.badge__req{font-size:.7rem;color:var(--muted)}.badge--locked{opacity:.4;filter:grayscale(1)}.badge--gold{border-color:var(--accent);box-shadow:0 0 12px 1px #f5a62373;background:linear-gradient(180deg,rgba(245,166,35,.14),var(--tile))}.modal__card--narrow{width:min(380px,92vw);text-align:center}.daily__target{display:flex;flex-direction:column;align-items:center;gap:.3rem;margin:1rem 0}.daily__emoji{font-size:3rem}.daily__name{font-size:1.4rem;font-weight:600}.daily__best strong{color:var(--accent)}.daily__active{color:var(--accent);font-weight:600}.daily__start{margin-top:.6rem;background:var(--accent);color:#1a1a1a;border:none;border-radius:10px;padding:.6rem 1.4rem;font-weight:600;cursor:pointer}.daily__start:hover{filter:brightness(1.05)}.daily__share{margin-top:.5rem;margin-left:.5rem;background:transparent;color:var(--accent);border:1px solid var(--accent);border-radius:10px;padding:.55rem 1.1rem;font-weight:600;cursor:pointer}.daily__share:hover{background:#ffffff0d}.daily__exit{margin-top:.6rem;background:transparent;color:var(--muted, #8b90a0);border:1px solid var(--border, #262a36);border-radius:10px;padding:.5rem 1.1rem;font-weight:600;cursor:pointer}.daily__exit:hover{color:#e5484d;border-color:#e5484d}@media (max-width: 720px){body{overflow:auto}.layout{grid-template-columns:1fr;grid-template-rows:1fr auto;height:100vh}.board__header{flex-wrap:wrap;gap:.5rem;padding:.75rem 1rem}.board__header h1{font-size:1.2rem}.board__hint{display:none}.board__nick{width:100px}.palette{border-left:none;border-top:1px solid #232735;max-height:38vh}.palette__list{max-height:26vh}}.canvas{position:relative;flex:1;overflow:hidden;background:radial-gradient(circle at 1px 1px,#1c202b 1px,transparent 0) 0 0 / 28px 28px}.canvas__empty{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:var(--muted);pointer-events:none}.canvas-tile{position:absolute;touch-action:none;cursor:grab}.canvas-tile--over .tile{outline:2px solid var(--accent);outline-offset:2px}.canvas-tile__share{position:absolute;top:-8px;right:-8px;width:20px;height:20px;padding:0;border:none;border-radius:50%;background:var(--tile-hover);color:var(--muted);font-size:.7rem;line-height:1;cursor:pointer;opacity:0;transition:opacity .12s}.canvas-tile:hover .canvas-tile__share{opacity:1}.canvas-tile__remove{position:absolute;top:-8px;left:-8px;width:20px;height:20px;padding:0;border:none;border-radius:50%;background:var(--tile-hover);color:#ff8a8a;font-size:.7rem;line-height:1;cursor:pointer;opacity:0;transition:opacity .12s}.canvas-tile:hover .canvas-tile__remove{opacity:1}.recipe{position:absolute;z-index:5;transform:translate(-50%);background:var(--tile);border:1px solid var(--accent);border-radius:8px;padding:.4rem .7rem;font-size:.85rem;color:var(--text);white-space:nowrap;cursor:pointer;box-shadow:0 4px 14px #00000073}.hint{position:absolute;top:1rem;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:.6rem;background:var(--tile);border:1px solid #313748;border-radius:10px;padding:.5rem .9rem;color:var(--muted);font-size:.85rem;z-index:4}.hint button{background:var(--accent);color:#1a1a1a;border:none;border-radius:6px;padding:.25rem .6rem;font-weight:600;cursor:pointer}.tile{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .7rem;background:var(--tile);border:1px solid #313748;border-radius:10px;box-shadow:0 2px 6px #00000059;-webkit-user-select:none;user-select:none;white-space:nowrap;position:relative}.tile__emoji{font-size:1.1rem}.tile__sprite{image-rendering:pixelated;object-fit:contain;flex:none}.tile__emoji.tile__sprite{width:1.9rem;height:1.9rem}.palette__emoji.tile__sprite{width:1.5rem;height:1.5rem}.tile__label{font-size:.92rem}.tile--loading{opacity:.6}.tile--sparkle{border-color:var(--accent);animation:sparkle 1.2s ease-in-out infinite}.tile__badge{position:absolute;top:-1.4rem;left:50%;transform:translate(-50%);font-size:.7rem;color:var(--accent);white-space:nowrap}@keyframes sparkle{0%,to{box-shadow:0 0 #f5a62380}50%{box-shadow:0 0 18px 4px #f5a6238c}}.palette{display:flex;flex-direction:column;background:var(--panel);border-left:1px solid #232735;min-height:0}.palette__header{padding:1rem 1rem .5rem;color:var(--muted);font-size:.9rem}.palette__header strong{color:var(--accent);font-size:1.1rem}.palette__search{margin:0 1rem .75rem;padding:.5rem .7rem;background:var(--bg);border:1px solid #313748;border-radius:8px;color:var(--text)}.palette__list{flex:1;overflow-y:auto;display:flex;flex-wrap:wrap;gap:.4rem;padding:0 1rem 1rem;align-content:flex-start}.palette__item{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;background:var(--tile);border:1px solid #313748;border-radius:8px;color:var(--text);cursor:grab;font-size:.85rem;touch-action:none}.palette__item:hover{background:var(--tile-hover)}.palette__emoji{font-size:1rem}.toast{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:.8rem;background:var(--tile);border:1px solid var(--accent);border-radius:10px;padding:.7rem 1.1rem;box-shadow:0 6px 20px #00000080;animation:rise .25s ease;z-index:10;max-width:92vw}.toast__action{background:var(--accent);color:#1a1a1a;border:none;border-radius:6px;padding:.3rem .7rem;font-weight:600;cursor:pointer;flex-shrink:0}.activity__stats{margin:.25rem 0 .5rem}.activity__stats strong{color:var(--accent)}@keyframes rise{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}body:has(.landing),body:has(.admin){overflow:auto}.landing{min-height:100%;background:radial-gradient(circle at 50% -10%,#1b2030 0,transparent 55%),var(--bg)}.landing__nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;max-width:960px;margin:0 auto}.landing__brand{font-weight:600;letter-spacing:.5px}.landing__signin{background:none;border:1px solid #313748;color:var(--text);border-radius:8px;padding:.4rem .9rem;cursor:pointer}.landing__signin:hover{background:var(--tile)}.landing__hero{text-align:center;padding:3rem 1.5rem 3.5rem;max-width:720px;margin:0 auto}.landing__title{font-size:clamp(2.6rem,8vw,4.5rem);margin:0;letter-spacing:1px}.landing__tagline{font-size:clamp(1.1rem,3vw,1.5rem);color:var(--muted);margin:.6rem 0 2rem}.landing__example{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.6rem;margin-bottom:2rem}.landing__chip{background:var(--tile);border:1px solid #313748;border-radius:10px;padding:.5rem .9rem;font-size:1rem;box-shadow:0 2px 6px #00000059}.landing__chip--result{border-color:var(--accent);animation:sparkle 1.8s ease-in-out infinite}.landing__plus,.landing__arrow{color:var(--muted);font-size:1.2rem}.landing__cta{display:inline-block;background:var(--accent);color:#1a1a1a;text-decoration:none;font-weight:700;font-size:1.1rem;border-radius:12px;padding:.85rem 2.2rem;box-shadow:0 4px 14px #f5a6234d;transition:filter .12s}.landing__cta:hover{filter:brightness(1.06)}.landing__stats{margin-top:1.6rem;color:var(--muted);font-size:.95rem}.landing__stats strong{color:var(--accent)}.landing__section{max-width:960px;margin:0 auto;padding:2.5rem 1.5rem}.landing__section h2{text-align:center;font-size:clamp(1.4rem,4vw,2rem);margin:0 0 1.8rem}.landing__steps{list-style:none;counter-reset:step;margin:0;padding:0;display:grid;gap:1rem;max-width:560px;margin-inline:auto}.landing__steps li{counter-increment:step;display:flex;align-items:center;gap:1rem;background:var(--panel);border:1px solid #232735;border-radius:12px;padding:1rem 1.2rem}.landing__steps li:before{content:counter(step);flex-shrink:0;width:1.8rem;height:1.8rem;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#1a1a1a;font-weight:700}.landing__step-emoji{font-size:1.3rem;white-space:nowrap}.landing__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.landing__grid--features{grid-template-columns:repeat(3,1fr)}.landing__card{background:var(--panel);border:1px solid #232735;border-radius:14px;padding:1.3rem}.landing__card-emoji{font-size:1.8rem}.landing__card h3{margin:.6rem 0 .4rem;font-size:1.1rem}.landing__card p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.5}.landing__lead{text-align:center;color:var(--muted);max-width:560px;margin:-1rem auto 1.8rem;line-height:1.6}.landing__badges{display:flex;flex-wrap:wrap;justify-content:center;gap:1.4rem}.landing__badge{margin:0;display:flex;flex-direction:column;align-items:center;gap:.4rem;width:96px;text-align:center}.landing__badge img{image-rendering:pixelated;object-fit:contain}.landing__badge figcaption{display:flex;flex-direction:column;line-height:1.3}.landing__badge figcaption strong{font-size:.85rem}.landing__badge figcaption span{color:var(--muted);font-size:.72rem}.landing__feed{margin-top:2rem;max-width:480px;margin-inline:auto}.landing__feed h3{text-align:center;font-size:1rem;color:var(--muted);margin:0 0 .8rem}.landing__feed ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.landing__feed li{display:flex;justify-content:space-between;gap:1rem;background:var(--tile);border:1px solid #313748;border-radius:8px;padding:.5rem .8rem;font-size:.9rem}.landing__feed-by{color:var(--muted)}.landing__outro{text-align:center;padding:3rem 1.5rem 4rem}.landing__outro h2{font-size:clamp(1.4rem,4vw,2rem);margin:0 0 1.8rem}@media (max-width: 720px){.landing__grid,.landing__grid--features{grid-template-columns:1fr}}.landing__footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1.25rem;padding:2rem 1.5rem 3rem;border-top:1px solid var(--tile);color:var(--muted);font-size:.9rem}.landing__footer a{color:var(--muted);text-decoration:none}.landing__footer a:hover{color:var(--accent)}.landing__footer-copy{opacity:.7}.app-footer{position:fixed;bottom:.5rem;left:.75rem;display:flex;gap:.9rem;font-size:.72rem;z-index:5}.app-footer a{color:var(--muted);text-decoration:none;opacity:.6}.app-footer a:hover{color:var(--accent);opacity:1}@media (max-width: 720px){.app-footer{display:none}}