:root { --ink:#20222d; --blue:#75d6ff; --lime:#dcff55; --purple:#d9ccff; --pink:#ffb8db; --line:#d9dbe5; --paper:#f8f9ff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:linear-gradient(135deg,#fff 0%,#f7f8ff 48%,#f1efff 100%); font-family:"Zen Kaku Gothic New",sans-serif; min-height:100vh; }
body:before { content:""; position:fixed; inset:0; pointer-events:none; background-image:radial-gradient(#c9cbd8 1px,transparent 1px); background-size:16px 16px; opacity:.2; z-index:-1; }
button,input,textarea { font:inherit; } button { cursor:pointer; color:inherit; }
.orb { position:fixed; border-radius:50%; filter:blur(2px); opacity:.38; z-index:-1; } .orb-one { width:260px;height:260px;background:var(--blue);top:100px;right:-100px; } .orb-two { width:220px;height:220px;background:var(--purple);bottom:50px;left:-100px; }
.site-header { max-width:1160px; margin:auto; padding:21px 24px; display:flex; align-items:center; justify-content:flex-end; }
.name-button { border:1px solid var(--ink); background:rgba(255,255,255,.7); padding:8px 11px; border-radius:99px; font-size:12px; font-weight:700; box-shadow:3px 3px 0 var(--purple); }.dot { display:inline-block;width:7px;height:7px;background:#a4df00;border-radius:50%;margin-right:5px; }
main { max-width:1160px; margin:auto; padding:0 24px 80px; }.hero { padding:55px 0 48px; position:relative; }.eyebrow { font-family:"DM Mono",monospace; font-size:11px; letter-spacing:.08em; margin:0 0 10px; }.eyebrow span { color:#965cff; }
h1,h2,p { margin-top:0; } h1 { font-size:clamp(44px,8vw,90px); line-height:1.03; letter-spacing:-.1em; margin-bottom:20px; font-weight:900; }.hero-copy,.speech { white-space:pre-line; }.hero-copy { font-size:15px; font-weight:500; line-height:1.8; }
.tabs { display:flex; gap:26px; border-bottom:1px solid var(--line); margin-bottom:38px; }.tabs a { color:#747789;text-decoration:none;padding:0 2px 13px;font-weight:700;font-size:14px; }.tabs a.active { color:var(--ink);border-bottom:3px solid var(--ink); }.tabs b { font-family:"DM Mono";font-size:10px;background:var(--ink);color:white;padding:2px 5px;border-radius:20px; }
.section { scroll-margin-top:20px; margin-bottom:78px; }.section-heading { display:flex;align-items:end;justify-content:space-between;margin-bottom:20px; }.section-heading h2 { font-size:28px;letter-spacing:-.07em;margin:0; }.round-button { width:38px;height:38px;border:1px solid var(--ink);background:var(--lime);border-radius:50%;font-size:25px;line-height:1;box-shadow:3px 3px 0 var(--ink); }
.property-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px; }.property-card { overflow:hidden;text-align:left;border:1px solid var(--ink);border-radius:15px;background:rgba(255,255,255,.75);padding:0;box-shadow:4px 4px 0 rgba(32,34,45,.16);transition:transform .2s,box-shadow .2s; }.property-card:hover { transform:translate(-2px,-3px);box-shadow:7px 8px 0 var(--purple); }.card-photo { aspect-ratio:1.32;position:relative;background:#e4e4e7;overflow:hidden; }.card-photo img { width:100%;height:100%;object-fit:cover;display:block; }.card-body { padding:14px; }.card-title-row { display:flex;justify-content:space-between;gap:8px;align-items:start; }.card-title-row h3 { font-size:18px;letter-spacing:-.06em;margin:0 0 4px;line-height:1.25; }.price { color:#5e5bf0;font:500 15px "DM Mono";white-space:nowrap; }.details { color:#676a79;font-size:11px;margin:8px 0 0; }.details span+span:before { content:" / "; color:#aaa; }.card-foot { display:flex;justify-content:space-between;margin-top:13px;border-top:1px solid #e7e7ed;padding-top:9px;font-size:11px;color:#555; }.card-foot b { color:var(--ink); }
.speech { background:var(--pink);border:1px solid var(--ink);border-radius:10px;padding:8px 11px;font-size:10px;font-weight:700;line-height:1.35;transform:rotate(3deg);box-shadow:2px 2px 0 var(--ink); }.panel { border:1px solid var(--ink);border-radius:15px;background:rgba(255,255,255,.75);box-shadow:4px 4px 0 var(--blue);padding:16px; }.form-top { display:flex;justify-content:space-between;margin-bottom:10px;font-size:13px; }.form-top span { font-size:11px;color:#777; }
input,textarea,select { border:1px solid #c7c9d5;background:#fff;border-radius:7px;padding:10px;width:100%;outline:none; } input:focus,textarea:focus,select:focus { border-color:#6860e6;box-shadow:0 0 0 3px #d9ccff88; } textarea { resize:vertical;display:block;margin-top:8px; }.primary-button { border:1px solid var(--ink);border-radius:7px;background:var(--blue);padding:10px 13px;font-weight:900;box-shadow:2px 2px 0 var(--ink);margin-top:10px; }.primary-button span { margin-left:8px;font-size:16px; }.recommend-list { margin-top:17px;display:grid;gap:10px; }.recommendation { background:rgba(255,255,255,.68);border:1px solid #d3d5e0;border-radius:12px;padding:14px; }.recommendation-top { display:flex;align-items:center;justify-content:space-between;gap:12px; }.recommendation a { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#4d48ca;font-size:13px;font-weight:700; }.recommendation small,.comment small { color:#767988;font-size:10px; }.recommendation p { margin:9px 0 0;font-size:13px; }.recommend-actions { display:flex;gap:7px;align-items:center;margin-top:12px; }.tiny-button { border:1px solid #bfc2ce;background:#fff;border-radius:99px;padding:5px 8px;font-size:11px; }.tiny-button.agreed { background:var(--lime);border-color:var(--ink); }.delete-button { border:0;background:transparent;color:#8b8d9a;font-size:11px;margin-left:auto;text-decoration:underline; }
footer { padding:25px;text-align:center;border-top:1px solid var(--line);font:10px "DM Mono";letter-spacing:.05em;color:#717482; } footer span { color:#ff6eaf; }
dialog { color:var(--ink); }.modal { border:1px solid var(--ink);border-radius:18px;max-width:min(720px,calc(100% - 24px));width:100%;max-height:calc(100vh - 24px);overflow:auto;padding:0;background:#f9faff;box-shadow:8px 8px 0 var(--purple); }.modal::backdrop { background:#32344580;backdrop-filter:blur(3px); }.modal form { padding:24px;position:relative; }.small-modal { max-width:390px; }.small-modal h2,.editor-modal h2 { letter-spacing:-.07em;margin:0 0 10px;font-size:27px; }.small-modal p:not(.eyebrow) { color:#626574;font-size:13px; }.close { position:absolute;right:15px;top:12px;border:0;background:transparent;font-size:27px;line-height:1; }.small-modal .primary-button { width:100%; }.property-hero { display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:start; }.property-hero-image { width:100%;aspect-ratio:1;object-fit:cover;border-radius:11px; }.property-heading h2 { font-size:31px;line-height:1.15;letter-spacing:-.08em;margin:0 0 9px; }.property-heading .price { font-size:20px; }.meta { display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:16px 0; }.meta div { background:white;border-radius:7px;padding:8px;font-size:11px; }.meta b { display:block;color:#777;font:9px "DM Mono";margin-bottom:2px; }.outbound { display:inline-block;color:var(--ink);text-decoration:none;background:var(--lime);border:1px solid var(--ink);border-radius:7px;padding:9px 11px;font-size:12px;font-weight:900;box-shadow:2px 2px 0 var(--ink); }.gallery-title { display:flex;justify-content:space-between;align-items:center;margin:26px 0 8px; }.gallery-title h3 { margin:0;font-size:17px; }.gallery { display:grid;grid-auto-flow:column;grid-auto-columns:128px;gap:8px;overflow-x:auto;padding-bottom:8px; }.gallery-item { position:relative; }.gallery img { width:128px;height:100px;object-fit:cover;border-radius:7px;border:1px solid #ddd;display:block; }.remove-image { position:absolute;top:4px;right:4px;border:1px solid var(--ink);background:#fff;border-radius:50%;width:22px;height:22px;font-weight:700;line-height:1;padding:0; }.vote-section,.comments-section { margin-top:24px;border-top:1px solid #dfe1e9;padding-top:20px; }.vote-section h3,.comments-section h3 { font-size:18px;letter-spacing:-.05em;margin:0 0 6px; }.vote-summary { color:#666;font-size:11px;margin-bottom:11px; }.vote-options { display:grid;grid-template-columns:repeat(4,1fr);gap:7px; }.vote-options button { border:1px solid #bfc2ce;background:#fff;border-radius:7px;padding:9px 4px;font-size:11px;font-weight:700; }.vote-options button.selected { background:var(--lime);border-color:var(--ink);box-shadow:2px 2px 0 var(--ink); }.comment-form { display:grid;grid-template-columns:1fr auto;gap:8px;margin:12px 0; }.comment-form .primary-button { margin:0;padding:8px 10px; }.comment-list { display:grid;gap:8px; }.comment { padding:10px;border-radius:8px;background:#fff;border:1px solid #e2e3eb;font-size:12px; }.comment p { margin:4px 0 0; }.comment-head { display:flex;align-items:center;gap:7px; }.comment-head .delete-button { font-size:10px; }
.editor-modal { max-width:560px; }.editor-modal label { font-size:11px;font-weight:700;display:block;margin:10px 0; }.editor-modal label input,.editor-modal label textarea { margin-top:4px;font-size:13px;font-weight:400; }.two-columns { display:grid;grid-template-columns:1fr 1fr;gap:10px; }.care-note { border-radius:7px;padding:8px;background:#fff2f8;font-size:11px;color:#a64678; }
@media (max-width:620px) { .site-header,main { padding-left:16px;padding-right:16px; }.hero { padding:38px 0 42px; }.property-grid { grid-template-columns:1fr;gap:14px; }.property-card { display:grid;grid-template-columns:42% 58%; }.card-photo { aspect-ratio:auto;height:100%;min-height:154px; }.card-body { padding:13px; }.property-hero { grid-template-columns:1fr;gap:14px; }.property-hero-image { aspect-ratio:1.5; }.vote-options { grid-template-columns:1fr 1fr; }.comment-form { grid-template-columns:1fr; }.comment-form .primary-button { justify-self:start; }.modal form { padding:20px 16px; } }
/* Voter names are shown directly below each choice in the property dialog. */
.vote-option { min-width:0; text-align:center; }
.vote-options .vote-option button { width:100%; }
.vote-voters { display:block; min-height:1.5em; margin-top:5px; color:#666; font-size:10px; line-height:1.35; overflow-wrap:anywhere; }