*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-app:#0e0e10;--bg-surface:#141416;--bg-surface-elevated:#1a1a1d;--bg-interactive:#222226;--text-primary:#ededed;--text-secondary:#9e9ea6;--text-tertiary:#65656c;--text-inverse:#0e0e10;--border-subtle:#1f1f23;--border-default:#2a2a30;--border-strong:#3e3e46;--border-active:#ededed;--accent-action:#ededed;--accent-action-hover:#fff;--accent-online:#3dd68c;--accent-focus:#ededed66;--state-danger:#f85149;--state-danger-bg:#f851491a;--radius-xs:2px;--radius-sm:4px;--radius-md:6px;--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;font-family:var(--font-family);color:var(--text-primary);background:var(--bg-app);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:15px;line-height:1.5}.app{background-color:var(--bg-app);flex-direction:column;align-items:center;min-height:100dvh;display:flex}.site-header{border-bottom:1px solid var(--border-subtle);background:var(--bg-app);z-index:20;justify-content:space-between;align-items:center;width:100%;max-width:900px;padding:1.25rem 2rem;display:flex;position:sticky;top:0}.header-left,.header-right{align-items:center;gap:1.25rem;display:flex}.brand-group{align-items:center;gap:.5rem;display:flex}.brand-icon{width:18px;height:18px;display:block}.site-title{letter-spacing:-.01em;color:var(--text-primary);text-transform:lowercase;font-size:.92rem;font-weight:700}.external-link{color:var(--text-tertiary);letter-spacing:.02em;font-size:.75rem;font-weight:500;text-decoration:none;transition:color .15s}.external-link:hover{color:var(--text-secondary)}.presence-badge{font-variant-numeric:tabular-nums;color:var(--text-secondary);align-items:center;gap:.45rem;font-size:.75rem;display:flex}.presence-badge.is-connecting{color:var(--text-tertiary);font-style:normal}.status-dot{background:var(--text-tertiary);border-radius:50%;flex-shrink:0;width:6px;height:6px;display:inline-block}.status-dot.connected{background:var(--accent-online);box-shadow:0 0 8px #3dd68c66}.status-dot.connecting{background:#f5a623;animation:1.4s ease-in-out infinite pulseDot}.status-dot.disconnected{background:var(--state-danger)}@keyframes pulseDot{0%,to{opacity:.3;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}.share-nav-btn{color:var(--text-secondary)!important;border-color:var(--border-default)!important;padding:.25rem .6rem!important;font-size:.72rem!important}.share-nav-btn:hover{color:var(--text-primary)!important;border-color:var(--border-strong)!important}.main{flex-direction:column;flex:1;width:100%;max-width:900px;padding:2.5rem 2rem 5rem;display:flex}.section-header{justify-content:space-between;align-items:baseline;width:100%;margin-bottom:1rem;display:flex}.section-label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-tertiary);font-size:.7rem;font-weight:600}.section-count{font-size:.72rem;font-family:var(--font-mono);color:var(--text-tertiary)}.my-section,.wall-section{width:100%;margin-bottom:3.5rem}.wish-form-wrapper{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-sm);padding:1.25rem;transition:border-color .15s}.wish-form-wrapper:focus-within{border-color:var(--border-strong);box-shadow:0 0 0 1px var(--border-strong)}.wish-form{flex-direction:column;gap:1rem;width:100%;display:flex}.wish-form textarea{width:100%;min-height:72px;font:inherit;color:var(--text-primary);resize:vertical;background:0 0;border:none;font-size:1.05rem;line-height:1.5}.wish-form textarea::placeholder{color:var(--text-tertiary)}.wish-form textarea:focus{outline:none}.wish-form textarea:disabled{opacity:.5}.wish-form-footer{border-top:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding-top:.85rem;display:flex}.char-counter{font-size:.72rem;font-family:var(--font-mono);color:var(--text-tertiary)}.wish-form-actions{align-items:center;gap:.75rem;display:flex}.feedback-msg{color:var(--accent-online);font-size:.78rem}.self-wish-banner{background:var(--bg-surface-elevated);border:1px solid var(--border-default);border-radius:var(--radius-sm);flex-direction:column;gap:.75rem;margin-top:1rem;padding:1rem 1.25rem;display:flex}.self-wish-header{justify-content:space-between;align-items:center;display:flex}.self-badge{text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);font-size:.68rem;font-weight:600}.self-wish-text{color:var(--text-primary);font-size:.95rem;line-height:1.5}button,.button-like{cursor:pointer;border-radius:var(--radius-xs);border:1px solid #0000;justify-content:center;align-items:center;gap:.4rem;padding:.5rem 1rem;font-family:inherit;font-size:.82rem;font-weight:500;line-height:1.2;transition:all .12s;display:inline-flex}button:focus-visible{outline:2px solid var(--accent-focus);outline-offset:1px}button:disabled{opacity:.35;cursor:not-allowed}button.btn-primary,button[type=submit]:not(.secondary){background:var(--accent-action);color:var(--text-inverse);border-color:var(--accent-action)}button.btn-primary:hover:not(:disabled),button[type=submit]:not(.secondary):hover:not(:disabled){background:var(--accent-action-hover)}button.secondary{color:var(--text-secondary);border-color:var(--border-default);background:0 0}button.secondary:hover:not(:disabled){color:var(--text-primary);border-color:var(--border-strong);background:var(--bg-interactive)}button.small{padding:.3rem .65rem;font-size:.72rem}button.danger{color:var(--state-danger);border-color:var(--border-subtle)}button.danger:hover:not(:disabled){background:var(--state-danger-bg);border-color:var(--state-danger)}.send-btn{background:var(--bg-interactive);color:var(--text-primary);border:1px solid var(--border-default);width:100%}.send-btn:hover:not(:disabled){background:var(--bg-surface-elevated);border-color:var(--border-strong)}.wish-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.15rem;width:100%;display:grid}.wish-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-sm);flex-direction:column;justify-content:space-between;gap:1.25rem;min-height:140px;padding:1.25rem;transition:border-color .15s,background-color .15s;display:flex}.wish-card:hover{border-color:var(--border-strong);background:var(--bg-surface-elevated)}.wish-card-body{flex-direction:column;gap:.5rem;display:flex}.wish-text{color:var(--text-primary);word-break:break-word;-webkit-hyphens:auto;hyphens:auto;font-size:.95rem;font-weight:400;line-height:1.5}.wish-card-footer{flex-direction:column;gap:.5rem;margin-top:auto;display:flex}.card-actions,.wish-edit-actions{align-items:center;gap:.5rem;display:flex}.wish-edit textarea{resize:vertical;border:1px solid var(--border-default);border-radius:var(--radius-xs);width:100%;min-height:70px;font:inherit;background:var(--bg-app);color:var(--text-primary);margin-bottom:.5rem;padding:.6rem;font-size:.9rem}.wish-edit textarea:focus{border-color:var(--border-strong);outline:none}.field-error{color:var(--state-danger);font-size:.72rem}.empty-wall-container{flex-direction:column;align-items:center;gap:2rem;width:100%;display:flex}.wall-silhouette{opacity:.35;pointer-events:none;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.15rem;width:100%;display:grid}.silhouette-card{background:var(--bg-surface);border:1px dashed var(--border-default);border-radius:var(--radius-sm);flex-direction:column;justify-content:space-between;min-height:140px;padding:1.25rem;display:flex}.silhouette-line{background:var(--border-default);border-radius:var(--radius-xs);width:85%;height:9px}.silhouette-line.short{width:50%}.silhouette-line.medium{width:68%}.silhouette-btn{background:var(--border-subtle);border-radius:var(--radius-xs);width:100%;height:28px}.quick-help{border:1px solid var(--border-default);border-radius:var(--radius-sm);background:var(--bg-surface);flex-direction:column;gap:1rem;width:100%;max-width:440px;padding:1.5rem 1.75rem;display:flex}.quick-help-title{color:var(--text-primary);font-size:.88rem;font-weight:600}.quick-help-steps{color:var(--text-secondary);flex-direction:column;gap:.35rem;padding-left:1.2rem;font-size:.82rem;line-height:1.65;display:flex}.inbox-section{border-top:1px solid var(--border-subtle);width:100%;margin-top:1rem;padding-top:2.5rem}.inbox-hint{color:var(--text-tertiary);margin-top:-.5rem;margin-bottom:1.25rem;font-size:.75rem}.inbox-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.85rem;width:100%;display:grid}.inbox-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-sm);cursor:pointer;aspect-ratio:1;flex-direction:column;transition:border-color .15s;display:flex;position:relative;overflow:hidden}.inbox-card:hover{border-color:var(--border-strong)}.inbox-thumb{object-fit:cover;flex:1;width:100%;height:100%}.inbox-meta{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0e0e10d9;flex-direction:column;padding:.35rem .5rem;font-size:.65rem;display:flex;position:absolute;bottom:0;left:0;right:0}.inbox-name{white-space:nowrap;text-overflow:ellipsis;color:var(--text-primary);overflow:hidden}.inbox-size{color:var(--text-tertiary);font-family:var(--font-mono)}.inbox-delete-btn{border-radius:var(--radius-xs);border:1px solid var(--border-default);width:22px;height:22px;color:var(--text-secondary);background:#0e0e10cc;justify-content:center;align-items:center;padding:0;font-size:.65rem;display:flex;position:absolute;top:4px;right:4px}.inbox-delete-btn:hover{color:var(--state-danger);border-color:var(--state-danger)}.status-banner{border:1px solid var(--border-default);border-radius:var(--radius-xs);color:var(--text-secondary);background:var(--bg-surface);align-items:center;gap:.5rem;margin-bottom:2rem;padding:.6rem 1rem;font-size:.78rem;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#000000b3;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal{background:var(--bg-surface-elevated);border:1px solid var(--border-strong);border-radius:var(--radius-md);flex-direction:column;gap:1.15rem;width:100%;max-width:440px;padding:1.75rem;display:flex;box-shadow:0 16px 36px #0006}.modal h2{letter-spacing:-.01em;color:var(--text-primary);font-size:1.05rem;font-weight:600}.meta-table{border-collapse:collapse;width:100%;font-size:.82rem}.meta-table th{text-align:left;color:var(--text-tertiary);white-space:nowrap;padding:.3rem 1rem .3rem 0;font-weight:400}.meta-table td{word-break:break-all;color:var(--text-secondary);font-family:var(--font-mono);padding:.3rem 0;font-size:.78rem}.modal-actions{gap:.65rem;margin-top:.5rem;display:flex}.privacy-notice{color:var(--text-tertiary);font-size:.75rem;line-height:1.45}.phase-label{color:var(--text-secondary);font-size:.85rem}.progress-bar{background:var(--border-default);border-radius:2px;height:3px;overflow:hidden}.progress-fill{background:var(--accent-action);height:100%;transition:width .15s linear}.error-msg{color:var(--state-danger);font-size:.82rem}.result-preview{flex-direction:column;gap:.75rem;display:flex}.preview-img{object-fit:contain;border:1px solid var(--border-default);border-radius:var(--radius-xs);max-width:100%;max-height:220px}.download-link{color:var(--text-primary);font-size:.82rem;text-decoration:underline}.gallery-modal{max-width:620px!important;padding:1.5rem!important}.modal-full-img{object-fit:contain;border:1px solid var(--border-default);border-radius:var(--radius-xs);background:var(--bg-app);width:100%;max-height:65vh}.gallery-modal-meta{font-size:.78rem;font-family:var(--font-mono);color:var(--text-secondary);justify-content:space-between;display:flex}.download-btn{border-radius:var(--radius-xs);background:var(--accent-action);color:var(--text-inverse);text-align:center;padding:.5rem 1rem;font-size:.82rem;font-weight:500;text-decoration:none}@media (width<=680px){.site-header{padding:1rem 1.25rem}.main{padding:1.75rem 1.25rem 3.5rem}.wish-grid,.wall-silhouette{grid-template-columns:1fr}.inbox-grid{grid-template-columns:repeat(auto-fill,minmax(95px,1fr))}.quick-help{padding:1.25rem}.modal{padding:1.5rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
