:root{--bg:#f5f7fa;--card:#fff;--text:#1c2430;--muted:#6b7585;--border:#e3e8ef;--primary:#2b9bd8;--primary-strong:#1c7fb8;--on-primary:#fff;--primary-soft:#e6f4fc;--primary-text:#1a74a8;--danger:#d93025;--ok:#1e8e3e;--radius:12px;--shadow:0 1px 2px #1018280f, 0 1px 3px #10182814;--g-language:#ec6f63;--g-music:#6c5ce7;--g-art:#e08a00;--g-computer:#12a383;--g-exercise:#2880ba;--g-study:#d45d97;--g-etc:#6b7585;color:var(--text);background:var(--bg);font-family:Pretendard,system-ui,-apple-system,Apple SD Gothic Neo,Malgun Gothic,sans-serif;line-height:1.5}@media (prefers-color-scheme:dark){:root{--bg:#0f1217;--card:#181c23;--text:#e7e9ee;--muted:#9aa3b2;--border:#2a303b;--primary:#3aa8e4;--primary-strong:#63bdf0;--primary-soft:#14303f;--primary-text:#7cc8f5;--danger:#f28b82;--ok:#81c995;--shadow:none;--g-language:#f28b82;--g-music:#a29bfe;--g-art:#fbbc5a;--g-computer:#4fd1b0;--g-exercise:#74b9e8;--g-study:#f09ac3;--g-etc:#9aa3b2}}*{box-sizing:border-box}body{background:var(--bg);flex-direction:column;min-height:100vh;margin:0;display:flex}#root{flex-direction:column;flex:1;display:flex}a{color:var(--primary-text);text-decoration:none}a:hover{text-decoration:underline}h1,h2{line-height:1.3}.muted{color:var(--muted)}.small{font-size:13px}.header{z-index:10;background:var(--card);border-bottom:1px solid var(--border);position:sticky;top:0}.header-inner{justify-content:space-between;align-items:center;gap:12px;max-width:1040px;margin:0 auto;padding:10px 16px;display:flex}.logo{color:var(--text);white-space:nowrap;flex:none;align-items:center;gap:8px;font-size:18px;font-weight:800;display:inline-flex}.logo:hover{text-decoration:none}.nav{gap:4px;display:flex}.nav-link{color:var(--muted);white-space:nowrap;border-radius:8px;padding:6px 10px;font-size:15px;font-weight:600}.nav-link:hover{background:var(--bg);text-decoration:none}.nav-link.active{color:var(--primary-text);background:var(--primary-soft)}@media (width<=400px){.header-inner{gap:6px;padding:8px 12px}.logo{gap:6px;font-size:16px}.nav-link{padding:6px 7px;font-size:14px}}.dev-banner{text-align:center;color:#7a5a00;background:#fff4d6;margin:0;padding:4px 16px;font-size:12px}@media (prefers-color-scheme:dark){.dev-banner{color:#f5d77a;background:#3a3014}}.footer{text-align:center;color:var(--muted);border-top:1px solid var(--border);margin-top:48px;padding:24px 16px;font-size:13px}.footer nav{justify-content:center;gap:16px;margin-bottom:6px;display:flex}.footer p{margin:0}.container{flex:1;width:100%;max-width:1040px;margin:0 auto;padding:20px 16px}.page-title{margin:0 0 16px;font-size:22px}button,.button{font:inherit;cursor:pointer;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:9px 16px;font-size:15px;font-weight:600;text-decoration:none;display:inline-flex}button:hover:not(:disabled),.button:hover{border-color:var(--muted);text-decoration:none}button.primary,.button.primary{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}button.primary:hover:not(:disabled),.button.primary:hover{background:var(--primary-strong);border-color:var(--primary-strong)}button:disabled{opacity:.55;cursor:default}button.danger{color:var(--danger)}button.link{color:var(--primary-text);background:0 0;border:none;padding:4px 6px;font-weight:500}button.link:hover{text-decoration:underline}input,select,textarea{font:inherit;border:1px solid var(--border);background:var(--card);width:100%;color:var(--text);border-radius:10px;padding:10px 12px;font-size:16px}textarea{resize:vertical;line-height:1.6}input:focus,select:focus,textarea:focus{outline:2px solid var(--primary);outline-offset:-1px;border-color:#0000}.actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.actions.spread{justify-content:space-between}.actions.start{justify-content:flex-start}.counter{color:var(--muted);text-align:right;font-size:12px;display:block}.error{color:var(--danger)}.notice{background:var(--primary-soft);border-radius:10px;padding:10px 12px;font-size:14px}.empty{text-align:center;color:var(--muted);padding:32px 0}.more{text-align:center;margin:20px 0}.more button{min-width:160px}.tag{background:var(--border);color:var(--muted);white-space:nowrap;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:700}.hero{border-radius:var(--radius);color:#fff;background:linear-gradient(135deg,#2b9bd8,#39b7b0);margin-bottom:16px;padding:28px 24px}.hero h1{margin:0 0 8px;font-size:clamp(24px,5vw,34px)}.hero p{opacity:.92;margin:0 0 16px}.hero .button.primary{color:#1a74a8;background:#fff;border-color:#fff}.filters{grid-template-columns:repeat(3,1fr) auto;align-items:end;gap:10px;margin-bottom:16px;display:grid}.filters label span,.form label>span,.form legend{color:var(--muted);margin-bottom:4px;font-size:13px;font-weight:600;display:block}@media (width<=720px){.filters{grid-template-columns:1fr 1fr}.filters label:last-of-type{grid-column:span 2}}.lesson-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin:0;padding:0;list-style:none;display:grid}@media (width<=360px){.lesson-grid{grid-template-columns:1fr}}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);transition:transform .15s,border-color .15s}.card:hover{border-color:var(--primary);transform:translateY(-2px)}.card.closed{opacity:.6}.card-link{height:100%;color:var(--text);flex-direction:column;gap:10px;padding:16px;display:flex}.card-link:hover{text-decoration:none}.card-top{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.card-content{white-space:pre-line;word-break:break-word;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;flex:1;margin:0;display:-webkit-box;overflow:hidden}.card-place,.card-meta{color:var(--muted);flex-wrap:wrap;gap:4px 12px;margin:0;font-size:13px;display:flex}.author{color:var(--text);font-weight:600}.exchange{flex-wrap:wrap;align-items:center;gap:6px;display:inline-flex}.swap{color:var(--muted);font-weight:700}.swap.big{align-self:center;padding-top:18px;font-size:22px}.cat{--c:var(--g-etc);border:1.5px solid var(--c);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:14px;font-weight:700;display:inline-flex}.cat-kind{opacity:.85;font-size:11px;font-weight:600}.cat-teach{background:var(--c);color:#fff}.cat-learn{color:var(--c)}@media (prefers-color-scheme:dark){.cat-teach{color:#111}}.g-language{--c:var(--g-language)}.g-music{--c:var(--g-music)}.g-art{--c:var(--g-art)}.g-computer{--c:var(--g-computer)}.g-exercise{--c:var(--g-exercise)}.g-study{--c:var(--g-study)}.lesson{max-width:720px;margin:0 auto}.crumb{color:var(--muted);margin:0 0 12px;font-size:14px}.lesson-head{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.lesson-head .cat{padding:5px 14px;font-size:16px}.lesson-info{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0;padding:12px;display:grid}.lesson-info div{min-width:0}.lesson-info dt{color:var(--muted);font-size:12px}.lesson-info dd{overflow-wrap:anywhere;margin:0;font-weight:600}@media (width<=520px){.lesson-info{grid-template-columns:1fr 1fr}}.lesson-content{white-space:pre-wrap;word-break:break-word;margin:20px 0;font-size:17px;line-height:1.75}.author-box{border-left:3px solid var(--primary);background:var(--card);border-radius:0 10px 10px 0;padding:12px 14px}.author-box p{color:var(--muted);white-space:pre-wrap;margin:4px 0 0;font-size:14px}.owner-actions{flex-wrap:wrap;gap:8px;margin:16px 0;display:flex}.section{margin-top:28px}.section h2{margin:0 0 10px;font-size:18px}.apply-box{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.apply-box p{margin:0 0 12px}.form-foot{justify-content:space-between;align-items:center;margin-top:8px;display:flex}.app-list{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.app{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:8px;padding:14px;display:flex}.app-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.app-lesson{color:var(--text);align-items:center;gap:8px;display:inline-flex}.app-from,.app-message{margin:0}.app-message{white-space:pre-wrap;word-break:break-word}.app-reply{background:var(--primary-soft);border-radius:10px;padding:10px 12px}.app-reply p{white-space:pre-wrap;margin:2px 0 0}.app-answer{flex-direction:column;gap:8px;display:flex}.status{border-radius:999px;margin-left:auto;padding:3px 10px;font-size:12px;font-weight:700}.s-pending{color:#7a5a00;background:#fff4d6}.s-accepted{color:var(--ok);background:#e3f4e8}.s-rejected{background:var(--border);color:var(--muted)}@media (prefers-color-scheme:dark){.s-pending{color:#f5d77a;background:#3a3014}.s-accepted{background:#16301f}}.form{flex-direction:column;gap:16px;max-width:720px;margin:0 auto;display:flex}.form.narrow{max-width:480px}.form label{display:block}.form .row{align-items:flex-start;gap:12px;display:flex}.form .row>label{flex:1;min-width:0}@media (width<=560px){.form .row{flex-direction:column;align-items:stretch}.swap.big{display:none}}.ages{border:none;align-items:center;gap:8px;margin:0;padding:0;display:flex}.ages input{width:90px}.form .check{align-items:center;gap:8px;font-size:15px;display:flex}.form .check input{width:auto}.auth{max-width:400px;margin:0 auto}.auth-box{flex-direction:column;gap:12px;display:flex}.google-btn{color:#1f1f1f;background:#fff;border:1px solid #747775;border-radius:10px;justify-content:center;align-items:center;gap:10px;width:100%;height:44px;padding:0 12px;font-family:Roboto,Arial,sans-serif;font-size:15px;font-weight:500;display:inline-flex}.google-btn:hover:not(:disabled){background:#f7f8f8;border-color:#747775}.google-btn-logo{flex:none;width:18px;height:18px}@media (prefers-color-scheme:dark){.google-btn{color:#e3e3e3;background:#131314;border-color:#8e918f}.google-btn:hover:not(:disabled){background:#1f1f20}}.me-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.me-name{font-size:20px}.me-head p{margin:4px 0 0}.tabs{border-bottom:1px solid var(--border);gap:4px;margin-bottom:16px;display:flex;overflow-x:auto}.tabs .tab{color:var(--muted);background:0 0;border:none;border-bottom:2px solid #0000;border-radius:0;margin-bottom:-1px;padding:10px 14px}.tabs .tab.active{color:var(--text);border-bottom-color:var(--primary)}.about{max-width:720px;margin:0 auto;font-size:16px;line-height:1.75}.steps{counter-reset:step;gap:10px;padding:0;list-style:none;display:grid}.steps li{counter-increment:step;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;padding:14px 14px 14px 56px;display:flex;position:relative}.steps li:before{content:counter(step);background:var(--primary);color:#fff;border-radius:50%;place-items:center;width:28px;height:28px;font-weight:700;display:grid;position:absolute;top:14px;left:14px}.tips{padding-left:20px}.lesson-form{gap:20px}.lesson-form .label{color:var(--text);margin-bottom:8px;font-size:14px;font-weight:700;display:block}.lesson-form .label.small{color:var(--muted);margin-bottom:6px;font-size:13px;font-weight:600}.lesson-form label>.label{margin-bottom:6px}.req{color:var(--danger);font-weight:700}.form-section{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);flex-direction:column;gap:18px;min-width:0;margin:0;padding:16px;display:flex}.form-section legend,.legend-like{color:var(--text);align-items:center;gap:8px;margin:0 0 0 -6px;padding:0 6px;font-size:16px;font-weight:800;display:flex}.form-section .step{background:var(--primary);color:#fff;border-radius:50%;place-items:center;width:24px;height:24px;font-size:13px;display:inline-grid}.preview-section{background:0 0;border-style:dashed}.field{flex-direction:column;min-width:0;display:flex}.field:focus{outline:none}.sub-field{margin-top:12px}.label-row{justify-content:space-between;align-items:center;display:flex}.label-row .label{white-space:nowrap;margin:0}.lesson-form .page-title{margin:0}.lesson-form .page-title+.muted{margin:-12px 0 0}.hint{margin:8px 0 0}.field-error{color:var(--danger);margin:6px 0 0;font-size:14px;font-weight:600}.field-error:before{content:"⚠ "}.field-warn{color:#7a5a00;background:#fff4d6;border-radius:8px;margin:8px 0 0;padding:8px 10px;font-size:14px}@media (prefers-color-scheme:dark){.field-warn{color:#f5d77a;background:#3a3014}}textarea[aria-invalid=true],input[aria-invalid=true]{border-color:var(--danger)}.counter .under{color:var(--danger);font-weight:600}.notice.draft{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.chips{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.chip{--c:var(--primary);border:1.5px solid var(--border);background:var(--card);color:var(--text);border-radius:999px;padding:7px 12px;font-size:14px;font-weight:600;position:relative}.chip:hover:not(:disabled){border-color:var(--c)}.chip.on{background:var(--c);border-color:var(--c);color:#fff}@media (prefers-color-scheme:dark){.chip.on{color:#111}}.chip:disabled{opacity:.4}.chip.group{--c:var(--g-etc)}.chip.group.g-language,.chip.item.g-language,.chip.on.g-language{--c:var(--g-language)}.chip.group.g-music,.chip.item.g-music,.chip.on.g-music{--c:var(--g-music)}.chip.group.g-art,.chip.item.g-art,.chip.on.g-art{--c:var(--g-art)}.chip.group.g-computer,.chip.item.g-computer,.chip.on.g-computer{--c:var(--g-computer)}.chip.group.g-exercise,.chip.item.g-exercise,.chip.on.g-exercise{--c:var(--g-exercise)}.chip.group.g-study,.chip.item.g-study,.chip.on.g-study{--c:var(--g-study)}.chip.group.on{color:var(--c);box-shadow:inset 0 0 0 1px var(--c);background:0 0}.chip .dot{background:var(--c);border:2px solid var(--card);border-radius:50%;width:9px;height:9px;position:absolute;top:-2px;right:-2px}.chip-sep{background:var(--border);width:1px;height:22px;margin:0 4px}.picker{border-radius:10px;flex-direction:column;gap:10px;display:flex}.picker:focus{outline:none}.picked{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.cat-empty{border:1.5px dashed var(--border);color:var(--muted);font-weight:600}.mode{color:var(--text);font-weight:700}.mode.online{color:var(--primary-text)}.levels{color:var(--muted);flex-wrap:wrap;gap:4px 16px;margin:10px 0 0;font-size:14px;display:flex}.levels strong{color:var(--text)}.card.preview:hover{border-color:var(--border);transform:none}.form-actions{z-index:5;background:var(--bg);border-top:1px solid var(--border);margin-top:-4px;padding:12px 0;position:sticky;bottom:0}.form-actions .error{margin:0 0 8px}@media (width<=560px){.form-section{padding:14px 12px}.form-actions .actions{flex-wrap:nowrap}.form-actions .actions>*{flex:1}}.talent-grid{grid-template-columns:1fr auto 1fr;align-items:start;gap:12px;display:grid}.talent-card{border:1.5px solid var(--primary);border-radius:var(--radius);background:var(--card);min-width:0;overflow:hidden}.talent-card.invalid{border-color:var(--danger);box-shadow:0 0 0 2px color-mix(in srgb, var(--danger) 25%, transparent)}.talent-head{padding:10px 14px;font-size:15px;font-weight:800}.talent-card.teach .talent-head{background:var(--primary);color:#fff}.talent-card.teach .talent-head .req{color:#fff}.talent-card.learn .talent-head{color:var(--primary-text);border-bottom:1px solid var(--border);background:var(--primary-soft)}.head-note{opacity:.8;margin-left:4px;font-size:12px;font-weight:600}.talent-body{flex-direction:column;gap:10px;padding:14px;display:flex}.talent-swap{color:var(--muted);align-self:center;font-size:22px;font-weight:800}.talent-level{border-top:1px dashed var(--border);margin-top:4px;padding-top:12px}.mini-label{color:var(--muted);letter-spacing:.02em;margin-bottom:6px;font-size:12px;font-weight:700;display:block}.picker .items-box{background:var(--bg);border-radius:10px;padding:10px}.picker .items-box .chips.items{background:0 0;padding:0}.picker-foot{text-align:right;margin-top:-4px}.picked-summary{background:var(--bg);border-radius:10px;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;font-size:16px;display:flex}.picked-summary .path strong{font-size:17px}.chip.add{color:var(--primary-text);border-style:dashed}@media (width<=760px){.talent-grid{grid-template-columns:1fr;gap:6px}.talent-swap{justify-self:center;line-height:1;transform:rotate(90deg)}}.header{padding-top:env(safe-area-inset-top,0px)}.footer{padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}.form-actions{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}.danger-zone{border-top:1px solid var(--border);margin-top:40px;padding-top:20px}.danger-zone h2{color:var(--muted);margin:0;font-size:16px}.danger-zone ul{margin:0;padding-left:20px;line-height:1.8}.danger-zone p{margin:0}button.danger-fill{background:var(--danger);border-color:var(--danger);color:#fff}button.danger-fill:hover:not(:disabled){filter:brightness(.95);border-color:var(--danger)}button.link.danger{color:var(--danger);padding-left:0}.policy{max-width:760px;margin:0 auto;font-size:15px;line-height:1.75}.policy h1{font-size:24px}.policy h2{margin:28px 0 8px;font-size:17px}.policy table{border-collapse:collapse;width:100%;margin:8px 0;font-size:14px}.policy th,.policy td{border:1px solid var(--border);text-align:left;vertical-align:top;padding:8px 10px}.policy th{background:var(--bg);font-weight:700}.policy .table-wrap{overflow-x:auto}.policy .meta{color:var(--muted);font-size:14px}
