:root { color-scheme:light; --page:#fff; --ink:#171717; --muted:#686868; --line:#e5e5e5; --soft:#f7f7f7; --danger:#a12525; }
* { box-sizing:border-box; }
body { margin:0; background:var(--page); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif; font-size:16px; line-height:1.65; word-break:keep-all; overflow-wrap:anywhere; }
[hidden] { display:none !important; }
a { color:inherit; }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:wait; opacity:.55; }
:focus-visible { outline:2px solid var(--ink); outline-offset:4px; }
h1:focus { outline:0; }
h1,h2,p { margin:0; }
h1 { font-size:26px; font-weight:650; line-height:1.4; letter-spacing:-.8px; word-break:keep-all; }
.site-header { max-width:600px; min-height:88px; margin:auto; padding:20px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--ink); text-decoration:none; font-weight:700; font-size:19px; letter-spacing:-.5px; min-height:44px; }
.brand span { color:var(--muted); font-size:13px; font-weight:400; letter-spacing:0; }
main { max-width:600px; margin:auto; padding:44px 24px 72px; }
.lead,.context { color:var(--muted); font-size:14px; margin-top:12px; }
.category-list { display:grid; }
#choose-screen .category-list,#question-options { margin-top:28px; border-top:1px solid var(--line); }
.category { width:100%; text-align:left; border:0; border-bottom:1px solid var(--line); border-radius:0; background:var(--page); color:var(--ink); padding:20px 28px 20px 0; position:relative; }
.category::after { content:'›'; position:absolute; right:4px; top:50%; transform:translateY(-50%); font-size:22px; font-weight:400; color:var(--muted); }
.category:hover { background:var(--soft); }
.category strong { display:block; font-size:16px; font-weight:500; letter-spacing:-.2px; }
.category .ticket-meta { display:flex; flex-wrap:wrap; gap:3px 12px; font-size:12px; color:var(--muted); margin-top:6px; }
.footnote { color:var(--muted); font-size:13px; margin-top:28px; }
.text-button { color:var(--muted); border:0; background:transparent; padding:10px 0; min-height:44px; font-size:14px; text-decoration:none; }
.text-button:hover { color:var(--ink); text-decoration:underline; text-underline-offset:4px; }
#change-category { margin:-12px 0 20px; }
.step { color:var(--muted); font-size:13px; margin:16px 0 12px; }
.guidance-copy { margin:24px 0; padding-left:22px; font-size:15px; }
.guidance-copy:empty,.guidance-links:empty { display:none; }
.guidance-copy li+li { margin-top:12px; }
.guidance-links { display:grid; gap:12px; margin-top:16px; }
.guidance-links a { width:fit-content; text-underline-offset:4px; font-size:15px; padding:8px 0; }
.receipt-guide { margin:-16px 0 24px; font-size:13px; }
.receipt-guide p { margin:0 0 10px; }
.receipt-guide a { display:inline-block; padding:6px 0; text-underline-offset:4px; }
.attachment-field { margin:24px 0; }
input[type=file] { padding:10px; font-size:13px; }
input[type=file]::file-selector-button { font:inherit; padding:7px 12px; margin-right:12px; border:1px solid var(--line); background:var(--soft); border-radius:3px; cursor:pointer; }
.attachment-list { list-style:none; margin:12px 0 20px; padding:0; font-size:13px; }
.attachment-list li { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--line); padding:8px 0; }
.attachment-list a { text-underline-offset:3px; overflow-wrap:anywhere; }
.attachment-list button { flex-shrink:0; }
.thread-attachments { margin-top:28px; }
.thread-attachments h2 { font-size:15px; font-weight:600; }
.thread-attachments .field { margin-top:20px; }
.info { border-left:2px solid var(--ink); padding:8px 12px; margin:24px 0; font-size:14px; }
.additional-fields { border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin:28px 0; }
summary { cursor:pointer; min-height:56px; padding:15px 0; font-size:14px; }
.privacy-note { margin:12px 0 20px; color:var(--muted); font-size:12px; }
form { margin-top:30px; }
.field { display:flex; flex-direction:column; gap:8px; margin-bottom:24px; min-width:0; }
.field>span { font-size:14px; font-weight:600; }
.optional,.required { font-size:12px; font-weight:400; color:var(--muted); margin-left:5px; }
input,textarea,select { width:100%; max-width:100%; color:var(--ink); background:var(--page); border:1px solid #c9c9c9; border-radius:4px; padding:12px; min-height:48px; }
input::placeholder,textarea::placeholder { color:#757575; }
textarea { resize:vertical; }
small { font-size:12px; color:var(--muted); }
.error { color:var(--danger); }
[aria-invalid=true] { border-color:var(--danger); }
.error-box { border-left:2px solid var(--danger); padding:10px 12px; margin:18px 0; color:var(--danger); font-size:14px; }
.primary,.secondary { border-radius:4px; min-height:46px; padding:10px 20px; font-size:14px; font-weight:600; }
.primary { background:var(--ink); color:#fff; border:1px solid var(--ink); }
.primary:hover { background:#333; }
.secondary { background:var(--page); color:var(--ink); border:1px solid #c9c9c9; }
.secondary:hover { background:var(--soft); }
.submit-button { display:block; min-width:120px; margin-left:auto; }
.status { margin-top:12px; color:var(--muted); font-size:13px; }
.status:empty { display:none; }
.toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; }
#tickets-screen>.toolbar { margin:28px 0 8px; }
#thread-screen>.toolbar { margin:-12px 0 24px; }
.thread-meta { display:flex; flex-wrap:wrap; gap:6px 16px; color:var(--muted); font-size:13px; margin-top:12px; }
.messages { list-style:none; padding:0; margin:32px 0 0; border-top:1px solid var(--line); }
.message { padding:24px 0; border-bottom:1px solid var(--line); }
.message header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; font-size:13px; }
.message header strong { font-weight:600; }
.message time { color:var(--muted); font-size:12px; }
.message p { white-space:pre-wrap; font-size:15px; line-height:1.8; }
.unread { display:inline-block; color:var(--ink); font-size:12px; font-weight:600; margin-bottom:5px; }
.unread::before { content:''; display:inline-block; width:5px; height:5px; margin:0 6px 2px 0; border-radius:50%; background:currentColor; }
.recovery { border:1px solid var(--line); border-radius:4px; padding:18px; margin:28px 0; font-size:13px; }
.recovery p { color:var(--muted); margin-top:6px; }
#guest-link-box .field { margin:14px 0 10px; }
#guest-link { font-size:13px; }
#copy-status:empty { display:none; }
#list-pagination { margin-top:24px; }
.skip-link { position:absolute; top:8px; left:8px; z-index:5; padding:12px; background:var(--page); transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:480px) { .site-header { min-height:72px; padding:14px 20px; } main { padding:28px 20px 48px; } h1 { font-size:24px; } .brand { font-size:18px; gap:10px; } .category { padding-top:18px; padding-bottom:18px; } .submit-button { width:100%; } }